你必須知道的Javascript知識點之'this指針'的應用_javascript技巧

很多人都知道this指針，這篇文章的主要目的是為了培訓我們公司的新人。
預設的this指標指向
規則1
this指標預設指向方法呼叫時為其指定的對象，如：obj.fun()，fun方法體中的this指針指向obj。

複製程式碼 程式碼如下:

var user = { name: '段光偉' }; 🎜>user.getName = function(){ return this.name; };
user.getName();  //回傳'段光偉'

複製程式碼 程式碼如下:

var user = { name: '段光偉' };
 user.getName = function(){ return this(){ return this .name; };
 user.getName();  //回傳'段光偉'

 window.name = '李妞';
 window.getName = user.getName window.getName = user.getName window. getName();  //回傳'李妞'
 getName();  //回傳'李妞'

規則2
如果在方法呼叫時沒有為方法指定物件則this指標預設指向window，如：fun()，fun方法體中的this指標指向window。

複製程式碼 程式碼如下:

var fun = function(){


var fun = function(){
;
 }

 fun();  //返回window物件

規則3沒有在方法論中的程式碼可以看作執行在一個匿名方法，根據規則2可以推論出其this指標指向window。

 this  //window物件
改變this指標的預設指向

使用apply複製程式碼

複製程式碼



複製程式碼

var user = { name: '段光偉' };
 user.hi= function(message){ return this.name ':' message; };

 window.name return this.name ':' message; }; window.name = '李妞' user.hi('你好');  //輸出'段光偉:你好' user.hi.apply(window, ['你好']);  //輸出'李妞：你好'用call

複製程式碼

複製程式碼


代碼:

var user = { name: '段光偉' }; user.hi= function(message){ return this.name ':' message; }; window.name = '李妞'  user.hi('你好');  //輸出'段光偉:你好' user.hi.call(window, '你好');  //輸出'李妞：你好'

建構子中的this指向
建構函式中的this指標預設指向執行正在建構的物件。




複製程式碼


程式碼如下:

var User = function(name){
 .name = name; };
 User.prototype.hi = function(){

    return this.name; }; var user = new User('段光偉');  user.hi();  //輸出'段光偉'

最後的小測試

猜猜最後的輸出時什麼？




複製程式碼


程式碼如下:


var User = function(name){
 .name = name;

  };
  User.prototype.hi = function(){     return this.name;  };  var 標 this.name;  };  var user =usera User('s   user.hi();  //輸出'段光偉' var hi = user.hi; hi();  //猜猜這裡的輸出 hi();  //猜猜這裡的輸出