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

詳細分析JavaScript函數定義_javascript技巧

WBOY
發布: 2016-05-16 15:50:04
原創
1020 人瀏覽過

函數

幾個重點:

                a).且能為javascript中的一等公民 (重要性)
                b).函數為物件
                c).函數定義了一個獨立的變數作用域

定義方式

a)命名函數:

          除非在另一個函數內部定義,否則,命名函數是全域的。 

      // 全局的命名函数
  function add(x, y) {
    return x + y;
  }
  console.info(add(100, 200));  //300

登入後複製

b)匿名函數:   

            匿名函數通常賦值於一個變量,然後透過變量調用。

    var func = function (x, y) {
      return x + y;
    }
    console.info(func(5, 2)); //7
登入後複製

            匿名函數適用於下列此「立即執行的匿名函數」 的情況:

    console.info(
      function (x, y) {
            return x + y;
          }(100, 200)  //立即调用
        );
登入後複製

C)定義方式影響程式碼執行效果

                命名函數可先使用,且定義為

    console.info(sum(10, 10));
    function sum(num1, num2) {
      return num1 + num2;
    }
登入後複製

              匿名函數必須先定義,且使用

    //console.info(sumFunc(10, 10));  //Uncaught TypeError: Property 'sumFunc' of object [object Object] is not a function 
    var sumFunc = function (num1, num2) {
      return num1 + num2;
    };
    console.info(sumFunc(10, 10));


登入後複製

函數傳回值:

                 以return 產生回傳值.如沒有return ,則函數傳回undefined

 function func() {
 }
 console.info(func()); //undefined
 function func2() {
   return; //空的返回语句
 }
 console.info(func2()); //undefined

登入後複製

return裡藏著的坑:

 var func = function (x, y) {
   var sum = x + y;
   return {
     value : sum
   }
 }

登入後複製

                   如此沒有問題:   呼叫 func(5,5)    返回的是 Object {value: 10}

                  則的: 

  var func = function (x, y) {
    var sum = x + y;
    return
    {
      value: sum
    };
  }
  console.info(func(5,5)); //undefined

登入後複製

                   return 後面跟著個回車換行的話,
                   以 func(5,5)    所顯示的為 undefined
                   的編輯器幫我們在return後加了個分號;   然而在這情況下並沒有任何卵用。

函數即物件:

  function add(x, y) {
    return x + y;
  }
  console.info(add(100, 200)); //300
  var other = add; //other和add引用同一函数对象
  console.info(other(300, 400)); //700
  console.info(typeof other);  //function
  console.info(add === other); //true

登入後複製

巢狀定義的函數:

                 且以函數內定義為另一個函數。

  function outerFunc(a, b) {
    function innerFunc(x) {
      return x * x;
    }
    return Math.sqrt(innerFunc(a) + innerFunc(b));
  }
  console.info(outerFunc(3, 4)); //5

登入後複製

存取外部變數:

             內外部函數可存取外在的變數與參數。

 var globalStr = 'globalStr';
 function outerFunc2(argu) {
   var localVar = 100;
   function innerFunc2() {
     localVar++;
     console.info(argu + ":" + localVar + ":" + globalStr);
   }
   innerFunc2(); //hello:101:globalStr
 }
 outerFunc2("hello");

登入後複製

傳回函數的函數:

               因為函數為物件,則可作為傳回值。

  function outerFunc(x) {
    var y = 100;
    return function innerFunc() {
      console.info(x + y);
    }
  }
  outerFunc(10)(); //110
登入後複製

以上所述就是本文的全部內容了,希望大家能夠喜歡。

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板