DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> JavaScript中的方法教程調用詳細介紹
JavaScript中的方法教程調用詳細介紹
編輯:關於JavaScript     

JavaScript中,如果function屬於一個對象,那麼通過對象來訪問該function的行為稱之為“方法調用”。與普通的函數調用不同的是,在進行方法調用時,function中的this指代將發生變化 — this將指代用於調用該function的對象(該對象將成為方法調用的invocation context):


代碼如下:
var x = 99;
var sample = {
  x:1,
  act:function(a){
    this.x = a*a;//assign value to sample's x, not global object's x.
  }
}
sample.act(6);
console.log(sample.x);//36
console.log(x);//99


與訪問對象中的property一樣,除了使用點號操作符,JavaScript中還可以通過使用中括號操作符來進行方法調用:


代碼如下:
//other ways to invoke method
sample["act"](7);
console.log(sample.x);//49


對於JavaScript中的function,一個比較有趣的行為是可以在function中嵌入function(閉包)。在進行方法調用時,如果方法function中有嵌入的function,那麼這個嵌入的function中的代碼可以訪問到外部的變量值:


代碼如下:
//nested function can access variable outside of it.
var y = 88;
var sample2 = {
  y:1,
  act2:function(a){
    this.y = inner();
    function inner(){
      return a*a;
    }
  }
}
sample2.act2(8);
console.log(sample2.y);//64
console.log(y);//88


不過,與直覺相反的是,嵌入function中的代碼無法從外部繼承this;也就是說,在嵌入的function中,this指代的並不是調用方法的對象,而是全局對象:


代碼如下:
//nested function does not inherit "this". The "this" in nested function is global object
var sample3 = {
  act3:function(){
    inner();
    function inner(){
      console.log(this);//window object
    }
  }
}
sample3.act3();


如果確實需要在嵌入function中訪問到調用方法的對象,可以在外部function中將this值保存到一個變量中:


代碼如下:
//pass "this" to nested function
var sample4 = {
  act4:function(){
    var self = this;
    inner();
    function inner(){
        console.log(self);//Object {act4=function()}
    }
  }
}
sample4.act4();

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