快捷導(dǎo)航

詳解javascript函數(shù)寫(xiě)法大全

更新時(shí)間：2019年03月25日 11:47:59 作者：最愛(ài)松露巧克力

這篇文章主要介紹了javascript函數(shù)寫(xiě)法，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧

1.常規(guī)寫(xiě)法

 function fnName(){
  console.log("常規(guī)寫(xiě)法");
}

2.匿名函數(shù)，函數(shù)保存到變量里

var myfn = function(){
  console.log("匿名函數(shù)，函數(shù)保存到變量里");
 }

3.如果有多個(gè)變量，可以用對(duì)象收編變量

3.1 用json對(duì)象

 var fnobject1={
   fn1:function(){
      console.log("第一個(gè)函數(shù)");
   },
   fn2:function(){
      console.log("第二個(gè)函數(shù)");
   },
   fn3:function(){
      console.log("第三個(gè)函數(shù)");
   }
 }

3.2 聲明一個(gè)對(duì)象，然后給它添加方法

 var fnobject2 = function(){};
 fnobject2.fn1 = function(){
   console.log("第一個(gè)函數(shù)");
 }
 fnobject2.fn2 = function(){
   console.log("第二個(gè)函數(shù)");
 }
 fnobject2.fn3 = function(){
   console.log("第三個(gè)函數(shù)");
 }

3.3 可以把方法放在一個(gè)對(duì)象函數(shù)里

 var fnobject3 = function(){
   return {
     fn1:function(){
       console.log("第一個(gè)函數(shù)");
       },
     fn2:function(){
       console.log("第二個(gè)函數(shù)");
     },
      fn3:function(){
       console.log("第三個(gè)函數(shù)");
     }  
   }  
 };

4.可用類來(lái)實(shí)現(xiàn),注意類的第二種和第三種寫(xiě)法不能混用，否則一旦混用，如在后面為對(duì)象的原型對(duì)象賦值新對(duì)象時(shí)，那么他將會(huì)覆蓋掉之前對(duì)prototype對(duì)象賦值的方法

4.1 第一種寫(xiě)法

 var fnobject4 = function(){
   this.fn1 = function(){
     console.log("第一個(gè)函數(shù)");
  }
   this.fn2 = function(){
     console.log("第二個(gè)函數(shù)"); 
   }
   this.fn3 = function(){
     console.log("第三個(gè)函數(shù)");
   }
 };

4.2 第二種寫(xiě)法

 var fnobject5 = function(){};
 fnobject5.prototype.fn1 = function(){
   console.log("第一個(gè)函數(shù)");
 }
 fnobject5.prototype.fn2 = function(){
   console.log("第二個(gè)函數(shù)");
 }
 fnobject5.prototype.fn3 = function(){
   console.log("第三個(gè)函數(shù)");
 }

4.3 第三種寫(xiě)法

 var fnobject6 = function(){};
 fnobject6.prototype={
   fn1:function(){
     console.log("第一個(gè)函數(shù)");
   },
   fn2:function(){
     console.log("第二個(gè)函數(shù)");
   },
   fn3:function(){
     console.log("第三個(gè)函數(shù)");
   }
 }

4.4 第四種寫(xiě)法

var fnobject7 = function(){};
fnobject7.prototype={
  fn1:function(){
    console.log("第一個(gè)函數(shù)");
    return this;
  },
    fn2:function(){
    console.log("第二個(gè)函數(shù)");
    return this;
  },
  fn3:function(){
    console.log("第三個(gè)函數(shù)");
    return this;
  }
}

5.對(duì)Function對(duì)象類的擴(kuò)展(下面三種只能用一種)

5.1 第一種寫(xiě)法（對(duì)象）

 Function.prototype.addMethod = function(name,fn){
   this[name] = fn;
 }
 var methods=function(){};//var methods=new Function();
 methods.addMethod('fn1',function(){
   console.log("第一個(gè)函數(shù)");
 });
 methods.addMethod('fn2',function(){
   console.log("第二個(gè)函數(shù)");
 });
 methods.addMethod('fn3',function(){
   console.log("第三個(gè)函數(shù)");
 });

5.2 鏈?zhǔn)教砑樱▽?duì)象）

Function.prototype.addMethod = function(name,fn){
  this[name] = fn;
   return this;
 }
 var methods=function(){};//var methods=new Function();
 methods.addMethod('fn1',function(){
   console.log("第一個(gè)函數(shù)");
 }).addMethod('fn2',function(){
   console.log("第二個(gè)函數(shù)");
 }).addMethod('fn3',function(){
   console.log("第三個(gè)函數(shù)");
 });

5.3 鏈?zhǔn)教砑樱悾?/p>

Function.prototype.addMethod = function(name,fn){
  this.prototype[name] = fn;
  return this;
}
var Methods=function(){};//var methods=new Function();
methods.addMethod('fn1',function(){
  console.log("第一個(gè)函數(shù)");
}).addMethod('fn2',function(){
  console.log("第二個(gè)函數(shù)");
}).addMethod('fn3',function(){
  console.log("第三個(gè)函數(shù)");
});

以上所述是小編給大家介紹的javascript函數(shù)寫(xiě)法詳解整合，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章: