zoukankan      html  css  js  c++  java
  • 浅谈JavaSript中的this

      JavaScript的this对初学者来说一直是一个很头疼的问题,因为它的指向刚刚接触的时候往往觉得有点莫名奇妙,这篇博客用实例来概括一下,this代表什么以及如何改变函数的this.

      在<JavaScript高级程序设计>一书中,对this做出了简单的介绍.即"this引用了函数据以执行的环境对象".如何理解这句话呢?先来看看第一个实例:

        function testFun1() {
             var num = 3;
             alert(this.num);
         }
         function testFun2() {
             var num = 4;
             testFun1();
         }
         testFun2();//undefined

      上面的代码输出undefined,从这个例子我们可以看出this是不会引用具体的某个函数对象的(虽然在JavaScript中,函数也是对象的一种).那么在上述情况下,this代表什么呢?可以在testFun1()中运行下面代码:

    alert(this);

      输出的结果如下:

      可以得出如下结论:在直接调用函数的时候,this代指window对象!

      为了证明上述结论,可以使用下面例子验证:

        var num = 10;
         function testFun1() {
             var num = 3;
             alert(this.num);
         }
         function testFun2() {
             var num = 4;
             testFun1();
         }
         testFun2();//10

      接下来是第二个示例,我们将函数作为一个对象的属性:

        var num = 10;
         function testFun1() {
             var num = 3;
             alert(this.num);
         }
        var o = new Object();
         o.num = 2;
         o.fun1 = testFun1;
         o.fun1();//2

      可以看出,当通过对象调用函数的时候(这个和Java中的对象调用方法倒挺类似的),则this指向这个对象.那么如果存在多层对象的嵌套呢?看看下面的例子:

       var num = 10;
        var inObj = new Object();
        var outObj = new Object();
        outObj.innerObj = inObj;
        outObj.num = 10;
        inObj.num = 5;
        inObj.infun = testFun1;
         function testFun1() {
             alert(this.num);//5
         }
         outObj.innerObj.infun();

      从上面的例子看出来,当存在多层对象的嵌套的时候,则this指向离函数"最近"的对象.

      讨论完this之后,我们在讨论下如何改变函数中的this.下面的示例演示了两种改变this的方式:

        var num = 3;
          function print() {
              alert(this.num);
          }
          var obj = {"num":10};
          print.call(window);//3
          print.call(obj);//10
          print.call();//3
          var objPrint = print.bind(obj);
          var windowPrint = print.bind(window);
          objPrint();//10
          windowPrint();//3

      call方法代表执行函数,传入的第一个参数代指函数的执行环境,因此在传入window,则通过call方法执行函数的时候.this指向window.传入对象的时候,this指向该对象.

      bind方法则将该函数绑定一个执行环境,并且返回绑定该执行环境的函数对象.可以直接调用.

  • 相关阅读:
    不可或缺 Windows Native (15)
    不可或缺 Windows Native (14)
    不可或缺 Windows Native (13)
    不可或缺 Windows Native (12)
    不可或缺 Windows Native (11)
    不可或缺 Windows Native (10)
    不可或缺 Windows Native (9)
    不可或缺 Windows Native (8)
    不可或缺 Windows Native (7)
    不可或缺 Windows Native (6)
  • 原文地址:https://www.cnblogs.com/hlhdidi/p/6938530.html
Copyright © 2011-2022 走看看