前端知识体系(this指向)

this指向

对于普通函数,this指向全局对象window
对于构造函数,this执行指向新创建的对象
对于方法,this指向调用该方法的对象
另外下面了解一下函数自执行的call,apply,bind

一、call方法
这个方法可以传多个参数,
第二个参数是参数列表,代表传进去的参数
第一个参数是this指向,这个参数可以是四种情况

1不传,或者传null,undefined, 函数中的 this 指向 window 对象
2传递另一个函数的函数名,函数中的 this 指向这个函数的引用
3传递字符串、数值或布尔类型等基础类型,函数中的 this 指向其对应的包装对象,如 String、Number、Boolean
5传递一个对象,函数中的 this 指向这个对象
function a(){
    console.log(this); //输出函数a中的this对象
}
function b(){} //定义函数b
 
var obj = {name:'onepixel'}; //定义对象obj
 
a.call(); //window
a.call(null); //window
a.call(undefined);//window
a.call(1); //Number
a.call(''); //String
a.call(true); //Boolean
a.call(b);// function b(){}
a.call(obj); //Object

2、apply(thisArgs [,args[]])
apply 和 call 的唯一区别是第二个参数的传递方式不同,apply 的第二个参数必须是一个数组(或者类数组),而 call 允许传递一个参数列表。值得你注意的是,虽然 apply 接收的是一个参数数组,但在传递给调用函数时,却是以参数列表的形式传递,我们看个简单的例子:

3、bind(thisArgs [,args…])
它的传参和call类似,但又和 call/apply 有着显著的不同,即调用 call 或 apply 都会自动执行对应的函数,而 bind 不会执行对应的函数,只是返回了对函数的引用
引入 bind 的真正目的是为了弥补 call/apply 的不足,由于 call/apply 会对目标函数自动执行,从而导致它无法在事件绑定函数中使用,
因为事件绑定函数不需要我们手动执行,它是在事件被触发时由JS 内部自动执行的。
而 bind 在实现改变函数 this 的同时又不会自动执行目标函数,因此可以完美的解决上述问题,看一个例子就能明白:
 

var arr = [2,3,1,5,4];
 
Math.max.apply(null,arr); // 5
 

扫描二维码关注公众号,回复: 9404062 查看本文章
发布了550 篇原创文章 · 获赞 10 · 访问量 9万+

猜你喜欢

转载自blog.csdn.net/xiamaocheng/article/details/104332567