Javascript "this" указатель внутри вложенной функции

Ответ 1

В JavaScript объект this действительно основан на том, как вы выполняете вызовы функций.

Как правило, существует три способа установки объекта this:

• someThing.someFunction(arg1, arg2, argN)
• someFunction.call(someThing, arg1, arg2, argN)
• someFunction.apply(someThing, [arg1, arg2, argN])

Во всех приведенных выше примерах объект this будет someThing. Вызов функции без ведущего родительского объекта обычно будет вам глобальным объектом, который в большинстве браузеров означает объект window.

Ответ 2

this не является частью области закрытия, его можно рассматривать как дополнительный параметр для функции, связанной с сайтом вызова. Если метод не вызывается как метод, глобальный объект передается как this. В браузере глобальный объект идентичен window. Например, рассмотрим следующую функцию:

function someFunction() {
}

и следующий объект

var obj = { someFunction: someFunction };

Если вы вызываете функцию с использованием синтаксиса метода, например,

obj.someFunciton();

то this привязан к obj.

Если вы вызываете someFunction() напрямую, например

someFunction();

то this привязан к глобальному объекту, то есть window.

Наиболее распространенная работа заключается в том, чтобы зафиксировать это в закрытии, например,

displayMe : function() {      

    // the 'this' pointer is referring to the std_obj      
    if (this.activeEffect=="fade") { }      
    var that = this;  
    var doSomeEffects = function() {      

      // the 'this' pointer is referring to global
      // that, however, refers to the outscope this
      if (that.activeEffect=="fade") { }      
    }      

    doSomeEffects();         
 }      

Ответ 3

Поскольку это, по-видимому, относится к числу наиболее распространенных вопросов такого рода, позвольте мне добавить все эти годы решение ES6 с использованием функций стрелок:

var std_obj = {
  ...
  displayMe() {
    ...
    var doSomeEffects = () => {
                        ^^^^^^^    ARROW FUNCTION    
      // In an arrow function, the 'this' pointer is interpreted lexically,
      // so it will refer to the object as desired.
      if (this.activeEffect=="fade") { }
    };
    ...    
  }
};

Ответ 4

Существует разница между переменными окружения и "this". "this" фактически определяется вызовом функции, в то время как явные переменные остаются неповрежденными внутри блока объявления функции, известного как оболочка. См. Пример ниже:

function myFirstObject(){
    var _this = this;
    this.name = "myFirstObject";
    this.getName = function(){
       console.log("_this.name = " + _this.name + " this.name = " + this.name);  
    }
}

function mySecondObject(){
    var _this = this;
    this.name = "mySecondObject";
    var firstObject = new myFirstObject();
    this.getName = firstObject.getName
}

var secondObject = new mySecondObject();
secondObject.getName();

вы можете попробовать: http://jsfiddle.net/kSTBy/

Что происходит в вашей функции - "doSomeEffects()", вызывается явно, это означает, что контекст или "this" функции - это окно. если "doSomeEffects" был прототипом, например. this.doSomeEffects on say "myObject", тогда myObject.doSomeEffects() вызовет "this" как "myObject".

Ответ 5

Чтобы понять этот вопрос, попробуйте получить вывод для следующего фрагмента

var myObject = {
    foo: "bar",
    func: function() {
        var self = this;
        console.log("outer func:  this.foo = " + this.foo);
        console.log("outer func:  self.foo = " + self.foo);
        (function() {
            console.log("inner func:  this.foo = " + this.foo);
            console.log("inner func:  self.foo = " + self.foo);
        }());
    }
};
myObject.func();

Приведенный выше код выведет на консоль следующее:

outer func:  this.foo = bar
outer func:  self.foo = bar
inner func:  this.foo = undefined
inner func:  self.foo = bar

Во внешней функции, как это, так и самостоятельно ссылаются на myObject, и поэтому оба могут правильно ссылаться и получать доступ к foo.

Во внутренней функции это больше не относится к myObject. В результате this.foo является undefined во внутренней функции, тогда как ссылка на локальную переменную self остается в области видимости и доступна там. (До ECMA 5 это во внутренней функции относится к глобальному объекту окна, тогда как по ECMA 5 это во внутренней функции будет undefined.)

Ответ 6

Как объяснил Кайл, вы можете использовать call или apply для указания this внутри функции:

Вот эта концепция, применяемая к вашему коду:

var std_obj = {
    options: {
        rows: 0,
        cols: 0
    },
    activeEffect: "none",
    displayMe: function() {

        // the 'this' pointer is referring to the std_obj
        if (this.activeEffect == "fade") {}

        var doSomeEffects = function() {
            // the 'this' pointer is referring to the window obj, why?
            if (this.activeEffect == "fade") {}
        }

        doSomeEffects.apply(this,[]);
    }
};

std_obj.displayMe();

JsFiddle