JavaScript中的方法呼叫詳細介紹-js教程-PHP中文網

JavaScript中的方法呼叫詳細介紹

PHPz

發布： 2018-09-29 17:56:42

原創

1169 人瀏覽過

這篇文章主要介紹了JavaScript中的方法調用詳細介紹,JavaScript中,如果function屬於一個對象,那麼通過對象來訪問該function的行為稱之為“方法調用”,需要的朋友可以參考下。

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&#39;s x, not global object&#39;s x.
  }
}
sample.act(6);
console.log(sample.x);//36
console.log(x);//9

登入後複製

與存取物件中的property一樣，除了使用點號運算子，JavaScript中也可以透過使用中括號運算子來進行方法呼叫：

//other ways to invoke method
sample["act"](7);
console.log(sample.x);//4

登入後複製

對於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();

登入後複製

以上就是本章的全部內容，更多相關教程請訪問JavaScript視頻教程！