视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
Js的this指向apply().call(),bind()的问题
2020-11-27 20:11:46 责编:小采
文档


笔记记录缘由:JavaScript的流行趋势已经势不可挡,衍生的AngularJs,Node.js,BootStrmp中小企业的后端开发越来越没有优势,IT不是一个可以完全靠经验说话的岗位,IT改变生活,作为一个三年的.Net程序员现在深深的感受到守旧其实就是害怕,躲避时代的进度,人生需要激情,需要动力!

正文:

一、apply().call(),bind()是做什么的?

这三个都是改变方法中this指向的

二、this是什么东西?

this指你当前调用的方法的执行对象,例如setTimeout方法的this

1 setTimeout(function(){
2 console.log(this)
3 },1000)

输出结果:

Window {external: Object, chrome: Object, document: document, Alax: Object, a2: Object…}

因为setTimeout的完全调用时Window.setTimeout 它属于Window对象的一个方法。

再定义一个对象

var Alax={
 name:'Alax',
 age:27,
 fuc:function(){ 
 return this.age;
 }
 }

按理说使用console.log(Alax.fun)应该输出的27但实际情况是undefined,这是为什么呢?因为在Alax对象外调用时实际的作用对象时Window,而Window是不包含age属性的,也就是说this指向改变了需要重新指定,此处先记着等讲完概念在对比你心中所想

三、call,apple,bind三者的区别

1. 参数对比

call的参数格式是(thisvalue,arg1)

apply的是(thisvalue,[arg1,ar2...])

bind的参数格式是(thisvalue,arg1,ar2...)

thisvalue指的是要传递的this指向,后面的参数是非必输跟方法的参数一一对应,传入了都可以用arguments获取

2.返回结果对比

call和apple指将所有参数传递到arugements,并直接返回调用结果

bind指将返回一个传入值在方法运行后返回一个新的函数 需要加上()调用

总结:上面的调用方式可以是

console.log((Alax.fuc).call(Alax))
console.log((Alax.fuc).apply(Alax))
console.log((Alax.fuc).bind(Alax)())

附上参数调用

Alax={
 name:'Alax',
 age:27,
 fuc:function(num){ 
 this.age+=num 
 return this.age;
 }
 }
 console.log((Alax.fuc).call(Alax,1))
 console.log((Alax.fuc).apply(Alax,[1]))
 console.log((Alax.fuc).bind(Alax)(1))

下载本文
显示全文
专题