首页 > 代码库 > 彻底搞清函数中的this指向
彻底搞清函数中的this指向
近日阅读《javascript设计模式与开发实践》
书中的apply和call调用函数层出不穷,很多妙用;
函数中的this是根据调用方式来决定的
函数调用方式有4中
1、直接调用 a(...arg); 函数a中的this总是绑定的window /严格模式下绑定的undefined
2、方法调用 a.b(...arg); 方法函数b会返回当前执行上下文的对象a;如果a.b.c(); 那么此时返回的就是b
3、构造器调用 new a(...arg);构造器不会引用任何上下文的内容,只是单纯的根据自己生成一个对象并且返回;
4、使用call/apply调用 a.call(this,...arg);
function add(){ this.a = "add-a"; console.log(this) } add(); //控制台:window; //数据改变:此时会多一个全局变量a;window.a="add-a"; var obj = { a:1, b:{ a:2, c:add } } obj.b.c(); //控制台:obj.b指向的对象 {a:"add-a",c:function add()...} //数据改变:直接调用类似,add会改变上下文的属性值;obj.b.a==="add-a" new obj.b.c(); //控制台:通过构造器调用,不会改变obj.b.a;所以此时obj.b.a依然等于"add-a" //数据改变:无 obj.b.c.call(); //控制台:window; //数据改变:window.a的值会重新被赋值"add-a" //不传入参数或者传入undefined、null时,add中的this就会是全局对象 //否则传入什么对象、运行时的this就是传入的对象 //注意:这里其他的数据类型 String Number Boolean Object也会当做一个对象进行处理 //例如: obj.b.c.call(1); //控制台: Number {a: "add-a", [[PrimitiveValue]]: 1} obj.b.c.call(false); //控制台:Boolean {a: "add-a", [[PrimitiveValue]]: false}
彻底搞清函数中的this指向
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。