从子级访问 JavaScript 对象中的根属性

Question

I have a block of JavaScript in which notably, this.id resolves to undefined .

The console indicates that this resolves to the methods object. I originally thought it would resolve to item . My question is, in my buy method, how do I access the id property. Please note, I do NOT want to move buy out of the methods object. I'm working to understand this.

 const item = { id: 5, methods: { buy() { alert('buying item ' + this.id); console.log(this); } } }; const myButton = document.getElementById('myButton'); myButton.addEventListener('click', () => { item.methods.buy(); });

 <button id="myButton"> Buy </button>

Answer 1

You can use Function.prototype.call() as item.methods.buy.call(item); to bind item to this .

Try it below.

 const item = { id: 5, methods: { buy() { alert('buying item ' + this.id); console.log(this); } } }; const myButton = document.getElementById('myButton'); myButton.addEventListener('click', () => { item.methods.buy.call(item); });

 <button id="myButton"> Buy </button>