برنامه نویسی

10 بهترین روش برای تست جاوا اسکریپت و اشکال زدایی

من بسیاری از توسعه دهندگان را دیده ام که با آزمایش و اشکال زدایی کد خود دست و پنجه نرم می کنند. با این حال، لازم نیست تجربه دردناکی باشد! با اعمال درست، می توانید به راحتی کد جاوا اسکریپت خود را بدون دردسر تست و اشکال زدایی کنید.

اجازه دهید در مورد 10 بهترین روش برای آزمایش و اشکال زدایی جاوا اسکریپت که هر توسعه دهنده مبتدی باید بداند صحبت کنیم.

1. از یک چارچوب تست استفاده کنید

یکی از روش های معمول برای تست در جاوا اسکریپت استفاده از چارچوب تست است. فریمورک‌های تست محبوب زیادی مانند Jest، Mocha و Jasmine وجود دارند که می‌توانند به شما در نوشتن سریع و آسان تست‌ها کمک کنند. این چارچوب‌ها مجموعه‌ای از ابزارها و APIها را برای ایجاد تست‌ها، ادعاها و مجموعه‌های آزمایشی ارائه می‌کنند.
مثال استفاده از Jest برای آزمایش یک تابع

function add(a, b) {
  return a + b;
}

test('adds 1 + 2 to equal 3', () => {
  expect(add(1, 2)).toBe(3);
});

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

2. تست های واحد را بنویسید

تست های واحد بخشی ضروری از تست کد جاوا اسکریپت هستند. این تست‌ها بر روی آزمایش قطعات کوچک و جدا شده از کد، مانند توابع یا روش‌های جداگانه تمرکز دارند. نوشتن تست‌های واحد تضمین می‌کند که کد شما مطابق انتظار عمل می‌کند و به شناسایی اشکالات در مراحل اولیه توسعه کمک می‌کند.
نمونه ای از آزمون واحد با استفاده از موکا:

describe('Array', function() {
  describe('#indexOf()', function() {
    it('should return -1 when the value is not present', function() {
      assert.equal([1,2,3].indexOf(4), -1);
    });
  });
});
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

3. موارد لبه تست

تست لبه ها بخش مهمی از تست کد جاوا اسکریپت است. موارد لبه سناریوهایی هستند که بعید به نظر می رسند اما هنوز باید آزمایش شوند.
اینها می تواند شامل سناریوهای منفی، شرایط مرزی و سناریوهای غیر معمول باشد. هنگامی که موارد لبه را آزمایش می کنید، می توانید مطمئن شوید که کد شما قوی است و می تواند ورودی ها یا سناریوهای غیرمنتظره را مدیریت کند.

نمونه ای از آزمایش یک مورد لبه:

function divide(a, b) {
  if (b === 0) {
    throw new Error('Cannot divide by zero');
  }
  return a / b;
}

test('divides two numbers', () => {
  expect(divide(6, 2)).toBe(3);
});

test('throws error when dividing by zero', () => {
  expect(() => divide(6, 0)).toThrow('Cannot divide by zero');
});
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

4. از اسامی آزمون تشریحی استفاده کنید

نام‌های تست تشریحی به شما و سایر توسعه‌دهندگان کمک می‌کنند تا بدون نیاز به خواندن کد تست، بفهمید که تست چه چیزی را آزمایش می‌کند.
مثال

test('adds two numbers', () => {
  expect(add(1, 2)).toBe(3);
});

test('returns -1 when the value is not present in the array', () => {
  expect([1,2,3].indexOf(4)).toBe(-1);
});
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

5. هر بار یک چیز را آزمایش کنید

وقتی چندین چیز را همزمان آزمایش می‌کنید، تشخیص علت خرابی یا باگ سخت‌تر می‌شود. تست کردن یک چیز در یک زمان، خواندن و درک تست های شما را آسان تر می کند.

مثال آزمایش یک چیز در یک زمان:

test('adds two positive numbers', () => {
  expect(add(1, 2)).toBe(3);
});

test('adds two negative numbers', () => {
  expect(add(-1, -2)).toBe(-3);
});
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

6. از ابزارهای رفع اشکال استفاده کنید

استفاده از ابزارهای اشکال زدایی یک روش مهم برای اشکال زدایی کد جاوا اسکریپت شماست. ابزارهای اشکال زدایی می توانند به شما کمک کنند تا خطاهای کد خود را سریع و کارآمد شناسایی و رفع کنید. برخی از ابزارهای رایج اشکال زدایی جاوا اسکریپت عبارتند از Chrome DevTools، Node.js Debugger و Visual Studio Code Debugger.

می‌توانید از Chrome DevTools برای اشکال‌زدایی مستقیم یک تابع از مرورگر مانند این مثال استفاده کنید:

function add(a, b) {
  return a + b;
}

console.log(add(1, 2));
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

وقتی یک دستور console.log اضافه می کنید، می توانیم نتیجه عملکرد را در کنسول ببینیم. همچنین می‌توانیم از DevTools برای گذر از کد و شناسایی هر گونه خطا یا مشکلی که ما را به بهترین روش بعدی می‌برد استفاده کنیم.

7. از دستورات console.log استفاده کنید

عبارات Console.log به شما امکان می دهد مقادیر و پیام ها را در کنسول چاپ کنید، که می تواند به شما در درک رفتار کدتان کمک کند.
مثال:

function add(a, b) {
  console.log(`Adding ${a} and ${b}`);
  return a + b;
}

console.log(add(1, 2));
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

8. الگوی AAA را دنبال کنید

الگوی AAA (Arrange, Act, Assert) یک الگوی محبوب برای سازماندهی آزمون های واحد است. الگوی AAA تست ها را به سه بخش تقسیم می کند: ترتیب داده ها، عمل بر روی داده ها و اثبات نتیجه.

پیروی از الگوی AAA باعث می شود آزمون های شما سازماندهی شده و درک آن آسان تر شود. مثال:

test('adds two numbers', () => {
  // Arrange
  const a = 1;
  const b = 2;

  // Act
  const result = add(a, b);

  // Assert
  expect(result).toBe(3);
});
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

9. کد خود را تغییر دهید

Refactoring شامل ایجاد تغییراتی در کد شما برای بهبود خوانایی، قابلیت نگهداری و عملکرد آن است. هنگامی که کد خود را تغییر می دهید، باید تست های خود را نیز به روز کنید تا مطمئن شوید که هنوز موفق می شوند.

مثال زیر نشان می‌دهد که چگونه می‌توانید یک تابع را تغییر شکل دهید:

// Original function
function add(a, b) {
  return a + b;
}

// Refactored function
function add(...numbers) {
  return numbers.reduce((sum, num) => sum + num, 0);
}
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

10. اغلب تست کنید

با آزمایش‌های مکرر، می‌توانید در مراحل اولیه توسعه باگ‌ها را شناسایی کنید، که می‌تواند در درازمدت باعث صرفه‌جویی در وقت و تلاش شما شود. همچنین باید هر زمان که تغییراتی ایجاد می کنید، کد خود را آزمایش کنید تا مطمئن شوید که همه چیز همچنان همانطور که انتظار می رود کار می کند.


test('adds two numbers', () => {
  expect(add(1, 2)).toBe(3);
});

test('adds three numbers', () => {
  expect(add(1, 2, 3)).toBe(6);
});

test('adds four numbers', () => {
  expect(add(1, 2, 3, 4)).toBe(10);
});
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

این تمرین‌ها به شما کمک می‌کند کد بهتری بنویسید، اشکالات را زودتر تشخیص دهید، و در زمان و تلاش خود صرفه‌جویی کنید. می‌توانید در نوشتن کد کارآمدتر و مؤثرتر شوید و به یاد داشته باشید که اغلب آزمایش کنید، از نام‌های آزمایشی توصیفی استفاده کنید و کد خود را برای حفظ کیفیت آن اصلاح کنید.

به من اطلاع دهید که کدام مورد مورد علاقه شماست و چگونه بهترین روش ها را در جاوا اسکریپت پیاده سازی می کنید.

کد نویسی مبارک!

نوشته های مشابه

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

همچنین ببینید
بستن
دکمه بازگشت به بالا