Еще одна концепция JavaScript, которую я часто освежаю, — это this. Поскольку this не определяется при назначении, иногда бывает сложно точно определить, к какой области относится this. Давайте углубимся в пример:
this.holiday = "Thanksgiving"; console.log(window.holiday) // "Thanksgiving" console.log(holiday) // "Thanksgiving"
Чтобы проанализировать использование this, важно знать, в каком контексте он используется. Возможны два случая: глобальный контекст и контекст функции. В приведенном выше примере this используется в глобальном контексте или контексте окна. Когда область выполнения является глобальной, а не внутри какой-либо функции, this относится к глобальному объекту, как в приведенном выше примере.
Однако в приведенном ниже примере контекст this меняется. При любом использовании this внутри функции значение определяется при выполнении. Другими словами, значение this может меняться в зависимости от того, как вызывается функция.
var length = 7;
function printLength(){
console.log(this.length);
}
var myObj = {
length: 3,
method: function(anyFunction){
printLength();
arguments[0]();
}
}
myObj.method(printLength, 1) // 7, 1
Во-первых, когда функция printLength передается в качестве параметра методу функции, областью действия thisфункции printLength является окно. Переменная длина была объявлена и присвоена номеру 7 на уровне окна, к которому также можно получить доступ как к окну.длина или длина или это.длина (когда это === окно).
Метод привязан к объекту myObj, и myObj.method вызывается с параметрами printLength и 1. Хотя функция метода принимает только один аргумент, при вызове она передает два аргумента, функцию обратного вызова и число. Помните, что в JavaScript можно передавать несколько аргументов!
Когда printLength() вызывается внутри метода, который передает функцию в качестве параметра на глобальном уровне, this.length будет иметь доступ к var length = 7 (объявленному глобально), а не к length со значением 3, как определено в области видимости Object myObj .
Теперь в функциях JavaScript у нас есть доступ к любому количеству аргументов с помощью массива arguments[]. Аргумент с индексом 0 — это не что иное, как вызов первой переданной функции — printLength(). Теперь внутри printLength область действия этой функции становится массивом аргументов. Следовательно, выполнение myObj.method(printLength, 1) будет регистрировать после 7 длину аргументов, которая равна 2.
Существует несколько способов привязки контекста this, например методы .call и .apply, метод .bind и использование стрелочных функций. Я сохраню это для другого поста в блоге :)
