js的函數調用會免費奉送兩個而外的參數就是 this 和 arguments 。arguments是參數組，他并不是一個真實的數組，但是可以使用.length方法獲得長度。

書上有說4中調用方式：

• 方法調用模式
• 函數調用模式
• 構造器調用模式
• apply調用模式

下面我們來看看一些實例更好理解。

1：方法調用模式。

請注意this此時指向myobject。

/*方法調用模式*/
??? var myobject={
??????????? value:0,
??????????? inc:function(){
??????????????????? alert(this.value)
??????????????? }
??????? }
??? myobject.inc()

?

2：函數調用模式

請注意this此時指向window

/*函數調用模式*/
????
??? var add=function(a,b){
??????? alert(this)//this被綁頂到window
??????????? return a+b;
??????? }
??? var sum=add(3,4);
??? alert(sum)

?

3：構造器調用模式

javascript語言精粹一書建議摒棄這中方式。因為有更好的方式。這里先不介紹。下次發表博文的時候貼出來。

會在這里加一個連接。

/*構造器調用模式? 摒棄*/
????
??? var quo=function(string){
??????????? this.status=string;
??????? }
??? quo.prototype.get_status=function(){
??????????? return this.status;
??????? }
??? var qq=new quo("aaa");
??? alert(qq.get_status());

?

4：apply調用模式

==我們可以來看一個更有用的apply實例。看最下面的代碼。

?

/*apply*/
??? //注意使用了上面的sum函數
??? //與myobject
??? //這中調用方式的優點在于可以指向this指向的對象。
??? //apply的第一個參數就是this指針要指向的對象
??? var arr=[10,20];
??? var sum=add.apply(myobject,arr);
??? alert(sum);

?

看這個apply真正應用。bind這是一個綁定時間的函數

var bind=function(object,type,fn){
??????????? if(object.attachEvent){//IE瀏覽器
??????????????????? object.attachEvent("on"+type,(function(){
?????????????????????????????????????????????????????????? return function(event){
?????????????????????????????????????????????????????????????? window.event.cancelBubble=true;//停止時間冒泡
?????????????????????????????????????????????????????????????? object.attachEvent=[fn.apply(object)];//----這里我要講的是這里
?????????????????????????????????????????????????????????????? //在IE里用attachEvent添加一個時間綁定以后。
?????????????????????????????????????????????????????????????? //this的指向不是到object對象本身所以。我們綁定的function里的this.id是無法正常工作的。
?????????????????????????????????????????????????????????????? //但是如果我們用fn.apply(object)
?????????????????????????????????????????????????????????????? //這里可以看出我們是把apply的第一個對象也就是this的指向變更給了object所以this.id就變成了
?????????????????????????????????????????????????????????????? //object.id 可以正常工作了。
???????????????????????????????????????????????????????????????
?????????????????????????????????????????????????????????????? }
?????????????????????????????????????????????????????????? })(object),false);
??????????????? }else if(object.addEventListener){//其他瀏覽器
??????????????????????? object.addEventListener(type,function(event){
????????????????????????????????????????????????????????????? event.stopPropagation();//停止時間冒泡
????????????????????????????????????????????????????????????? fn.apply(this)
????????????????????????????????????????????????????????????? });
??????????????????? }
????????????
??????? }
??? bind(document.getElementById("aaa"),"click",function(){alert(this.id)});?

轉載于:https://www.cnblogs.com/haoqingzhege/p/6701934.html

總結

以上是生活随笔為你收集整理的JS函数调用的四种方法的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。