首頁 > web前端 > js教程 > 主體

JS中創建函數的三種方式及區別

PHPz
發布: 2018-10-15 14:06:57
原創
1411 人瀏覽過

1.函數宣告

function sum1(n1,n2){
    return n1+n2;
  };
登入後複製

2.函數表達式,又叫函數字面量

var sum2=function(n1,n2){
    return n1+n2;
};
登入後複製

兩者的區別:解析器會先讀取函數聲明,並使其在執行任何程式碼之前可以存取;而函數表達式則必須等到解析器執行到它所在的程式碼行才會真正被解釋執行。

自執行函數嚴格來說也叫函數表達式,它主要用於創建一個新的作用域,在此作用域內聲明的變量,不會和其它作用域內的變量衝突或混淆,大多是以匿名函數方式存在,且立即自動執行。

(function(n1,n2){
    console.log (n1+n2)
})(1,3);//4
登入後複製

另外幾個自執行函數:

  //可用来传参
  (function(x,y){
    console.log(x+y);
  })(2,3);

  //带返回值
  var sum=(function(x,y){
    return x+y;
  })(2,3);
  console.log(sum);

  ~function(){
    var name='~'
    console.log(name);
  }();

  !function(){
    var name='!'
    console.log(name);
  }();

  ;(function(){
    var name=';'
    console.log(name);
  })();

  -function(){
    var name='-'
    console.log(name);
  }();

  //逗号运算符
  1,function(){
    var name=',';
    console.log(name);
  }();

  //异或
  1^function(){
    var name='^';
    console.log(name);
  }();

  //比较运算符
  1>function(){
    var name='>';
    console.log(name);
  }();

  ~+-!(function(){
    var name='~+-!';
    console.log(name);
  })();

  ~!(function(){
    var name='~!';
    console.log(name);
  })();

  (function(){
    var name='call';
    console.log(name);
  }).call();

  (function(){
    var name='apply';
    console.log(name);
  }).apply();
登入後複製

3.函數建構法,參數必須加引號

var sum3=new Function('n1','n2','return n1+n2');
console.log(sum3(2,3));//5
登入後複製

從技術角度講,這是一個函數表達式。一般不建議用這種方法定義函數,因為這種語法會導致解析兩次程式碼(第一次是解析常規ECMAScript程式碼,第二次是解析傳入建構函數中的字串),進而影響效能。

var name='haoxl';
  function fun(){
    var name='lili';
    return new Function('return name');//不能获取局部变量
  }
 console.log(fun()());//haoxl
登入後複製

 Function()構造函數每次執行時都會解析函數主體,並建立一個新的函數對象,所以當在一個循環或頻繁執行的函數中呼叫Function ()構造函數效率是非常低的。而函數字面量卻不是每次遇到都會重新編譯的,用Function()構造函數創建一個函數時並不遵循典型的作用域,它一直把它當作是頂級函數來執行。

【相關教學推薦】

1. JavaScript影片教學
2. JavaScript線上手冊
3. bootstrap教學

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!