最近又遇到了JacvaScript中的call()方法和apply()方法，而在某些时候这两个方法还确实是十分重要的，那么就让我总结这两个方法的使用和区别吧。
1. 每个函数都包含两个非继承而来的方法：call()方法和apply()方法。
都是在特定的作用域中调用函数，等于设置函数体内this对象的值，以扩充函数赖以运行的作用域。
一般来说，this总是指向调用某个方法的对象，但是使用call()和apply()方法时，就会改变this的指向。
call()方法使用示例：
//例1 window.color ='red'; document.color ='yellow';vars1 = {color:'blue'};functionchangeColor(){console.log(this.color); } changeColor.call();//red (默认传递参数)changeColor.call(window);//redchangeColor.call(document);//yellowchangeColor.call(this);//redchangeColor.call(s1);//blue//例2varPet = { words :'...', speak :function(say){console.log(say +''+this.words) } } Pet.speak('Speak');// 结果：Speak...varDog = { words:'Wang'}//将this的指向改变成了DogPet.speak.call(Dog,'Speak');//结果： SpeakWang
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
apply()方法使用示例：
//例1 window.number ='one'; document.number ='two';vars1 = {number:'three'};functionchangeColor(){console.log(this.number); } changeColor.apply();//one (默认传参)changeColor.apply(window);//onechangeColor.apply(document);//twochangeColor.apply(this);//onechangeColor.apply(s1);//three//例2functionPet(words){this.words = words;this.speak =function(){console.log(this.words) } }functionDog(words){//Pet.call(this, words); //结果： WangPet.apply(this, arguments);//结果： Wang}vardog =newDog('Wang'); dog.speak();
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
apply()方法 接收两个参数，一个是函数运行的作用域（this），另一个是参数数组。
语法：apply([thisObj [,argArray] ]);，调用一个对象的一个方法，2另一个对象替换当前对象。
说明：如果argArray不是一个有效数组或不是arguments对象，那么将导致一个
TypeError，如果没有提供argArray和thisObj任何一个参数，那么Global对象将用作thisObj。
call()方法 第一个参数和apply()方法的一样，但是传递给函数的参数必须列举出来。
语法：call([thisObject[,arg1 [,arg2 [,...,argn]]]]);，应用某一对象的一个方法，用另一个对象替换当前对象。
说明： call方法可以用来代替另一个对象调用一个方法，call方法可以将一个函数的对象上下文从初始的上下文改变为thisObj指定的新对象，如果没有提供thisObj参数，那么Global对象被用于thisObj。
使用示例1：
functionadd(c,d){returnthis.a +this.b + c + d; }vars = {a:1, b:2}; console.log(add.call(s,3,4));// 1+2+3+4 = 10console.log(add.apply(s,[5,6]));// 1+2+5+6 = 14
1
2
3
4
5
6
7
使用示例2：
window.firstName ="Cynthia"; window.lastName ="_xie";varmyObject = {firstName:'my', lastName:'Object'};functiongetName(){console.log(this.firstName +this.lastName); }functiongetMessage(sex,age){console.log(this.firstName +this.lastName +" 性别: "+ sex +" age: "+ age ); } getName.call(window);// Cynthia_xiegetName.call(myObject);// myObjectgetName.apply(window);// Cynthia_xiegetName.apply(myObject);// myObjectgetMessage.call(window,"女",21);//Cynthia_xie 性别: 女 age: 21getMessage.apply(window,["女",21]);// Cynthia_xie 性别: 女 age: 21getMessage.call(myObject,"未知",22);//myObject 性别: 未知 age: 22getMessage.apply(myObject,["未知",22]);// myObject 性别: 未知 age: 22
网友评论