Контекст выполнения JavaScript в функции аргумента функции

Question

function Apple(){ 
    this.name="apple"; 
} 
function Orange(){ 
    this.name="orange"; 

    this.apple = new Apple(); 
    this.apple.onCalled=function(){ 
     alert(this.name); 
    } 
} 
Orange.prototype.onCalled=function(){ 
    this.apple.onCalled(); 
} 
var orange = new Orange(); 
orange.onCalled(); 

В настоящее время код показывает «яблоко». Как изменить строку «this.apple.onCalled = function()» так, чтобы она отображала «оранжевый»?

Т.е. я хочу передать функцию другому объекту, но когда эта функция вызывается, обращайтесь к переменным объекта, который передал функцию, а не к переменным объекта, выполняющего эту функцию. Очевидным решением было бы использовать глобальные переменные (например, orange.name), но я ищу лучший способ, потому что есть много объектов, и я не хочу, чтобы все было глобально.

Answer 1

Используйте крышку.

function Orange(){ 
    this.name="orange"; 

    this.apple = new Apple(); 
    var that = this; 
    this.apple.onCalled=function() { 
     alert(that.name); 
    } 
} 

Попросите прочитать как ключевое слово this работает в JS, это немного сложно, но легко понять.

Answer 2

Вы могли бы написать:

Orange.prototype.onCalled=function(){ 
    this.apple.onCalled.call(this); 
} 

Трудно дать общий ответ. Дело в том, что this связан с любым вызовом функции. Это можно явно контролировать с помощью функций call или apply или оператором . при доступе к функции как свойства объекта.

Ответ, который кос дает использование закрытия, также может быть уместным; это зависит от эффекта, который вы хотите.

Answer 3

Orange.prototype.onCalled=function(){ 
    this.apple.onCalled.call(this); 
} 

Пример: http://jsfiddle.net/XrtZe/

Посмотрите: Scope in JavaScript