JavaScript метод call()

Определение и применение

JavaScript метод call() позволяет вызывать (выполнять) функцию как метод объекта, устанавливая ее контекст исполнения (this, значения контекста вызова) в указанное значение, передавая при этом необходимые аргументы.

Чтобы вызвать функцию (без аргументов) как метод объекта достаточно использовать метод call(), или apply() следующим образом:

func.call( obj );
func.apply( obj );

Все аргументы метода call(), следующие за первым аргументом, который определяет контекст вызова, передаются вызываемой функции. Метод apply() действует подобно методу call(), за исключением того, что аргументы для функции передаются в виде массива, или объекта, подобного массиву, а не перечисляются через запятую:

func.call( obj, 1, 2, 3 );
func.apply( obj, [1, 2, 3] );

Поддержка браузерами

Спецификация: ecma262

✓Поддерживается во всех основных браузерах с 2015 года.

Показать браузеры

ВсеКомпьютерыМобильные

Совместимостьjavascript.builtins.Function.call

Возможность	Компьютеры					Мобильные
	ChromeChrome	EdgeEdge	FirefoxFirefox	OperaOpera	SafariSafari	Chrome AndroidChromeAndroid	Firefox for AndroidFirefoxAndroid	Opera AndroidOperaAndroid	Safari on iOSSafariiOS	Samsung BrowserSamsungAndroid	WebView AndroidWebViewAndroid	WebView on iOSWebViewiOS
call	✓1	✓12	✓1	✓4	✓1	✓18	✓4	✓10.1	✓1	✓1.0	✓4.4	✓1

✓поддерживается◐с ограниченияминет поддержки?нет данных≤31 — не позднее версии 31

JavaScript синтаксис:

// без передачи дополнительных аргументов
func.call( thisArg );

// с указанием дополнительных аргументов передаваемых функции
func.call( thisArg, arg1, ...argX );

Спецификация

ECMAScript — Function.prototype.call().

Значения параметров

Возвращаемое значение

Результат вызова целевой функции, включая undefined, если она ничего не возвращает. Исключения из её тела передаются вызывающему коду.

Исключения

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

Как вызвать функцию с заданным this

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

index.html

HTML

<p>Результат выполнения выводится в консоль.</p>

main.js

JavaScript

let obj = {
    // инициализируем переменную, содержащую объект
    a: 100,
    b: 200,
}

// функция возвращает сумму трех значений
let func = function (c) {
    return this.a + this.b + c
}

// вызываем функцию как метод объекта
console.log(func.call(obj, 300)) // возвращаемое значение 600

Как строгий режим влияет на this

Замените null числом и сравните this в обычной, строгой и стрелочной функции.

index.html

HTML

<p>Результат выполнения выводится в консоль.</p>

main.js

JavaScript

function loose() {
    return this === globalThis
}
function strict() {
    'use strict'
    return this
}
console.log(loose.call(null)) // true
console.log(strict.call(null)) // null
function createArrow() {
    return () => this.label
}
const arrow = createArrow.call({ label: 'Исходный контекст' })
console.log(arrow.call({ label: 'Другой контекст' })) // Исходный контекст