各位能否解释一下在Javascript中使用call
和apply
方法的上下文?
为什么要使用call
和apply
而不是直接调用函数?
各位能否解释一下在Javascript中使用call
和apply
方法的上下文?
为什么要使用call
和apply
而不是直接调用函数?
如果你想要将一个不同的this
值传递给函数,你需要使用call
或者apply
。换句话说,这意味着你想要像执行特定对象的方法一样执行一个函数。两者之间唯一的区别是call
期望用逗号分隔的参数,而apply
期望使用数组形式的参数。
以下是来自Mozilla的apply
页面的示例,展示如何链接构造器:
function Product(name, price) {
this.name = name;
this.price = price;
if (price < 0)
throw RangeError('Cannot create product "' + name + '" with a negative price');
return this;
}
function Food(name, price) {
Product.apply(this, arguments);
this.category = 'food';
}
Food.prototype = new Product();
function Toy(name, price) {
Product.apply(this, arguments);
this.category = 'toy';
}
Toy.prototype = new Product();
var cheese = new Food('feta', 5);
var fun = new Toy('robot', 40);
Product.apply(this, arguments)
的作用是:在每个 Food
和 Toy
构造函数内部将 Product
构造函数作为函数应用,并将每个对象实例作为 this
参数传递。因此,现在每个 Food
和 Toy
都有 this.name
和 this.category
属性。
Toy.prototype = new Product();
?我测试了一下,删除这些代码似乎对最终结果没有影响。 - adrianp,但保留了
Food.prototype = new Product();`,所以现在食品继承自产品,但是玩具没有继承。我还向产品的原型添加了一个方法,并从食品和玩具中调用它,以使缺少继承更加明显(只需打开控制台并运行代码,食品可以调用从产品继承来的方法,但是玩具无法调用并抛出错误)。 - ShawnToy.prototype = new Product();
和Food.prototype = new Product();
,它会正常工作,那么为什么要在示例中添加这些行。 - node_sainiobj.whatever();
语法,它可能会引用调用者对象。 - codethis
值来执行函数时,可以使用.call()
。它将指定的this
值设置为指定值,设置参数,然后调用函数。与直接执行函数的区别在于函数执行时this
指针的值。当您正常执行函数时,JavaScript决定this
指针将是什么(通常是全局上下文window
,除非该函数作为对象的方法调用)。当您使用.call()
时,您可以精确指定this
的设置值。.apply()
。 .apply()
也可以使函数使用特定的this
值执行。当您有不确定数量的参数来自其他来源时,通常使用.apply()
。它经常被用来通过使用特殊的本地变量arguments
来将一个函数调用的参数传递给另一个函数。this
对象。例如:collection.each(function() { ... });
在这个函数中,"this"
指的是迭代器对象。这是一种可能的用法。.apply()
来实现请求队列——将参数数组推入队列中,当执行时,我取出一个元素,并使用.apply()
将其作为处理程序函数的参数传递,这样代码就比传递参数数组作为第一个参数更清晰了。这是另一个例子。function foo () {
this.helloworld = "hello from foo"
}
foo.prototype.print = function () {
console.log(this.helloworld)
}
foo.prototype.main = function () {
this.print()
}
function bar() {
this.helloworld = 'hello from bar'
}
// declaring print function to override the previous print
bar.prototype.print = function () {
console.log(this.helloworld)
}
var iamfoo = new foo()
iamfoo.main() // prints: hello from foo
iamfoo.main.call(new bar()) // override print and prints: hello from bar
我想不出任何正常情况下将thisArg设置为其他内容是使用apply的目的。
apply的目的是将值数组传递给需要这些值作为参数的函数。
在所有常规日常用法中,它已被展开运算符取代。
例如:
// Finding the largest number in an array
`Math.max.apply(null, arr)` becomes `Math.max(...arr)`
// Inserting the values of one array at the start of another
Array.prototype.unshift.apply(arr1, arr2);
// which becomes
arr1 = [...arr2, ...arr1]
apply()
和call()
时thisArg
的作用,而这似乎是你提问的核心所在。你需要理解 JavaScript 中的函数调用原语。 - Saba Ahang