首先看两个例子
- 1
var name='小王',age=17;
var obj={
name:'小张',
objAge:this.age,
myFun:function(){
console.log(this.name+"年龄"+this.age);
}
}
obj.objAge; //17
obj.myFun();//小张年龄 undifined;
- 2
var fav='云天明';
function shows(){
console.log(this.fav);
}
show()//云天明
这两个函数打印语句里面的this，第一个指向obj对象，第二个指向全局变量。
call()、apply()、bind()方法可以修改运行时函数的指针，实际上是改变函数运行时this的值。
了解一下js中的this
js中的this用法有以下几种
- 纯粹的函数调用
最通用的用法属于全局调用，this就代表全局对象。
var x = 1;
function test() {
console.log(this.x);
}
test(); // 1
- 作为对象方法的调用
函数作为某个对象的方法，在对象中定义方法，如开头中的例1
也可以如下面这种
function test() {
console.log(this.x);
}
var obj = {};
obj.x = 1;
obj.m = test;
obj.m(); // 1
- 作为构造函数调用
所谓构造函数，就是通过这个函数，可以生成一个新对象。这时，this就指这个新对象。就是函数定义中有this,当new这个函数的时候this就指向这个函数实例。
var x = 2;
function test() {
this.x = 1;
}
var obj = new test();
x // 2
this是指向函数本身的，不是指向全局变量。
- call()、apply()、bind() 都是用来重定义 this 指向的对象的！
如下面这个实例
var name='小王',age=17;
var obj={
name:'小张',
objAge:this.age,
myFun:function(){
console.log(this.name+"年龄"+this.age);
}
}
var cq={
name:'cq',
age:18
}
obj.myFun.call(cq); //cq 年龄18
obj.myFun.apply(cq); // cq 年龄18
obj.myFun.bind(cq)(); // cq 年龄18
以上函数都传入了cq对象，函数的其中的this都指向了cq对象。
在形式上，三个函数中bind返回的是一个函数，需要重新调用。
- call()、bind()、apply()传参情况如下
var name='小王',age=17;
var obj={
name:'小张',
objAge:this.age,
myFun:function(fm,q){
console.log(this.name+"年龄"+this.age",来自"+fm+"去往"+q);
}
}
var cq={
name:'cq',
age:18
}
obj.myFun.call(cq,'河南','北京'); //cq 年龄18 来自河南去往北京
obj.myFun.apply(cq,['河南','北京']); // cq 年龄18 来自河南去往北京
obj.myFun.bind(cq,'河南','北京')(); // cq 年龄18 来自河南去往北京
obj.myFun.bind(cq,['河南','北京'])(); // cq 年龄18 来自河南，北京去往undefined
会发现参数传递中call()、bind()是类似java的可变参数(第四行不能成功)
apply()必须要传一个数组。可以认为call()、bind()是apply()的语法糖。
当然参数不一定是字符串，也可以是函数、对象等各种类型。
有关于call()的原理需要再学习一下。
