في معظم لغات البرمجة الموجهة للكائنات، يكون للكلمة الرئيسية "هذا" معنى خاص. عادةً ما تشير إلى أن الكائن هو سياق التنفيذ (أي إلى المثيل الحالي للكائن). على سبيل المثال، نستخدم هذه الكلمة عند الإشارة إلى خاصية كائن من الداخل: نكتب this.propertyName، ويكون السياق هو الكائن وهذا يشير إليه.
'هذا' في JavaScript
في JavaScript الأمر أكثر تعقيدًا لأنه حيث هذا لا يعتمد فقط على كيفية تعريف الدالة ولكن أيضًا على شكل استدعائها.
ألق نظرة على كيفية هذا يعمل حسب مكان الاستدعاء وشكله.
السياق العالمي
يُستخدم في سياق عام مرتبط بالكائن العام، مثل النافذة في متصفح الويب.
هذا؛ // النافذة
طريقة الكائن الداخلي
يُستخدم داخل أسلوب كائن مرتبط بأقرب كائن مرفق. الكائن هو السياق الجديد لـ هذا كلمة رئيسية. لاحظ أنه لا يجب عليك تغيير الدالة () إلى بناء جملة ES6 مرح: () => هذا السياق: () => هذا السياق لأنه سيغير السياق.
const obj = {
السياق: "كائن",
متعة: دالة() {
إرجاع هذا السياق;
}
};
obj.fun()؛ // كائن
في هذا المثال مع كائن متداخل, هذا لا يزال يشير إلى سياقه الأقرب.
const nestedObj = {
السياق: "الأصل",
الطفل: {
السياق: "تابع",
متعة: دالة() {
إرجاع هذا السياق;
}
}
};
nestedObj.child.fun()؛ // الطفل
وظيفة خارج السياق
تُستخدم داخل دالة ليس لها سياق (ليس لها كائن كأصل) مرتبطة بالسياق العام، حتى لو كانت الدالة مُعرّفة داخل الكائن.
لاحظ أننا نستخدم متغير السياق بدلاً من السماح/سياق السياق لأن دعنا و تشكل تغيير السياق المتغير المرفق المتغير. فار دائمًا الأقرب إلى سياق التنفيذ العام. دعنا و تشكل إعلان المتغيرات في نطاق كتلة محلية فقط.
متغير السياق = "عالمي";
const obj = {
السياق: "كائن",
funA: دالة() {
دالة funB() { {
const context = "دالة";
إرجاع هذا السياق;
}
إرجاع funB()؛ // تم استدعاؤها بدون سياق
}
};
obj.funA()؛ // عالمي
داخل دالة المنشئ الداخلية
تُستخدم داخل دالة تكون منشئ الكائن الجديد المرتبط بها.
متغير السياق = "عالمي";
دالة Obj() {
هذا السياق = "سياق Obj";
}
const obj = Obj الجديد();
سياق obj.context; // سياق Obj
دالة داخلية محددة في سلسلة النماذج الأولية
تُستخدم داخل دالة مُعرّفة في سلسلة النماذج الأولية لإنشاء كائن مرتبط بها.
const ProtoObj = {
متعة: دالة() {
إرجاع هذا.name;
}
};
const obj = Object.create.create(ProtoObj);
obj.name = "foo";
obj.fun()؛ // foo
في الداخل استدعاء() وتطبيق() الدالتين
استدعاء() و تطبيق() هي JavaScript الدوال. باستخدام هذه الدوال، يمكن للكائن استخدام أساليب تنتمي إلى كائن آخر. استدعاء() يأخذ الوسيطات بشكل منفصل حيث تطبيق() يأخذها كمصفوفة.
هذا مرتبط هنا بالسياق الجديد المتغير في استدعاء() و تطبيق() الأساليب.
const objA = {
السياق: "objA",
متعة: دالة() {
console.log(this.context, arguments);
}
};
const objB = {
السياق: "objB"
};
objA.fun(1، 2)؛ // objA، [1، 2]
objA.fun.call(objB، 1، 2، 3)؛ // objB، [1، 2، 3]
objA.fun.apply(objB, [1, 2, 3, 4])؛ // objB, [1, 2, 3, 4]
داخل دالة الربط()
ربط() هي أيضًا طريقة JavaScript. فهي تنشئ دالة جديدة تحتوي على هذا إلى المعامل الأول الذي تم تمريره إلى ربط()**.**
const objA = {
السياق: "objA",
متعة: دالة() {
console.log(this.context, arguments);
}
};
const objB = {
السياق: "objB"
};
const fun = objA.fun.bind(objB, 1, 2);
متعة (3، 4)؛ // objB، [1، 2، 3، 4]
داخل معالجات الأحداث
يُستخدم في أي معالج أحداث (على سبيل المثال, مُضيف الحدث، عند النقر، إرفاق الحدث)، فهو مرتبط بعنصر DOM الذي ارتبط به الحدث.
document.querySelector(".foo").addEventListener("click", function() {
هذا؛ // يشير إلى عنصر القسمة 'foo'
});
دالة السهم ES6
عند استخدامه داخل دالة السهم يكون مرتبطًا دائمًا بنطاقه المعجمي. في الدالة السهمية، لا يمكنك إعادة تعيين هذا بأي شكل من الأشكال.
const globalArrowFunction = () => هذا;
globalArrowFunction()؛ // النافذة
const obj = {
السياق: "كائن",
funA: () => هذا,
funB: دالة() {
إرجاع () => {
إرجاع هذا السياق;
};
}
};
obj.funA()؛ // النافذة
obj.funB()()؛ // الكائن
اقرأ المزيد: