Ключевое слово this в JavaScript

Рубрика: JavaScript 101

В JavaScript, как в большинстве объектно-ориентированных языков программирования, this - специальное ключевое слово, которое используется в методах, чтобы обратиться к объекту, на котором вызывается метод.

Значение this в JavaScript определяется, используя простую серию шагов:

Если функция вызывается, используя Function.call() или Function.apply(), this будет установлено в первый параметр, который передают в .call()/.apply(). Если первый параметр, который передают в .call()/.apply() равен null или undefined, this будет ссылаться на глобальный объект (который является объектом window в веб-браузерах).
Если вызываемая функция создавалась, используя Function.bind(), this будет первым параметром, который передали в .bind() в то время, когда функция создавалась.
Если функция вызывается как метод объекта, this ссылается на этот объект.
Иначе, если функция вызывается как автономная функция, не присоединенная к какому-либо объекту, то this ссылается на глобальный объект.

Пример

// Вызов функции, используя Function.call()

var myObject = {
    sayHello: function() {
        console.log( "Привет! Мое имя " +
          this.myName );
    },
    myName: "Вася"
};

var secondObject = {
    myName: "Петя"
};

myObject.sayHello();
    // "Привет! Мое имя Вася"
myObject.sayHello.call( secondObject );
    // "Привет! Мое имя Петя"

Попробуйте Сами »

Пример

// Функция, созданная, используя Function.bind()

var myName = "глобальный объект";
var sayHello = function() {
    console.log( "Привет! Мое имя " +
      this.myName );
};
var myObject = {
    myName: "Вася"
};
var myObjectHello = sayHello.bind( myObject );

sayHello();      // "Привет! Мое имя
                 //   глобальный объект"
myObjectHello(); // "Привет! Мое имя Вася"

Попробуйте Сами »

Пример

// Функция, привязываемая к объекту во время выполнения.

var myName = "глобальный объект";
var sayHello = function() {
    console.log( "Привет! Мое имя " +
      this.myName );
};
var myObject = {
    myName: "Вася"
};
var secondObject = {
    myName: "Петя"
};

myObject.sayHello = sayHello;
secondObject.sayHello = sayHello;

sayHello();              // "Привет! Мое имя
                         //   глобальный объект"
myObject.sayHello();     // "Привет! Мое имя
                         //   Вася"
secondObject.sayHello(); // "Привет! Мое имя
                         //   Петя"

Попробуйте Сами »

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

Пример

Попробуйте Сами »

Можно, однако, безопасно уменьшить все до объекта, на котором вызывается метод:

Пример

Попробуйте Сами »

Далее: Пересечение DOM с jQuery

Смотрите также

Комментарии

Написать