Метод call может применяться для вызова функции в контексте нужного объекта:
Пример: Вызов sayName в контексте разных объектов
var Animal1 = {name: 'Cat'}
var Animal2 = {name: 'Dog'}
function sayName() {
// this — ссылка на объект, в контексте которого вызвана функция
alert(this.name);
}
sayName.call(Animal1) // выдаст сообщение "Cat"
sayName.call(Animal2) // выдаст сообщение "Dog"
При этом совершенно не важно, какому объекту принадлежит функция. В качестве текущего(this) объекта будет взят первый аргумент.
var Animal1 = {
name: 'Cat',
sayName: function() {
alert(this.name);
}
};
var Animal2 = {name: 'Dog'};
Animal1.sayName() // выдаст сообщение "Cat"
Animal1.sayName.call(Animal2) // выдаст сообщение "Dog"
Помимо смены контекста вызова, метод call может передавать в функцию аргументы:
var obj = {attr: 10};
function sum(a, b) {
alert(this.attr + a + b);
}
sum.call(obj, 5, 2) // выдаст сообщение с результатом "17"
Если контекст вызова не указан, то функция будет выполнятся в контексте объекта window:
window.a = 5
function sayThis() {
alert(this.a);
}
sayThis.call() // выдаст 5
window.a = 5
function sayThis(b) {
alert(this.a + b);
}
sayThis.call(null, 3) // выдаст 8
А в чем отличия между apply и call (кроме способа передачи доп. аргументов)? Как-то не верится, что придумали два одинаковых метода для реализации одного и того же.
синтаксический сахар
Как минимум этим:
В apply вторым аргументом передаётся массив переменных.
В call - все аргументы через запятую (второй и последующие аргументы не могут быть переданы в виде массива переменных).
// Простая функция, устанавливающая цветовой стиль своего контекста
function changeColor( color ) {
this.style.color = color;
}
// Ее вызов для объекта window, заканчивающийся неудачей, поскольку в нем
// нет объекта style
changeColor( "white" );
// Поиск элемента, ID которого равен main
var main = document.getElementById("main");
// Установка для него черного цвета, используя метод call
// Этот метод устанавливает контекст по первому аргументу, и передает все
// остальные аргументы в качестве аргументов функции
changeColor.call( main, "black" );
// Функция, устанавливающая цвет элемента body
function setBodyColor() {
// Метод apply устанавливает контекст на элемент body, указанный в
// качестве первого аргумента, второй аргумент представляет собой массив
// аргументов, передаваемых функции
changeColor.apply( document.body, arguments );
}
// Установка для элемента body черного цвета
setBodyColor( "black" );
Ребята,
Я новичок в Java скрипт, прошу вашей помощи.
Итак имеется конструктор объекта:
function slider(id) { this.bloker = document.getElementById(id); this.value = 0; this.DrawBar = function(color, value) //Рабочий метод класса { this.value += value; if (this.value > 148) { this.value = 148; } this.bloker.style.backgroundColor = color; this.bloker.style.width = this.value + "px"; if (this.value == 148) { this.value = 0 - value; } } this.Timer = function(color, num) // Метод не работает. Как правильно передать { setInterval(function(){DrawBar("red",10).call(this)}, 1000); } }Требуется создать классу метод Timer в котором в функцию setInterval передавать другой метод этого же класса - DrawBar.
Пробовал и так. Нулевой эффект.
this.Timer = function(color, num) { setInterval(function(){this.DrawBar(color,num)}, 1000); }Внутри setInterval this уже не тот, что вы думаете. Попробуйте в теле верхней функции создать переменную (например, self) и записать в нее this. Внутри же setInterval обращайтесь уже не к this, а к новой переменной (например, self).
В случае call не возможно сформировать список аргументов переменной длинны, в случае apply можно любой массив передать или объект arguments, чтобы передать в функцию аргументы текущей функции.
Мне как-то привели такой пример:
function.call(obj, arg) = obj.function(arg)
Для меня это было самым простым объяснением работы функции call.
Привет, а что будет если пытаться вызывать метод без call.
Просто - Array.prototype.toString(['some']);