call和apply(学习笔记)

Posted taohuashan

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了call和apply(学习笔记)相关的知识,希望对你有一定的参考价值。

call语法:

function.call(thisArg, arg1, arg2, ...)

参数:

thisArg:可选的。表示this修改后指向色目标。(注意:如果该方法是在非严格模式下的函数,那么null和未定义将被全局对象替换,而原始值将被转换为对象。)

arg1:,arg2可选的。表示函数的参数列表,表示哪些函数的属性会继承过去。

例子:

function Product(name, price) {
  this.name = name;
  this.price = price;
}

function Food(name, price) {
  Product.call(this, name, price);
  this.category = ‘food‘;
}

function Toy(name, price) {
  Product.call(this, name, price);
  this.category = ‘toy‘;
}

var cheese = new Food(‘feta‘, 5);
var fun = new Toy(‘robot‘, 40);

其他例子:

对匿名函数上使用call

技术分享图片
var animals = [
  { species: ‘Lion‘, name: ‘King‘ },
  { species: ‘Whale‘, name: ‘Fail‘ }
];

for (var i = 0; i < animals.length; i++) {
  (function(i) {
    this.print = function() {
      console.log(‘#‘ + i + ‘ ‘ + this.species
                  + ‘: ‘ + this.name);
    }
    this.print();
  }).call(animals[i], i);
}
匿名函数使用calld代码

使用调用函数来为this指定上下文

技术分享图片
 1 function greet() {
 2   var reply = [this.person, ‘Is An Awesome‘, this.role].join(‘ ‘);
 3   console.log(reply);
 4 }
 5 
 6 var i = {
 7   person: ‘Douglas Crockford‘, role: ‘javascript Developer‘
 8 };
 9 
10 greet.call(i); // Douglas Crockford Is An Awesome Javascript Developer
调用函数为this指定上下文代码

调用函数不指定参数(参考文中开头对参数的描述)

技术分享图片
1 var sData = ‘Wisen‘;
2             
3 function display(){
4     console.log(‘sData value is %s ‘, this.sData);
5 }
6 
7 display.call(); //sData value is Wisen
不指定参数

 call和apply的区别只是.call(this,arg1,arg2,...)是参数列表.aoply(this,[arg1,arg2,...])是参数数组,因此不再介绍。

bind语法:

再说,吃饭了

以上是关于call和apply(学习笔记)的主要内容,如果未能解决你的问题,请参考以下文章

深入学习JavaScript: apply call方法 详解(转)

深入学习JavaScript: apply 方法 详解

js学习总结----call和apply和bind的区别

关于JS中apply和call详细解答

《JavaScript设计模式与开发》笔记 3.call和apply

深入学习JavaScript: apply 方法 详解(转)——非常好