zoukankan      html  css  js  c++  java
  • 我理解的this

      this指的就是当前上下文环境对象,主要分两种情况。

    1.函数中的this指的是调用该函数的那个上下文环境对象

      这个的理解还是非常重要的。 

      看一个全局函数的例子

    var b = 1;
    function a(){
      alert(this.b);
    }
    a();//1

      这里面函数a是属于全局变量window。所以调用a的时候实际上和window.a()等同。所以a函数中的this指的是调用a函数的调用者window。所以打印出1就不稀奇了。 

      再看一个对象的例子

    var person = {
      name:'chua',
      do:function(){alert(this.name)}
    }
    person.do();//'chua'

      这里面函数do是属于对象person。所以调用person.do的时候函数中的this指的是调用do函数的调用者person。所以打印出this.name就是person.name打印'chua'。

      最后是call/apply的例子

    var b = 0; 
    var c = {
      a: function(){alert(this.b); },
      b: 1
    }
    var d = { b: 2};
    c.a.apply(); //0 
    c.a.apply(d); //2

      apply第一个参数会替换上下文环境,没有第一个参数的时候默认是全局变量window。

      setTimeout中函数都是挂载到全局变量window下的。怎么理解?我们看下面的例子

    setTimeout(function(){
      console.log(this);//this是window对象
    },1);

      更改一下代码

    function a(){
      setTimeout(function(){
        console.log(this);//this是window对象
      },1);
    };
    a();//输出window对象

      另外的变体

    var b = {
      a :function(){
        setTimeout(function(){
          console.log(this);//this是window对象
        },1);
      };
    }
    b.a();//输出window对象    

      所以只要是定时类函数setTimeout或setInterval定义的函数,函数的上下文环境都应该是window。

    2.构造函数调用

      构造函数调用实际上就是切换了上下文环境到新建的对象中。

    function a(){
        this.b = 1;
    }
    var c = new a();
    alert(c.b); //1
    alert(typeof b); //"undefined"

       new a()后上下文环境对象变成了c。

      参考jQuery框架中的new的深度理解

  • 相关阅读:
    递归程序设计方法
    深入理解 Entity Framework
    面向对象设计的七大原则分析与实践
    JavaScript内置对象与原型继承
    设计模式之创建型(1)-简单工厂
    设计模式之创建型(2)-工厂方法模式
    设计模式之创建型(3)-抽象工厂模式
    设计模式之创建型(4)-建造者模式(Builder)
    设计模式之创建型(5)-单例模式(Singleton)
    设计模式之创建型(6)-原型模式(Prototype)
  • 原文地址:https://www.cnblogs.com/chuaWeb/p/5198957.html
Copyright © 2011-2022 走看看