الأخطاء الشائعة في JavaScript

هذه الفصل تشير إلى بعض الأخطاء الشائعة في JavaScript.

استخدام عمود التخصيص غير المتوقع

إذا استخدم البرمجي if استخدام عمود التخصيص غير المتوقع في=)، وليس عمود التحقق (====)، قد ينتج برنامج JavaScript بعض النتائج غير المتوقعة.

هذه if الجملة تعود false(كما توقعتم)، لأن x لا يساوي 10:

var x = 0;
if (x == 10)

جرب بنفسك

هذه if الجملة تعود true(ربما ليس كما توقعتم)، لأن 10 هو true:

var x = 0;
if (x = 10)

جرب بنفسك

هذه if الجملة تعود false(ربما ليس كما توقعتم)، لأن 0 هو false:

var x = 0;
if (x = 0)

جرب بنفسك

تعود التخصيص دائمًا قيمة التخصيص.

توقع المقارنة الهادئة

في المقارنة العادية، نوع البيانات غير مهم. هذه if الجملة تعود true:

var x = 10;
var y = "10";
if (x == y)

جرب بنفسك

في المقارنة الصارمة، نوع البيانات مهم بالفعل. هذه if الجملة تعود false:

var x = 10;
var y = "10";
if (x === y)

جرب بنفسك

خطأ شائع هو نسيان في switch الجملة تستخدم مقارنة صارمة:

هذه switch الجملة ستظهر نافذة التأكيد:

var x = 10;
switch(x) {
    case 10: alert("Hello");
}

جرب بنفسك

هذه switch الجملة لن تظهر نافذة التأكيد:

var x = 10;
switch(x) {
    case "10": alert("Hello");
}

جرب بنفسك

الإضافة والجمع المربك

إضافةللإضافةالرقم.

الإضافة المتتابعة (Concatenation)للإضافةالنص.

في JavaScript، كل من هذين العمليتين يستخدم نفس + عنصر الحساب.

لذلك، إضافة الأرقام ك数值 مع إضافة الأرقام ك نص، سينتج عنه نتائج مختلفة:

var x = 10 + 5;          //结果是 15 في x
var x = 10 + "5";         //结果是 "105" في x

جرب بنفسك

إذا كانت هناك إضافة بين متغيرين، من الصعب التنبؤ بالنتيجة:

var x = 10;
var y = 5;
var z = x + y;            //结果是 15 في z
var x = 10;
var y = "5";
var z = x + y;            //结果是 "105" في z

جرب بنفسك

النقاط العشرية المربكة

كل الأرقام في JavaScript يتم حفظها كـ64 بتالأرقام العشرية (Floats).

كل لغة برمجة، بما في ذلك JavaScript، تواجه صعوبة في معالجة القيم العشرية:

var x = 0.1;
var y = 0.2;
var z = x + y             // النتيجة في z لن تكون 0.3

جرب بنفسك

لحل هذه المشكلة، استخدم عملية الضرب والقسمة:

مثال

var z = (x * 10 + y * 10) / 10;       // النتيجة في z ستكون 0.3

جرب بنفسك

استخدام النقاط السطرية في النصوص JavaScript

يسمح JavaScript بإنقسام جملة إلى سطرين:

مثال 1

var x =
"Hello World!";

جرب بنفسك

لكن، إن نقطة السطر في منتصف النص غير صحيحة:

مثال 2

var x = "Hello
World!";

جرب بنفسك

إذا كان من الضروري إجراء نقطة سطر في النص، فعليك استخدام الرمز المقلوب:

مثال 3

var x = "Hello \",
World!";

جرب بنفسك

نقطة السطر المفقودة

بسبب نقطة السطر الخاطئة، سيتم تنفيذ هذا الكود مهما كان قيمة x:

if (x == 19);
{
     // block of code
}

جرب بنفسك

استخدام النقاط السطرية للجملة return

إن إغلاق الجملة تلقائيًا في نهاية السطر هو سلوك JavaScript الافتراضي.

لذلك، ستعود هذه الأمثلة الثلاثة إلى نفس النتيجة:

مثال 1

function myFunction(a) {
    var power = 10  
    return a * power
}

جرب بنفسك

مثال 2

function myFunction(a) {
    var power = 10;
    return a * power;
}

جرب بنفسك

يسمح JavaScript أيضًا بإنقسام جملة إلى سطرين.

لذلك، سيعود مثال 3 أيضًا إلى نفس النتيجة:

مثال 3

function myFunction(a) {
    var
    power = 10;  
    return a * power;
}

جرب بنفسك

لكن، إذا كنت تريد return ماذا سيحدث إذا قمت بإنقسام الجملة إلى سطرين؟

مثال 4

function myFunction(a) {
    var
    power = 10;  
    return
    a * power;
}

جرب بنفسك

سيقوم هذا الدالة بتقديم غير معرف!

لماذا؟ لأن JavaScript يعتقد أنك تعني:

مثال 5

function myFunction(a) {
     var
    power = 10;  
    return;
    a * power;
}

جرب بنفسك

توضيح

إذا كانت هناك جملة غير مكتملة:

var

سيكمل JavaScript هذا الجملة من خلال قراءة السطر التالي:

power = 10;

لكن نظرًا لأن هذه الجملة كاملة:

return

سيغلق JavaScript هذا الجملة تلقائيًا:

return;

حدث هذا بسبب، في JavaScript، يمكن إغلاق (إنهاء) الجملة باستخدام نقطة السطر بشكل اختياري.

سيغلق JavaScript في نهاية السطر return الجملة، لأنها جملة كاملة بالفعل.

لذا، لا يجب أبدًا على return الجملة تتغير إلى الأسفل.

باستخدام اسم المفهرس لتحديد الوصول إلى اللوحة

يدعم العديد من لغات البرمجة المصفوفات التي تحتوي على مؤشرات مسماة.

تسمى المصفوفات التي تحتوي على مؤشرات مسماة بمصفوفات المرتبطة (أو المتباينة).

JavaScript غير مدعومالمصفوفة التي تحتوي على مؤشرات مسماة.

في JavaScript،المصفوفةاستخدمالمؤشرات الرقمية:

مثال

var person = [];
person[0] = "Bill";
person[1] = "Gates";
person[2] = 46;
var x = person.length;          // سيقوم person.length بتحويل 3
var y = person[0];              // سيقوم person[0] بتحويل "Bill"

جرب بنفسك

في JavaScript،الكائناستخدمالمؤشرات المسماة.

إذا كنت تستخدم المؤشرات المسماة، فإن JavaScript سيقوم بتعريف المصفوفة ككائن معياري عند الوصول إليها.

بعد إعادة التعريف التلقائي، ستكون نتائج طرق أو خصائص المصفوفة غير معرفة أو غير صحيحة:

مثال

var person = [];
person["firstName"] = "Bill";
person["lastName"] = "Gates";
person["age"] = 46;
var x = person.length;         // سيقوم person.length بتحويل 0
var y = person[0];              // person[0] سيقوم بتحويل "undefined"

جرب بنفسك

استخدم الكومياس للانتهاء من التعريف

الكومياس المتدرج في تعريف كائنات المصفوفات أو العناصر هو قانوني في ECMAScript 5.

مثال على كائن:

person = {firstName:"Bill", lastName:"Gates", age:62,};

مثال على مصفوفة:

points = [35, 450, 2, 7, 30, 16,];

تحذير！！

متصفح إنترنت إكسبلورر 8 سينهار.

لا يسمح JSON بالكومياس المتدرج.

JSON:

person = {firstName:"Bill", lastName:"Gates", age:62};

JSON:

points = [35, 450, 2, 7, 30, 16];

غير معرف ليس Null

يمكن أن تكون كائنات JavaScript، المتغيرات، الخصائص والأساليب غير معرفة.

بالإضافة إلى ذلك، يمكن أن تكون قيمة كائن JavaScript الفارغ: لا شيء.

قد يجعل ذلك من الصعب التحقق من أن الكائن فارغ.

يمكنك التحقق من أن النوع هو: غير معرف،للتحقق من وجود الكائن:

مثال

if (typeof myObj === "undefined")

جرب بنفسك

لكن لا يمكنك اختبار ما إذا كان العنصر لا شيء، لأن إذا كان العنصر غير معرف، سيتم إطلاق خطأ:

غير صحيح:

if (myObj === null)

لحل هذه المشكلة، يجب اختبار ما إذا كان العنصر لا شيء، وليس غير معرف.

ولكن هذا سيزيد من خطأ:

غير صحيح:

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

لذلك، قبل اختبار ما إذا كان غير صحيح، يجب اختبار ما إذا كان غير معرف أولاً:

صحيح:

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

جرب بنفسك

يتوقع نطاق مكاني للكتل

JavaScript لن يفعليخلق مجال جديد للكود لكل مكتبة كود.

العديد من لغات البرمجة تفعل ذلك، ولكن JavaScript ليس هذا صحيحاً.

يظن أن هذا الكود سيعود غير معرف، هو خطأ شائع لـ مبرمجين JavaScript الجدد:

مثال

for (var i = 0; i < 10; i++) {
  // مكتبة الكود
}
return i;

جرب بنفسك