समझ में नहीं आ रहा है कि इस जावास्क्रिप्ट फ़ंक्शन को एक तरफ क्यों कहा जा सकता है लेकिन अन्य

Question

मैंने हाल ही में HTML5 गेम बनाने के उद्देश्य से जावास्क्रिप्ट सीखना शुरू किया है, और मैं एक व्यवहार में आया हूं कि मुझे कठिन समय समझ रहा है ।

उदाहरण के तौर पर, मेरे पास एक निर्माता है जो नए स्प्राइट्स को क्रियाओं की एक श्रृंखला के साथ शुरू करता है जिसे उन्हें गेम अपडेट (जैसे एनिमेटिंग, मूविंग इत्यादि) के दौरान करना चाहिए। This JSFiddle एक बुनियादी कार्यान्वयन का प्रदर्शन करता है।

अनिवार्य रूप से, मैं क्यों यह काम नहीं करता है के रूप में उलझन में हूँ ...

Sprite = function() { 

    this.actions = [this.animate]; 
}; 

Sprite.prototype = { 

    animate: function() { /* animate the sprite */ }, 

    update: function() { 

     this.actions[0](); // doesn't do anything (?) 
    } 
}; 

... लेकिन इस

Sprite = function() { 

    this.actions = [this.animate]; 
    this.holder = 'whatever'; 
}; 

Sprite.prototype = { 

    animate: function() { /* animate the sprite */ }, 

    update: function() { 

     this.holder = this.actions[0]; 
     this.holder(); // executes animate function as desired 
    } 
}; 

मेरी अनुभवहीन आंखों के लिए

करता है, दोनों उदाहरण की तरह लग उन्हें एक ही चीज़ करना चाहिए। तो अगर मैं this.actions[0]() पर सीधे कॉल करता हूं तो कुछ भी क्यों नहीं होता है, लेकिन अगर मैं this.actions[0]this.holder पर निर्दिष्ट करता हूं और फिर this.holder() पर कॉल करता हूं, तो यह ठीक काम करता है?

Answer 1

जब कोई फ़ंक्शन कहा जाता है, तो फ़ंक्शन के अंदर this नामक स्थानीय चर को एक मान आवंटित किया जाएगा।

जब तक आप इसे बदलने के लिए कुछ किया है (जैसे new, bind(), call(), apply()), मूल्य वस्तु जिस पर यह कहा जाता है हो जाएगा। foo.bar()this === foobar फ़ंक्शन के अंदर।

this.actions[0]()thisactions संपत्ति

this.holder() के मूल्य के बराबर बनाता this लिए जो कुछ भी this का मूल्य बुला समारोह में है बराबर बना देता है।

आपका फ़ंक्शन this के मान पर निर्भर करता है जो भी करता है। इसे ठीक करने के

Answer 2

दो तरीके:

Sprite = function() { 
    this.actions = [this.animate.bind(this)]; 
}; 

या:

update: function() { 
    this.actions[0].call(this); 
}