JavaScript-this理解

javascript this可以绑定到：全局对象,自己定义的对象,用构造函数生成的对象,通过call或者apply更改绑定的对象

     1.全局对象       

function globalTest(name){
     this.name=name;
 }
 globalTest('tree');
 console.log(name);//tree,默认生成了全局对象name，这种写法一般是不允许的

　　

     2.自己定义的对象    

var subway={
     name:'1号线',
     speed:0,
     run:function(speed){
         this.speed=speed;
     }
 };
 subway.run(100);
 console.log(subway.speed); //100,this绑定到对象subway
 

  

     3.用构造函数生成的对象

        构造函数约定第一个字母要大写，只有用new调用的时候才算构造函数，否则跟普通函数没有什么不同，用new调用构造函数，this会绑定到生成的对象。   

function Subway(speed){
     this.speed=speed;
 }
 var s=new Subway(100);
 console.log(s.speed);//100;this绑定到新生成的对象
 

 

     4.指定的对象，通过call或者apply绑定

 call函数和apply函数的区别是参数不一样，两个方法都可以改变this绑定的对象，如下

call(obj,param1,param2……)；

apply(obj,[]/*params[]参数数组*/)；

function Subway(name){
     this.name=name;
     this.speed=0;
     this.run=function(speed){
      this.speed=speed;
     };
 }
 var s=new Subway('1号线');
 s.run(300);
 console.log('一号线速度为：',s.speed);//300;this绑定到新生成的对象s
 var s1=new Subway('2号线');
 s.run.apply(s1,[100]);
 console.log('二号线速度为：',s1.speed);//100;this绑定到对象s1
 s.run.call(s1,200);
 console.log('二号线速度为：',s1.speed);//200;this绑定到对象s1

最后：

javascript有一个设计缺陷，使得的this绑定混乱

 

var subway={
     name:'1号线',
     speed:0,
     run:function(speed){
         this.speed=speed;  //绑定到对象本身
         function test(speed){
             this.speed=speed+50;//竟然绑定到全局变量了，真是匪夷所思啊
         }
         test(speed);
     }
 };
 subway.run(100);
 console.log(subway.speed);//100
 console.log(speed);//150

 

解决方法约定用that代替this

var subway={
     name:'1号线',
     speed:0,
     run:function(speed){
         var that=this;   //用that代替this
         this.speed=speed;
         function test(speed){
             that.speed=speed+50;
         }
         test(speed);
     }
 };
 subway.run(100);
 console.log(subway.speed);//150

 

转载于:https://www.cnblogs.com/greenteaone/p/4193985.html