JavaScript - الكلمة المفتاحية this

JavaScript - الكلمة المفتاحية this

🔸 الكلمة المفتاحية this تُستخدم للإشارة إلى الكائن (Object) الذي يتم تنفيذ الكود بداخله. قيمة this تتغير حسب السياق الذي تُستخدم فيه.

---

🔹 this في السياق العام (Global Context)

console.log(this); // في المتصفح: window

📌 في السياق العام، this تُشير إلى الكائن window (أو global في Node.js).

---

🔹 this داخل كائن

const person = {
  name: "Mahmoud",
  greet: function () {
    return "مرحبًا، أنا " + this.name;
  },
};

console.log(person.greet()); // مرحبًا، أنا Mahmoud

📌 هنا this تُشير إلى الكائن person الذي يحتوي على الدالة.

---

🔹 this في دوال عادية

function show() {
  console.log(this);
}
show(); // في المتصفح: window

---

🔹 this داخل دالة باستخدام "strict mode"

"use strict";
function show() {
  console.log(this);
}
show(); // undefined

📌 في الوضع الصارم، this لا تشير إلى window، بل تكون undefined.

---

🔹 this في الأحداث (Event Handlers)

<button onclick="this.style.backgroundColor='red'">اضغط علي</button>

📌 في HTML، this تشير إلى العنصر نفسه الذي تم الضغط عليه.

---

🔹 this في الدوال السهمية (Arrow Functions)

const person = {
  name: "Mahmoud",
  greet: () => {
    console.log(this.name);
  },
};

person.greet(); // undefined

📌 الدوال السهمية لا تملك this خاص بها، بل ترثه من السياق الخارجي.

---

⚠️ ملاحظات مهمة

• this تعتمد كليًا على السياق الذي يتم فيه استدعاء الدالة.
• في الدوال السهمية، استخدمها فقط عندما لا تحتاج this خاص.
• يمكن تغيير قيمة this باستخدام call() أو apply() أو bind().