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

اگر از JavaScript استفاده می کنید ، برخورد با اشکال تقریباً اجتناب ناپذیر است. در این آموزش ، با رایج ترین اشتباهاتی که ممکن است در نتیجه استفاده نادرست از عملگرهای جاوااسکریپت و سایر دستورات ناشی شود ، آشنا خواهید شد.

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

نکات اصلی اشتباهات رایج جاوا اسکریپت:

• در این آموزش ، برخی از اشتباهات رایج هنگام نوشتن جاوا اسکریپت و چگونگی مقابله با آنها را بررسی خواهیم کرد.
• جاوا اسکریپت تفاوتهای خاصی دارد که آن را از سایر زبانهای برنامه نویسی جدا می کند.
• وقتی صحبت از اشکالات می شود ، آموزش JavaScript for dummies برای کسانی که از قبل اصول JavaScript را می دانند می تواند بسیار مفید باشد.

استفاده نادرست از اپراتورها

بسیاری از اشتباهاتی که باعث سردرد مبتدی می شوند ، ناشی از استفاده نادرست اپراتورهای JavaScript است. در حالی که درک و استفاده از آنها ساده است ، اما مخلوط کردن آنها نیز آسان است: تنها یک کاراکتر اشتباه لازم است. ما معمول ترین موارد را توضیح خواهیم داد و آنها را با مثالهای کد JavaScript توضیح می دهیم تا بتوانید کاربرد مناسب را به خاطر بسپارید.

انتساب در مقابل اپراتور مقایسه

اگر عملگرهای انتساب = و مقایسه == را در دستور if اشتباه بگیرید ، یک برنامه JavaScript ممکن است نتایج ناخواسته ای به همراه داشته باشد. این یکی از اشتباهات تازه کار است که این آموزش جاوا اسکریپت برای ساختگی می خواهد از آن جلوگیری کنید.

در مثال زیر ، دستور if زیر غلط برمی گردد ، زیرا عملگر مقایسه == مقدار a را بررسی می کند ، بنابراین a برابر 10 نیست:

var a = 1;
if (a == 10)

در مثال زیر ، حتی اگر عبارت a = 1 درست برگردد ، زیرا عملگر تخصیص = مقدار a جدید 10 را تغییر می دهد:

var a = 1;
if (a = 10)

مقایسه دقیق و سخت

هنگام انجام مقایسه های برابری با استفاده از عملگر == ، نوع داده مهم نیست. عبارت if زیر درست می شود.

این اتفاق می افتد زیرا اپراتور مقایسه برابری شل مقادیر را پس از تلاش برای تبدیل متغیرها به همان نوع (انجام اجبار) مقایسه می کند:

var a = 1;
var b = "1";
if (a == b)

با این حال ، با مقایسه دقیق برابری === ، اجبار انجام نمی شود ، بنابراین نوع داده ثابت می ماند و برای دستور مهم است. دستور if زیر غلط برمی گردد:

var a = 1;
var b = "1";
if (a === b)

تغییر اظهارات

یک اشتباه نسبتاً رایج فراموش کردن این است که دستورات سوئیچ همیشه از مقایسه برابری دقیق استفاده می کنند. دو نمونه JavaScript زیر نحوه ایجاد هشدار را نشان می دهد.

در مثال کد زیر ، سوئیچ باعث می شود که هشدار ظاهر شود:

var a = 10;
switch(a) {
    case 10: alert("This does not look good!");      
}

اکنون ، در این مثال بعدی ، سوئیچ باعث نمایش هشدار نمی شود:

var a = 10;
switch(a) {
    case "10": alert("This does not look good!");      
}

الحاق در مقابل الحاق

جمع اعداد را جمع می کند. الحاق رشته ها را اضافه می کند. مشکل این است که ، هر دو عملیات از یک عملگر + یکسان در JavaScript استفاده می کنند.

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

var a = 8 + 4;
var a = 8 + "4";

وقتی متغیرها را اضافه می کنید ، ممکن است پیش بینی نتایج دشوار باشد:

var a = 8;
var b = 4;
var c = a + b;

var d = 21;
var e = "0";
var f = d + e;

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

مانند هر زبان ، قوانین گرامر اهمیت زیادی دارند. در انگلیسی ، ویرگول اضافه شده یا فراموش شده ممکن است معنای جمله را کاملاً تغییر دهد. اگرچه در JavaScript ممکن است باعث اشکال و خرابی شود.

استفاده نادرست از نحو JavaScript هنگامي كه هنوز تمام قوانين را مي آموزيد ممكن است مرتكب اشتباه شود. ما در حال حاضر رایج ترین اشتباهات را توضیح خواهیم داد ، اینکه چگونه به راحتی آنها را تصحیح می کنیم و اینکه چرا دیگر هرگز نباید آنها را تکرار کنید.

ریسمان های پاره شده

در JavaScript ، می توانید رشته ای را در کد خود به دو خط تقسیم کنید:

var a = 
"A simple one-liner";

با این حال ، ممکن است یک رشته را درست در وسط آن بشکنید:

var a = "Broken
string!";

برای شکستن یک دستور در میانه رشته کد خود ، بدون تأثیر بر خروجی ، باید\ backslash اضافه کنید:

var a = "Two \
liner!";

نقطه ویرگول های نابجا

در کد زیر ، به دلیل یک نقطه ویرگول نابجا ، بلوک کد صرف نظر از مقدار x اجرا می شود:

if (x == 20);{
    // code block  
}

اظهارات بازگشت شکسته

به طور پیش فرض ، JavaScript یک دستور را در انتهای یک خط می بندد. با توجه به این رفتار ، دو مثال کد جاوا اسکریپت در زیر نتیجه یکسانی را ارائه می دهند:

function sampleFunction(a) {
    var value = 10
    return a * value
}

function sampleFunction(a) {
    var value = 10;
    return a * value;
}

JavaScript همچنین اجازه می دهد تا دستورات را به دو خط تقسیم کنیم ، به همین دلیل مثال سوم نیز نتیجه یکسانی دارد:

function sampleFunction(a) {
    var 
    value = 10;
    return a * value;
}

حال ، اگر دستور return در دو خط شکسته شود ، همانطور که در مثال می بینید ، تابع تعریف نشده برمی گردد:

function sampleFunction(a) {
    var 
    value = 10;
    return 
    a * value;
}

این اتفاق می افتد زیرا JavaScript کد را اینگونه تفسیر می کند:

function sampleFunction(a) {
    var 
    value = 10;
    return;
    a * value;
}

سیستم یک عبارت ناقص را مشخص می کند (var) و سعی دارد آن را با رفتن به خط زیر تکمیل کند (مقدار = 10؛). با این حال ، از آنجا که بازگشت می تواند بیانیه کاملی باشد که خود به خود استفاده شود ، جاوا اسکریپت آن را تکمیل شده می داند و آن را می بندد ، زیرا چیز دیگری روی خط نیست. این اتفاق می افتد زیرا بستن یک عبارت با علامت ویرگول در JavaScript لازم نیست.

صرف نظر از این ، اگر می خواهید کد شما به راحتی اجرا شود ، هرگز نباید دستورات Return را بشکنید.

ویرگول در انتهای تعاریف

همانطور که آیتم های آرایه خود را با ویرگول جدا می کنید ، آسان است که یکی را در انتها بگذارید ، مانند مثال زیر:

numbers = [52, 452, 452, 1, 32, 45,];

اگر این کار را انجام دهید ، برخی از موتورهای JavaScript یا JSON ممکن است خراب شوند یا نتایج غیرمنتظره ای ایجاد کنند. بنابراین ، اطمینان حاصل کنید که هیچ نمادی را بدون مراقبت رها نکنید:

numbers = [52, 452, 452, 1, 32, 45];

در تعریف شی JavaScript نیز همین امر انجام می شود. مثال زیر مواردی را نشان می دهد که هرگز نباید انجام دهید:

user = {
  firstName: "Joe"; 
  lastName: "Johnson"; 
  age: 32,
};

روش صحیح را به خاطر بسپارید – این چندان سخت نیست:

user = {
  firstName: "Joe", 
  lastName: "Johnson", 
  age: 32,
};

سایر مسائل در اشتباهات رایج جاوا اسکریپت

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

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

آرایه هایی با نمایه های نامگذاری شده

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

var user = [];
user[0] = "Joe";
user[1] = "Johnson";
user[2] = 32;
var a = user.length;
var b = user[0];

با این حال ، اشیا in موجود در JavaScript می توانند از نمایه های نامگذاری شده استفاده کنند.

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

var user = [];  
user["fName"] = "Joe";  
user["lName"] = "Johnson";  
user["age"] = 32;
var a = user.length;         // user.length returns 0
var b = user[0];             // user[0] returns undefined

شناور کردن

هر شماره در جاوا اسکریپت به عنوان یک شماره شناور 64 بیتی (float) ذخیره می شود. هر زبان برنامه نویسی با مقادیر دقیق شناور مشکل دارد و JavaScript نیز از این قاعده مستثنی نیست:

var a = 0.1;
var b = 0.2;
var c = a + b;
Boolean(c == 0.3)

ضرب و تقسیم مسئله را حل می کند:

var c = (a * 10 + b * 10) / 10;

تعریف نشده در مقابل Null

در JavaScript ، null برای اشیا اعمال می شود ، و برای متغیرها ، روش ها و خصوصیات تعریف نشده است. با این حال ، برای اینکه یک شی پوچ باشد ، باید در واقع تعریف شود ، در غیر این صورت تعریف نشده است. برای مثال یک مثال از دنیای واقعی ، null یک جعبه خالی را نشان می دهد ، و تعریف نشده به معنای هیچ جعبه ای است.

در مثال زیر ، دستور if بررسی می کند که آیا شی تعریف نشده و خالی است:

if (sampleObject !== null && typeof sampleObject !== "undefined")

یافتن تفاوت ممکن است در صورت داشتن یک شی خالی سخت باشد. به همین دلیل ، از تابع typeof به عنوان یک تست ساده استفاده کنید:

if (typeof sampleObject !== "undefined" && sampleObject !== null)

محدوده سطح بلوک

جاوا اسکریپت با هر کد کد جدید دامنه جدیدی ایجاد نمی کند. این یک استثنا languages دیگر در JavaScript است ، در مقایسه با سایر زبانهای برنامه نویسی. اشتباهی که در بسیاری از جاوا اسکریپت برای آموزش ساختگی وجود دارد این است که به نظر می رسد مبتدیان فکر می کنند این کد به صورت تعریف نشده برمی گردد:

for (var i = 0; i < n; i++) {
      // code code code
}   
return i;

خلاصه اشتباهات رایج جاوا اسکریپت:

• در JavaScript مهم است که عملگرهای تخصیص = و مقایسه == را از هم تفکیک کنید.
• شما باید از نحوه اجرای جمع و الحاق آگاه باشید.
• شما باید بدانید که چگونه رشته ها را به درستی بشکنید و چه اتفاقی می افتد.