मैं इस लिंक से ES6 पर नोट्स का अनुसरण कर रहा हूं और खेलने के लिए एक छोटा कोड स्निपेट बनाया।

class Bar{
    constructor(x,y){
        this.x = x;
        this.y = y;
    }
}
let bar = new Bar(12,10);
Bar.prototype.foo =function(){
    return this.x + this.y;
}
bar.foo() // 22 correct

जब तक मैं ऐसा नहीं करता तब तक मैं बहुत खुश हूं।

let baz = bar.foo
baz(); // NaN

Baz() NaN प्रिंट क्यों कर रहा है?

1
John Doe 22 पद 2017, 16:43

2 जवाब

सबसे बढ़िया उत्तर

जब आप bar.foo से baz को प्रभावित करते हैं, तो फ़ंक्शन अपना संदर्भ (यह) खो देता है। तो यह और नहीं। x और यह। ब्रेकप्वाइंट से जांचें, आप देखेंगे कि दोनों अपरिभाषित हैं।

तो दो अपरिभाषित को एक साथ जोड़ने से NaN उत्पन्न होता है।

इसके साथ भी प्रयास करें अपने ब्राउज़र में जांचें:

class Bar{
    constructor(x,y){
        this.x = x;
        this.y = y;
    }
}
let bar = new Bar(12,10);
Bar.prototype.foo =function(){
    debugger;
    return this.x + this.y;
}

इसके संदर्भ को परिभाषित करते हुए इसे कॉल करने का प्रयास करें। इसे करने के 3 तरीके:

let baz = bar.foo.bind(bar);
baz();

bar.foo.call(bar);

bar.foo.apply(bar);
2
MathKimRobin 22 पद 2017, 16:48

आपने किसी ऑब्जेक्ट से एक अलग फ़ंक्शन लिया और आपको < कोड>यह. यह काम करने के लिए, आपको बाइंड फंक्शन के लिए ऑब्जेक्ट।

class Bar{
    constructor(x,y){
        this.x = x;
        this.y = y;
    }
}
let bar = new Bar(12,10);
Bar.prototype.foo =function(){
    return this.x + this.y;
}
console.log(bar.foo()) // 22 correct

let baz = bar.foo.bind(bar); // bind innstance

console.log(baz()); // 22
3
Nina Scholz 22 पद 2017, 16:50