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

بهترین روش های کد نویسی در جاوا اسکریپت
نادر
تاریخ بروز رسانی : 30 اردیبهشت 1400
دسته بندی : آموزش جاوا اسکریپت

بفرست برای دوستات :

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

چند تا از مهمترین قوائد که بهتر است رعایت کنید :

از متغیرهای سراسری اجتناب کنید
از new تا حد ممکن استفاده نکنید
استفاده از عملگر == را تا حد ممکن کم کنید
از تابعeval() اجتناب کنید

از متغیرهای سراسری دوری کنید

استفاده از متغیرهای سراسری را به حداقل برسانید، زیرا متغیرها و توابع سراسری را می توان توسط اسکریپت های دیگر بازنویسی کرد و بدین صورت امنیت و صحت کد شما از بین می رود.

این قانون شامل همه انواع داده ها ، اشیا و توابع است.

در عوض از متغیرهای محلی استفاده کنید و نحوه استفاده از بسته ها را بیاموزید.

همیشه از متغیرهای محلی استفاده کنید

تمام متغیرهای مورد استفاده در یک تابع باید به عنوان متغیرهای محلی اعلام شوند.

متغیرهای محلی باید با کلمه کلیدی var یا کلمه کلیدی let اعلام شوند، در غیر این صورت به متغیرهای سراسری تبدیل می شوند.

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

تعریف ها در بالا

قرار دادن همه اعلانات و تعاریف در بالای هر اسکریپت یا تابع یک روش کدنویسی خوب است.

نتیجه این کار موارد زیر خواهد بود:

کد تمیزتر می نویسید
یک مکان واحد برای جستجوی متغیرهای محلی ایجاد می کنید
اجتناب از متغیرهای سراسری ناخواسته (ضمنی) را آسان تر می کنید
احتمال تعریف مجدد ناخواسته را کاهش می دهید

// ابتدا تعریف کنید
var firstName, lastName, price, discount, fullPrice;

 
// سپس استفاده کنید
firstName = "John";

lastName = "Doe";

price = 19.90;

discount = 0.10;

fullPrice = price - discount;

// ابتدا تعریف کنید

var firstName, lastName, price, discount, fullPrice;

// سپس استفاده کنید

firstName = "John";

lastName = "Doe";

price = 19.90;

discount = 0.10;

fullPrice = price - discount;

این مورد برای متغیرهای درون حلقه نیز باید رعایت شود:

// ابتدا تعاریف
var i;

// بعد استفاده
for (i = 0; i < 5; i++) 
 {

// ابتدا تعاریف

var i;

// بعد استفاده

for (i = 0; i < 5; i++)

{

به طور پیش فرض ، جاوا اسکریپت تمام تعاریف را به بالا ( Hoisting در جاوا اسکریپت ) منتقل می کند.

متغیرها را مقداردهی اولیه کنید

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

این کار نتایج زیر را به همراه خواهد داشت:

کد تمیزتر تولید می شود
یک مکان واحد برای شروع اولیه متغیرها فراهم می شود
از مقادیر تعریف نشده پرهیز می شود

// ابتدا تعریف و مقدار دهی اولیه را انجام دهید
var firstName = "",
lastName = "",
price = 0,
discount = 0,
fullPrice = 0,
myArray = [],
myObject = {};

// ابتدا تعریف و مقدار دهی اولیه را انجام دهید

var firstName = "",

lastName = "",

price = 0,

discount = 0,

fullPrice = 0,

myArray = [],

myObject = {};

مقداردهی اولیه متغیرها ایده استفاده مورد نظر (و نوع داده مورد نظر) را فراهم می کند.

هرگز شیء عددی، رشته ای یا بولین تعریف نکنید

همیشه اعداد ، رشته ها یا بولین ها را به صورت مقادیر ابتدایی تعریف کنید، نه به صورت اشیاء.

تعریف مقادیر ابتدایی به صورت شیء ، سرعت اجرا را کاهش داده و اثرات جانبی ناخوشایندی ایجاد می کند:

مثالها

var x = "John";

var y = new String("John");

(x === y) // is false because x is a string and y is an object.

var x = "John";

var y = new String("John");

(x === y) // is false because x is a string and y is an object.

خودتان آزمایش کنید

یا حتی بدتر:

مثالها

var x = new String("John");

var y = new String("John");

(x == y) // اشیا قابل مقایسه نیستند

var x = new String("John");

var y = new String("John");

(x == y) // اشیا قابل مقایسه نیستند

خودتان آزمایش کنید

از دستور `new()` استفاده نکنید

به جای new Object() از {} استفاده کنید
به جای new String() از "" استفاده کنید
به جای new Number() از 0 استفاده کنید
به جای new Boolean() از false استفاده کنید
به جای new Array() از [] استفاده کنید
به جای new RegExp() از /()/ استفاده کنید
به جای new Function() از function (){} استفاده کنید

مثالها

var x1 = {};  // new object

var x2 = ""; // new primitive string

var x3 = 0; // new primitive number

var x4 = false; // new primitive boolean

var x5 = []; // new array object

var x6 = /()/; // new regexp object

var x7 = function(){}; // new function object

var x1 = {}; // new object

var x2 = ""; // new primitive string

var x3 = 0; // new primitive number

var x4 = false; // new primitive boolean

var x5 = []; // new array object

var x6 = /()/; // new regexp object

var x7 = function(){}; // new function object

خودتان آزمایش کنید

مراقب تبدیل نوع خودکار باشید

مواظب باشید که اعداد می توانند به طور تصادفی به رشته یا NaN تبدیل شوند.

جاوا اسکریپت قوائد کدنویسی راحتی دارد. به همین دلیل یک متغیر می تواند شامل انواع داده های مختلف باشد ، و یک متغیر می تواند نوع داده خود را تغییر دهد:

مثالها

var x = "Hello"; // typeof x is a string

x = 5; // changes typeof x to a number

var x = "Hello"; // typeof x is a string

x = 5; // changes typeof x to a number

خودتان آزمایش کنید

هنگام انجام عملیات ریاضی ، جاوا اسکریپت می تواند اعداد را به رشته تبدیل کند:

مثالها

var x = 5 + 7;  // x.valueOf() is 12,  typeof x is a number

var x = 5 + "7";  // x.valueOf() is 57,  typeof x is a string

var x = "5" + 7;  // x.valueOf() is 57,  typeof x is a string

var x = 5 - 7;   // x.valueOf() is -2,  typeof x is a number

var x = 5 - "7";   // x.valueOf() is -2,  typeof x is a number

var x = "5" - 7;   // x.valueOf() is -2,  typeof x is a number

var x = 5 - "x";   // x.valueOf() is NaN, typeof x is a number

var x = 5 + 7; // x.valueOf() is 12, typeof x is a number

var x = 5 + "7"; // x.valueOf() is 57, typeof x is a string

var x = "5" + 7; // x.valueOf() is 57, typeof x is a string

var x = 5 - 7; // x.valueOf() is -2, typeof x is a number

var x = 5 - "7"; // x.valueOf() is -2, typeof x is a number

var x = "5" - 7; // x.valueOf() is -2, typeof x is a number

var x = 5 - "x"; // x.valueOf() is NaN, typeof x is a number

خودتان آزمایش کنید

با کم کردن یک رشته از یک رشته ، خطایی ایجاد نمی شود اما مقدار NaN (یک عدد نیست) بر می گرداند:

مثالها

"Hello" - "Dolly"   // returns NaN

1	"Hello" - "Dolly" // returns NaN

خودتان آزمایش کنید

از عملگر مقایسه ای === استفاده کنید

عملگر مقایسه ای == همیشه قبل از مقایسه، نوع عملوند ها را به ( نوع قابل تطبیق) تبدیل می کند.

در حالی که عملگر مقایسه ای === ، عملوند ها را بر اساس نوع و مقدار مقایسه می کند:

مثالها

0 == "";   // true

1 == "1";    // true

1 == true;   // true


0 === "";    // false

1 === "1";   // false

1 === true;  // false

0 == ""; // true

1 == "1"; // true

1 == true; // true

0 === ""; // false

1 === "1"; // false

1 === true; // false

خودتان آزمایش کنید

برای پارامتر ها مقدار پیشفرض تعیین کنید

اگر تابعی بدون یکی از آرگومان ها فراخوانی شود ، مقدار آرگومان فراموش شده ، undefined تنظیم می شود .

مقادیر تعریف نشده می تواند کد شما را خراب کند. اختصاص مقادیر پیش فرض به آرگومان ها عادت خوبی است.

مثالها

function myFunction(x, y) {

   if (y === undefined) {

      y = 0;

   }

}

function myFunction(x, y) {

if (y === undefined) {

y = 0;

}

خودتان آزمایش کنید

ECMAScript 2015 اجازه تنظیم پارامترهای پیش فرض را در تعریف تابع می دهد:

function (a=1, b=1) { /*function code*/  }

1	function (a=1, b=1) { /function code/ }

درباره پارامترهای تابع و آرگومان ها در Function Parameters بیشتر بخوانید.

سوئیچ های خود را با Default پایان دهید

همیشه در دستور switch از حالت default استفاده کنید. حتی اگر فکر می کنید دیگر نیازی به آن نیست.

مثالها

switch (new Date().getDay()) {

 
case 0:

    day = "Sunday";

     break;

case 1:

    day = "Monday";

     break;

 case 2:

    day = "Tuesday";

     break;

 case 3:

    day = "Wednesday";

     break;

 case 4:

    day = "Thursday";

      break;

 case 5:

    day = "Friday";

      break;

 case 6:

    day = "Saturday";

      break;

 default:
    day =  "Unknown";
}

switch (new Date().getDay()) {

case 0:

day = "Sunday";

break;

case 1:

day = "Monday";

break;

case 2:

day = "Tuesday";

break;

case 3:

day = "Wednesday";

break;

case 4:

day = "Thursday";

break;

case 5:

day = "Friday";

break;

case 6:

day = "Saturday";

break;

default:

day = "Unknown";

}

خودتان آزمایش کنید

از `eval()` استفاده نکنید

تابعeval() برای اجرای متن به عنوان کد استفاده می شود. تقریباً در همه موارد استفاده از آن ضرورتی ندارد.

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

منبع : W3Schools.com

درس بعدی : اصول کد نویسی در جاوا اسکریپت درس قبلی : توابع Arrow در جاوا اسکریپت

آموزش جاوا اسکریپت, آموزش کد نویسی حرفه ای, بهترین روش های کد نویسی, جاوا اسکریپت, جاوا اسکریپت آموزش, جاوا اسکریپت به زبان ساده, جاوا اسکریپت چیست؟, جاوا اسکریپت زبان برنامه نویسی

بانک پروژه

از متغیرهای سراسری دوری کنید

همیشه از متغیرهای محلی استفاده کنید

تعریف ها در بالا

متغیرها را مقداردهی اولیه کنید

هرگز شیء عددی، رشته ای یا بولین تعریف نکنید

مثالها

مثالها

از دستور `new()` استفاده نکنید

مثالها

مراقب تبدیل نوع خودکار باشید

مثالها

مثالها

مثالها

از عملگر مقایسه ای === استفاده کنید

مثالها

برای پارامتر ها مقدار پیشفرض تعیین کنید

مثالها

سوئیچ های خود را با Default پایان دهید

مثالها

از `eval()` استفاده نکنید

دیدگاهتان را بنویسید لغو پاسخ

تماس با ما

قوانین و مقررات

راهنمای مشتریان

مجوز ها

بانک پروژه

بانک پروژه

از متغیرهای سراسری دوری کنید

همیشه از متغیرهای محلی استفاده کنید

تعریف ها در بالا

متغیرها را مقداردهی اولیه کنید

هرگز شیء عددی، رشته ای یا بولین تعریف نکنید

مثالها

مثالها

از دستور new() استفاده نکنید

مثالها

مراقب تبدیل نوع خودکار باشید

مثالها

مثالها

مثالها

از عملگر مقایسه ای === استفاده کنید

مثالها

برای پارامتر ها مقدار پیشفرض تعیین کنید

مثالها

سوئیچ های خود را با Default پایان دهید

مثالها

از eval() استفاده نکنید

دیدگاهتان را بنویسید لغو پاسخ

تماس با ما

قوانین و مقررات

راهنمای مشتریان

مجوز ها

از دستور `new()` استفاده نکنید

از `eval()` استفاده نکنید