DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> 你必須知道的Javascript知識點之this指針的應用
你必須知道的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.name; };
 user.getName();  //返回‘段光偉'

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

規則2
如果在方法調用時沒有為方法指定對象則this指針默認指向window,如:fun(),fun方法體中的this指針指向window。
復制代碼 代碼如下:
var fun = function(){
   return this;
 }
 fun();  //返回window對象

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

 this  //window對象
改變this指針的默認指向
使用apply
復制代碼 代碼如下:
var user = { name: '段光偉' };
 user.hi= function(message){ 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){
    this.name = name;
 };
 User.prototype.hi = function(){
    return this.name;
 };
 var user = new User('段光偉');
 user.hi();  //輸出‘段光偉'

最後的小測試
猜猜最後的輸出時什麼?
復制代碼 代碼如下:
var User = function(name){
     this.name = name;
  };
  User.prototype.hi = function(){
     return this.name;
  };
  var user = new User('段光偉');
  user.hi();  //輸出‘段光偉'

 var hi = user.hi;

 hi();  //猜猜這裡的輸出

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved