JavaScript Вызов функций

Функции JavaScript имеют 4 способа вызова.

Разница между каждым методом заключается вthisинициализации

thisKeywords

Вообще говоря, в JavaScript this указывает на текущий объект при выполнении функции.

Note Примечаниеthis— зарезервированное ключевое слово, вы не можете изменять значениеthis.

Вызов функций JavaScript

В предыдущих главах мы узнали, как создавать функции.

Код внутри функции выполняется после вызова функции.

Вызов как функции

Пример

function myFunction(a, b) { return a * b; } myFunction(10, 2); //myFunction(10, 2) возвращает 20

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

Приведённая выше функция не принадлежит никакому объекту. Но в JavaScript она всегда является глобальным объектом по умолчанию.

В HTML глобальным объектом по умолчанию является сама HTML-страница, поэтому функция принадлежит HTML-странице.

Объектом страницы в браузере является окно браузера (объект window). Приведённая выше функция автоматически становится функцией объекта window.

myFunction() и window.myFunction() — это одно и то же:

Пример

function myFunction(a, b) { return a * b; } window.myFunction(10, 2); //window.myFunction(10, 2) возвращает 20

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

Note Это распространённый способ вызова функций JavaScript, но это не является хорошей практикой программирования.
Глобальные переменные, методы или функции могут легко вызывать ошибки из-за конфликтов имён.

Глобальный объект

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

В веб-браузере глобальным объектом является окно браузера (объект window).

В этом примере возвращаетсяthisзначением this является объект window:

Пример

function myFunction() { return this; } myFunction(); //Возвращает объект window

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

Note Вызов функции как глобального объекта делаетthisзначение this глобальным объектом.
Использование объекта window в качестве переменной может легко привести к сбою программы.

Вызов функции как метода

В JavaScript можно определить функцию как метод объекта.

В следующем примере создаётся объект (myObject), объект имеет два свойства (firstNameиlastName), и метод (fullName):

Пример

var myObject = { firstName:"John", lastName: "Doe", fullName: function () { return this.firstName + " " + this.lastName; } } myObject.fullName(); //Возвращает "John Doe"

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

fullNameМетод — это функция. Функция принадлежит объекту.myObjectявляется владельцем функции.

thisОбъект, которому принадлежит код JavaScript. В примере,thisзначение this — этоmyObjectобъект.

Проверьте! ИзменитеfullNameметод и вернитеthisзначение:

Пример

var myObject = { firstName:"John", lastName: "Doe", fullName: function () { return this; } } myObject.fullName(); //Возвращает [object Object] (объект-владелец)

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

Note Вызов функции как метода объекта делаетthisзначением this — сам объект.

Вызов функции с помощью конструктора

Если вызову функции предшествует ключевое словоnew, то это вызов конструктора.

Это выглядит как создание новой функции, но на самом деле функции JavaScript — это объекты, создаваемые заново:

Пример

//Конструктор: function myFunction(arg1, arg2) { this.firstName = arg1; this.lastName = arg2; } // Это создаёт новый объект var x = new myFunction("John","Doe"); x.firstName; //Возвращает "John"

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

Вызов конструктора создаёт новый объект. Новый объект наследует свойства и методы конструктора.

Note В конструкторе ключевое словоthisне имеет значения.
thisЗначение this создаётся, когда вызов функции создаёт экземпляр объекта (новый объект).

Вызов функции как метода функции

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

call()иapply()являются предопределёнными методами функций.

Пример

function myFunction(a, b) { return a * b; } myObject = myFunction.call(myObject, 10, 2); //Возвращает 20

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

Пример

function myFunction(a, b) { return a * b; } myArray = [10, 2]; myObject = myFunction.apply(myObject, myArray); //Возвращает 20

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

Оба метода используют сам объект в качестве первого параметра. Разница между ними заключается во втором параметре: apply принимает массив аргументов, то есть несколько аргументов объединяются в массив и передаются, тогда как call передаёт их как аргументы call (начиная со второго параметра).

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

В нестрогом режиме JavaScript, если первый параметр равен null или undefined, вместо него будет использоваться глобальный объект.

Note С помощью методов call() или apply() можно задатьthisзначение this и вызвать функцию как новый метод существующего объекта.
Другие расширения