this的基本用法和改變this指向問題

1:全局中的this

this->window.例如

2:在全局作用域中聲明一個變量,等同于在window上添加一個屬性

1. var obj={}; console.log(this.obj); //{}

   this->.obj通過this指向擷取window上挂載的屬性 console.log(window.obj==obj)

   //true

3:函數中的this隻和函數的調用方式有關,和聲明方式無關

1:函數如果直接調用,函數中的this指向window

.例如:var name='zhangsan';   
           function fn(){
           var name='lisi'
           console.log(this.name)} 
            fn() //輸出結果是zhangsan
           

2:如果函數被一個對象調用,那麼this指向該對象

1. var name=‘zhangsan’;

   var obj={

   name:‘lisi’,

   fn:function(){

   name=‘wangwu’

   console.log(this.name) }

   }

   obj.fn() //李四

   var name=‘張三’;

   function getname(){

   console.log(this.name) }

   var obj={

   name:‘李四’,

   fn:function(){

   console.log(this.name)

   },

   lastfn:{

   name:’‘王五’’,

   fn:getname

   } }

   var getAge=obj.fn;

   getname() //函數直接調用,this指向window,是以輸出’張三’

   obj.fn()//函數是被obj對象調用,this指向obj,是以輸出’李四’

   obj.lastfn.fn() //

   目前函數調用的是obj.lastfn,this指向obj.lastfn,是以輸出結果是’王五’

   getAge()//函數是直接調用的,this指向window,内部函數如果有this都是指向window,是以輸出’張三’.

4:this的特殊情況

. 1:事件處理程式中,this指向目前綁定的dom對象.

1. .<div id=“click”">

   click.οnclick=function(){ //click.onclick()click.οnclick=function(){ //click.onclick()

   console.log(this) //輸出節點div

   }

   click.addEventListener(‘click’,function(){ console.log(this) //當中的function也是事件處理程式,是以當中的this也指向目前綁定的dom元素 },false)

2:定時器,延時器;this->window;

1. setInterval(function(){

   console.log(this)//相當于把函數傳遞進來後直接執行了,是以this->window },1000),

5: 如何改變this的指向.

1:call(x,…)

1. 第一個參數x為this的指向,後續參數為選填,為函數傳入的實參.

   var name=‘張三’;

   var obj={

   name:‘李四’

   };

   function fn(a,b){

   console.log(this.name);

   console.log(a+b);

};

fn(); //輸出張三

fn.call(obj); //輸出’李四’,NaN fn.call(obj); //輸出’李四’,NaN

fn.call(obj,10,10) //輸出’李四’,20

2:apply(x,y)

1. 第一個參數x為this的指向,y為傳入參數的集合,用法和call一樣,唯一的差別是call傳入實參是一個一個傳遞,而apply傳入的實參是一個集合.

2. var name=‘張三’;

   var obj={

   name:‘李四’

   };

   function fn(a,b){

   console.log(this.name);

   console.log(a+b);

};

fn(); //輸出張三

fn.apply(obj); //輸出’李四’,NaN

fn.apply(obj,[10,10]) //輸出’李四’,20

3:bind(a,b)

和call用法一樣,不會執行函數,會傳回一個改變this以後的函數