وشەی this چییە؟

وشەی this لە JavaScript-دا یەکێکە لەو بابەتانەی کە زۆرجار گومانی بۆ فێرخوازان دروست دەکات. بە کورتی، this ئاماژە بەو ئۆبجێکتە دەکات کە کۆدەکەی تێدا جێبەجێ دەکرێت. بەڵام بەهای ئەم وشەیە جێگیر نییە و بەپێی شوێنی بەکارهێنانی دەگۆڕێت.

تێبینی سەرەتایی: تێگەیشتن لە this کلیلی نووسینی کۆدی پێشکەوتووی JavaScript-ە، بەتایبەت کاتێک کار لەگەڵ Object و Class-ەکاندا دەکەیت.

١. بەکارهێنانی this لەناو Object-دا

کاتێک this لەناو مێتۆدێکی ئۆبجێکتدا بەکاردێت، ئاماژە بە خودی ئەو ئۆبجێکتە دەکات کە مێتۆدەکەی تێدایە.

const user = {
  firstName: "کورد",
  lastName: "سۆفت",
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
};

console.log(user.fullName()); // دەرەنجام: کورد سۆفت

لێرەدا this.firstName واتە ناوی ئەو ئۆبجێکتەی کە fullName-ی تێدایە. ئەگەر هەڵەیەک بکەیت و this بەکارنەهێنیت، کۆدەکە ناتوانێت دەستی بە گۆڕاوەکانی ناو ئۆبجێکتەکە بگات.

٢. بەکارهێنانی this لە فەنکشنی ئاساییدا

کاتێک this لە فەنکشنێکی ئاساییدا بەکاردێت (نەک لەناو ئۆبجێکت)، ئاماژە بە Global Object دەکات. لە وێبگەڕەکاندا (Browser)، ئەمە بە گشتی ئۆبجێکتی window-ە.

function showThis() {
  console.log(this);
}

showThis(); // لە Browser-دا ئاماژە بە window دەکات

تێبینی: ئەگەر لە دۆخی 'use strict'-دا بیت، بەهای this لە فەنکشنی ئاساییدا دەبێتە undefined، کە ئەمەش ڕێگەیەکە بۆ پاراستنی کۆدەکەت لە هەڵەی نەخوازراو.

٣. جیاوازی Arrow Functions

ئاگاداری: Arrow Functions مێتۆدی this-ی تایبەت بە خۆیان نییە. ئەوان this لەو شوێنەوە وەردەگرن کە تێیدا پێناسە کراون (Lexical Scoping).

ئەم تایبەتمەندییە زۆر بەسوودە کاتێک دەتەوێت this-ی دەرەوەی فەنکشنەکە بەکاربهێنیت.

٤. بەکارهێنانی this لە Event Listener

کاتێک this لەناو Event Listener-ێکدا بەکاردێت، ئاماژە بەو HTML Element-ە دەکات کە ڕووداوەکەی (Event) لەسەر جێبەجێ کراوە.

const button = document.querySelector("button");

button.addEventListener("click", function() {
  this.style.backgroundColor = "blue"; // ئاماژە بە دوگمەکە دەکات
});

٥. کێشە باوەکان

یەکێک لە باوترین هەڵەکان ئەوەیە کە فێرخوازان پێیان وایە this لەناو فەنکشنێکی ناوخۆییدا (Nested Function) هێشتا ئاماژە بە ئۆبجێکتەکەی دەرەوە دەکات، بەڵام لە ڕاستیدا ئاماژە بە window دەکات.

٦. ڕاهێنان

ئێستا کاتی ئەوەیە خۆت تاقی بکەیتەوە. هەوڵبدە ئۆبجێکتێک دروست بکەیت بە ناوی car کە خاوەنی تایبەتمەندی brand و مێتۆدێکی displayBrand بێت کە بە this ناوی براندەکە چاپ بکات.

پرسیار: ئەگەر لەناو displayBrand-دا Arrow Function-ێک بەکاربهێنیت، ئایا هێشتا this ئاماژە بە car دەکات؟ بۆچی؟