• 我这样理解js里的this


       关于this,是很多前端面试必考的题目,有时候在网上看到这些题目,自己试了一下,额,还真的错了!在实际开发中,也会遇到 this 的问题(虽然一些类库会帮我们处理),例如在使用一些框架的时候,例如:knockout,有时候不明白为什么不直接使用this,而要把 this 作为参数传入。

       接下来你谈谈我对它的理解,也作为一个笔记,方便以后参阅。有不对的地方,欢迎指出批评。

       1. 不像C#,this一定是指向当前对象。js的this指向是不确定的,也就是说是可以动态改变的。call/apply 就是用于改变this指向的函数,这样设计可以让代码更加灵活,复用性更高。

       2. this 一般情况下,都是指向函数的拥有者。这一点很重要!这一点很重要!这一点很重要!

       这也是一道常见的面试题,如下代码:

    <script type="text/javascript">
      var number = 1;
      var obj = {
          number: 2,
          showNumber: function(){
              this.number = 3;
              (function(){                    
                  console.log(this.number);
              })();
              console.log(this.number);
          }
      };
      obj.showNumber();
    </script>

       由于showNumber方法的拥有者是obj,所以this.number=3; this 指向的就是 obj 的属性 number。同理,第二个 console.log 打印的也是属性 number。

       为什么第二点说一般情况下this都是指向函数的拥有者,因为有特殊情况。函数自执行就是特殊情况,在函数自执行里,this 指向的是:window。所以第一个 console.log 打印的是 window 的属性 number。

       所以要加一点:

       3. 在函数自执行里,this 指向的是 window 对象。 

       扩展,关于this,还有一个地方比较让人模糊的是在 dom 事件里,通常有如下3种情况:

       如下:

       1. 使用标签属性注册事件,此时this 指向的是 window 对象。

       <input id="test" type="button" value="按钮" onClick="test()"/>

       function test(){alert(this)}

       2. 对于1,要让 this 指向 input,可以将 this 作为参数传递。

       3. 使用 addEventListener 等注册。此时this 也是指向 input。

       document.getElementById("test").addEventListener("click",test);

       

       好久没写博客,完全生疏了~,以后争取多写一点,记录知识,分享知识。

  • 相关阅读:
    LINQ用于数据库访问的基本方法示例
    设计模式代码示例
    [文档].Altera PLL(锁相环)宏用户指导
    [文档]. Xilinx 编写有效的Testbenches
    [笔记].怎样正确插拔FPGA开发板的JTAG仿真器,如USBBlaster等?
    [连载计划][大家一起学FPGA/SOPC]
    [文档].Altera – SOPC Builder组件开发攻略
    [原创].图解一招搞定UCWEB@Nokia S60v5无法在博客园手机版发闪存的问题
    [文档].Altera – SOPC Builder存储子系统开发攻略
    [笔记].开发SOPC Buider中的自定义IP所必备资料
  • 原文地址:https://www.cnblogs.com/4littleProgrammer/p/4734387.html
Copyright © 2020-2023  润新知