JS之this那些事-创新互联

一直以来,对this的讨论都是热门话题。有人说掌握了this就掌握了JavaScript的80%,说法有点夸张,但可见this的重要性。至今记录了很多关于this的零碎笔记,今天就来个小结。

成都网络公司-成都网站建设公司创新互联建站十余年经验成就非凡,专业从事成都网站建设、成都网站制作,成都网页设计,成都网页制作,软文平台广告投放等。十余年来已成功提供全面的成都网站建设方案,打造行业特色的成都网站建设案例,建站热线:18982081108,我们期待您的来电!

本人看过对this解释的最简单的说法:谁调用这个函数,this指向谁。 好啦,就是这么简单。下面再来具体说一下,请随时用这个说法去验证。

先来看一道js面试题热热身:

JS之this那些事

var obj = {
  foo: function(){
    console.log(this)
  }
} 
var bar = obj.foo
obj.foo() //  objbar() //  window

JS之this那些事

obj.foo()套用“谁调用指向谁”的说法就很好理解了,但bar()为啥是window。其实,这个也是可以套用这个简单的说法。前面我们var了一个变量bar,请注意,这个bar是个全局变量,即bar===window.bar,并把函数obj.foo赋给bar,此时直接调用bar(),就等于window.bar()。这样就好理解了,这个函数就是window调用的,没毛病了。关于这道题的解释,也可以参考这篇文章:http://mp.weixin.qq.com/s/ksqtCd8ouxU-cVc_HnA4Aw

牢记这句话:“谁调用指向谁”,搞清谁调用的,解决大部分的this问题足够了。下面说几个this的特殊情况:

1、函数被具体对象调用时,指向直接调用者。如果这个函数里面嵌套有函数,里面函数的this不会指向这个调用者,可通过that=this改变指向。内部函数用that调用该对象属性。

JS之this那些事

var name="out";var obj={
      name:"in",
      outFoo:function(){           var that=this;//将this赋给that,内部函数的that指向obj
           function inFoo(){                 this.name;   // out,此时this指向window
                 that.name;  // in,此时that指向obj           }
      },
};

JS之this那些事

2、如果函数通过new调用,那么就会创建一个对象,并且this 指向新创建的对象。

JS之this那些事

function Foo(){     //var this=new Object();函数内部隐式默认创建this对象并返回this
     this.name="foo";     //return this;}var obj=new Foo();  //将返回的this赋给objconsole.log(obj.name);// foo

JS之this那些事

3、setTimeOut、setInterval函数中的this指向window。

4、通过apply或call调用时,this会动态改变它的指向。这俩种方法都接受俩个参数,第一个都是调用这个函数的对象。用法:functionNmae.apply(调用的对象,参数2)。

5、通过bind()调用时,这个与前面两个用法差不多,只不过bind()静态绑定this,一旦绑定了就不会改变,即使用call或apply也没用,同时返回一个函数体待执行

另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。


分享题目:JS之this那些事-创新互联
网站地址:http://bzwzjz.com/article/djdiop.html

其他资讯

Copyright © 2007-2020 广东宝晨空调科技有限公司 All Rights Reserved 粤ICP备2022107769号
友情链接: 成都网站制作公司 成都网站制作 LED网站设计方案 成都网站制作 成都网站建设 响应式网站设计 成都营销网站制作 成都网站建设 网站制作报价 外贸营销网站建设 重庆外贸网站建设 成都h5网站建设 成都网站设计 成都网站设计 成都网站设计 成都网站建设 网站设计公司 重庆网站建设 网站制作 网站建设费用 成都网站建设 手机网站制作