`this` को मान कसरी निर्धारित हुन्छ?

Question

IT Interview Practice · Accepted Answer

`this` यो **फङ्क्शन कहाँ परिभाषित छ भन्ने कुरा** द्वारा होइन, बरु **कसरी कल गरिएको छ** भन्ने कुरा द्वारा निर्धारित हुन्छ। पाँच नियमहरू छन्:

```js
const obj = {
  x: 1,
  getX() { return this.x; },
};

obj.getX();          // 1   → method call: `this` is `obj`
const f = obj.getX;
f();                  // undefined (or window) → plain call: `this` is global/undefined
f.call(obj);          // 1   → explicit binding with call/apply/bind
new SomeClass();      //     → `this` is the brand-new instance
```

## Arrow function अपवाद (महत्त्वपूर्ण)

Arrow functions को आफ्नै `this` हुँदैन — यो परिभाषित समयमा घेरिएको scope बाट अनुवांशिकता पाएको हुन्छ। यही कारणले नै arrows callbacks को लागि उत्तम छन्:

```js
const obj = {
  items: [1, 2],
  logAll() {
    // ✅ arrow inherits `this` from logAll → `this` is obj
    this.items.forEach(i => console.log(this.items, i));

// ❌ a regular function here would have its own `this` (undefined) → crash
    // this.items.forEach(function (i) { console.log(this.items); });
  },
};
```

## सामान्य फन्दा

Method लाई callback को रूपमा पास गर्दा **आफ्नो बाइन्डिङ हराउन्छ**, किनभने यो त्यस पछि सरल रूपमा कल हुन्छ:

```js
button.addEventListener("click", obj.getX);        // ❌ `this` is the button
button.addEventListener("click", () => obj.getX()); // ✅ keeps obj
button.addEventListener("click", obj.getX.bind(obj)); // ✅ also fine
```

## किन यो महत्त्वपूर्ण छ

`this` को गलतफहमी सबैभन्दा सामान्य JS बग हो।

समाधान सामान्यतः arrow function वा `.bind()` को प्रयोग गरेर इच्छित `this` लाई बन्द गर्नु हो।

Arrow function अपवाद (महत्त्वपूर्ण)

सामान्य फन्दा

किन यो महत्त्वपूर्ण छ

सम्बन्धित प्रश्नहरू