一，函式的定義和使用

1) 函式宣告方式
function add(num1,num2){
      return num1+num2;
  }

function add(num1,num2){
	return num1+num2;
  }
console.log(add(3, 5));

2) var + 函式表示式宣告方式
 var add= function(num1,num2){
                  return num1+num2;
  };　

var add= function(num1,num2){
	                  return num1+num2;
	  };　
console.log(add(3, 5));

3) const + 函式表示式宣告方式，使用的較少
 const add= function(num1,num2){
                  return num1+num2;
  };　

4) 使用Function建構函式的方式
var add = new Function('num1','num2','return num1+num2');
不推薦使用,  主要用於面向物件時理解"函式就是物件,  函式名就是指標"這一概念

var fun = new Function("console.log('大家好, 我是函式!');");
fun();

5) 使用箭頭函式建構函式

var funcName = (num1,num2) => num1 + num2
console.log(funcName(3,5));

 

二，函式的引數

• 1，實參個數可以大於或者等於形參個數，不能小於形參個數
• 2，所有函式都內建了一個arguments物件，arguments物件中儲存了傳遞的所有的實參。arguments是一個偽陣列，因此及可以進行遍歷

  • function getSum() {
          var sum = 0;
          for (var i = 0; i < arguments.length; i++) {
            sum += arguments[i];
          }
          return sum;
        }
    
        var sum = getSum(5, 1, 3, 4);
        console.log(sum);
    
    

• 3,函式的引數arguments，typeof列印函式的型別，toString列印整個函式

  • function myFunction(a,b) {
    	console.log(arguments);
    	console.log(arguments['0']);
    	console.log(arguments.length);
    	return a * b;
    }
    console.log(myFunction(46,9));
    console.log(typeof(myFunction));
    console.log(myFunction.toString());
    
    結果：
    [Arguments] { '0': 46, '1': 9 }
    46
    2
    414
    function
    function myFunction(a,b) {
    	console.log(arguments);
    	console.log(arguments['0']);
    	console.log(arguments.length);
    	return a * b;
    }

     

• 4，函式顯式引數(Parameters)與隱式引數(Arguments)
  • 1，顯示引數：類似於形參；隱式引數類似於實參
  • 2，JavaScript 函式定義顯式引數時沒有指定資料型別。
    JavaScript 函式對隱式引數沒有進行型別檢測。
    JavaScript 函式對隱式引數的個數沒有進行檢測。
  • 3，如果函式在呼叫時未提供隱式引數，引數會預設設定為： undefined
  • 4，給顯示引數設定預設值的方法

    • //ES5的方法1：用是否為undefined
      function myFunction1(x, y) {
          if (y === undefined) {
                y = 0;
          } 
      }
      //ES5的方法2：用或運算
      function myFunction2(x, y) {
          y = y || 0;
      }
      
      //ES6的方法:在引數中賦值
      function myFunction3(x, y = 10) {
      	console.log('x='+x);
      	console.log('y='+y);
      	return x + y;
      }
      myFunction3();
      myFunction3(5);
      myFunction3(5,6);
      結果：
      x=undefined
      y=10
      x=5
      y=10
      x=5
      y=6

       

•  

 

三，函式作為引數

JavaScript中的函式也是一種型別, 是引用型別，可以作為引數和返回值

var sayHi = function () {
        console.log("hello world");
    }
    function test(fn) {
        fn();
    }
    test(sayHi);

四，函式作為返回值

function test() {
        var sayHi = function () {
            console.log("hello world");
        }
        return sayHi
    }
    var res = test();
    res();

五，匿名函式

• 1，沒有名稱的函式, 我們稱之為匿名函式
• 2，匿名函式不能單獨出現, 一般作為其他函式引數或者返回值使用

•     // 報錯
      function () {
          console.log("hello world");
      }

• 3，匿名函式的執行

•   // 立即執行函式
      (function () {
          console.log("hello world");
      })();

• 4，匿名函式作為引數

• // 作為函式引數
      function test(fn) {
          fn();
      }
      test(function () {
          console.log("hello world");
      });

• 5，匿名函式作為返回值

• // 作為函式返回值
      function test() {
          return function () {
              console.log("hello world");
          }
      }
      var res = test();
      res();
  
  

•  

六，箭頭函式

• 1,函式的一種簡寫方式，類似於匿名函式
• 2，（）內是引數，一個引數的時候，（）可以省略

  • 箭頭函式的寫法：
    // ES5
    var x = function(x, y) {
         return x * y;
    }
     
    // ES6
    const x = (x, y) => x * y;

     

• 3，=>後是返回值，省略了return
• 4，詞法作用域，不會繫結this；箭頭函式會預設幫我們繫結外層 this 的值，所以在箭頭函式中 this 的值和外層的 this 是一樣的
• 5，使用 const 比使用 var 更安全，因為函式表示式始終是一個常量
• 6，如果函式部分只是一個語句，則可以省略 return 關鍵字和大括號 {}，這樣做是一個比較好的習慣

  • 以下兩者等價
    const x = (x, y) => x * y;
    
    const x = (x, y) => { return x * y };

     

七，回撥函式

回撥函式就是一個引數，將這個函式作為引數傳到另一個函式裡面，當那個函式執行完之後，再執行傳進去的這個函式。這個過程就叫做回撥

function a(callbackFunction){
	console.log("這是parent函式a");
	var m =1;
	var n=3;
  return callbackFunction(m,n);
 }

 function b(m,n){
	console.log("這是回撥函式b");
	return m+n;
 }

var result = a(b);
console.log("result = "+ result);

結果：
這是parent函式a
這是回撥函式b
result = 4

8，函式的提升

1. 提升（Hoisting）是 JavaScript 預設將當前作用域提升到前面去的的行為
2. 就是函式可以在宣告之前呼叫

   1. console.log(myFunction(5));
      
      function myFunction(y) {
      	return y * y;
      }
      
      結果：
      25

       

3. 匿名函式沒有提升，相當於變數的提升，函式的提升優先順序高於變數的提升

   1. getName();
      var getName=function(){
      	console.log(2);
      }
      
      function getName(){
      	console.log(1);
      }
      getName();
      
      結果：
      1
      2

       

9，自調函式

1. 函式自己主動呼叫自己，不用外部呼叫語句
2. 匿名自呼叫函式：(function(){})()

   1. (function () { console.log( "Hello! 我是自己呼叫的" );})();
      
      結果：
      Hello! 我是自己呼叫的

       

3. 匿名箭頭自調函式：(()=>{})()