1. 程式人生 > 其它 >ES6學習筆記 —— 函式

ES6學習筆記 —— 函式

一、預設引數

  1. 使用函式預設引數時,不允許有同名引數。
  2. 函式引數尾逗號:允許函式最後一個引數有尾逗號。
  3. 定義了預設值的引數,應該是函式的尾引數,只有在未傳遞引數,或者引數為 undefined 時,才會使用預設引數,null 值被認為是有效的值傳遞。
  4. 引數預設值不是傳值的,而是每次都重新計算預設值表示式的值。也就是說,引數預設值是惰性求值的。
  5. 引數變數是預設宣告的,所以不能用letconst再次宣告。
// 報錯,不允許有同名引數
function fn(x,x,y=17){
 console.log(y);
}

//非尾部的引數設定預設值,這個引數是沒法省略的
function f(x = 1, y) { return [x, y]; } f() // [1, undefined] f(2) // [2, undefined] f(, 1) // 報錯

// null不觸發預設值 function fn(x,y=17){ console.log(x,y); } fn(1,null) //1 null //不能用let或const再次宣告 function foo(x = 5) { let x = 1; // error const x = 2; // error }

 

二、rest引數

  1. rest 引數搭配的變數是一個數組,該變數將多餘的引數放入陣列中。
  2. rest引數只能放在引數組的最後,並且有且只有一個不定引數。
  3. 函式的length屬性,不包括 rest 引數。
//rest 引數搭配的變數是一個數組
fn(...values){
	console.log(values)
}

this.fn(1,2)         //[1,2]   
this.fn(1,2,3,4)    //[1,2,3,4]

// 報錯,rest數只能放在引數組的最後
fn(a, ...b, c) {
  // ...
}

//函式的length屬性,不包括 rest 引數
(function(a) {}).length  // 1
(function(...a) {}).length  // 0
(function(a, ...b) {}).length  // 1

 

三、箭頭函式

  1. 箭頭函式和普通函式的樣式不同,箭頭函式語法更加簡潔、清晰,箭頭函式是 =>定義函式,普通函式是 function定義函式
  2. 箭頭函式不需要引數或需要多個引數,就使用一個圓括號代表引數部分。
  3. 箭頭函式的程式碼塊部分多於一條語句,就要使用大括號將它們括起來,並且使用return語句返回。
  4. 箭頭函式要返回物件的時候,為了區分於程式碼塊,要用 () 將物件包裹起來
  5. 箭頭函式其實是沒有 this 的,箭頭函式中的 this 只取決包裹箭頭函式的第一個普通函式的 this。
  6. 箭頭函式體中的 this 物件,是定義函式時的物件,而不是使用函式時的物件。
  7. 不可以當作建構函式,也就是說,不可以對箭頭函式使用new
    命令,否則會丟擲一個錯誤。
  8. 不可以使用arguments物件,該物件在函式體內不存在。如果要用,可以用 rest 引數代替。
  9. 不可以使用yield命令,因此箭頭函式不能用作 Generator 函式。
//1.箭頭函式
var f = v => v;

//2.箭頭函式不需要引數或需要多個引數
var f = () => 5;
var f = (a,b) => a+b;

//3.箭頭函式的程式碼塊部分多於一條語句
var sum = (num1, num2) => { return num1 + num2; }

//4.返回一個物件
let getTempItem = id => ({ id: id, name: "Temp" });

//箭頭函式只有一行語句,且不需要返回值
let fn = () => void doesNotReturn();

//6.箭頭函式體中的 this 物件,是定義函式時的物件,而不是使用函式時的物件。
function fn(){
  setTimeout(()=>{
    // 定義時,this 繫結的是 fn 中的 this 物件
    console.log(this.a);
  },0)
}
var a = 20;
// fn 的 this 物件為 {a: 18}
fn.call({a: 18});  // 18

 

 學習網站地址:http://caibaojian.com/es6/destructuring.html