摘要：學(xué)習(xí)筆記函數(shù)擴(kuò)展函數(shù)參數(shù)的默認(rèn)值如果參數(shù)默認(rèn)值是變量，那么參數(shù)就不是傳值的，而是每次都重新計算默認(rèn)值表達(dá)式的值。屬性函數(shù)的屬性，返回該函數(shù)的函數(shù)名。箭頭函數(shù)詳細(xì)鏈接參考引用函數(shù)擴(kuò)展

function Point(x = 0, y = 0) {
    this.x = x;
    this.y = y;
}

var p = new Point();
console.log(p) // { x: 0, y: 0 }

如果參數(shù)默認(rèn)值是變量，那么參數(shù)就不是傳值的，而是每次都重新計算默認(rèn)值表達(dá)式的值。也就是說，參數(shù)默認(rèn)值是惰性求值的。

let x = 99;
function foo(p = x + 1) {
    console.log(p);
}

foo() // 100

x = 100;
foo() // 101

function foo({x, y = 5}) {
    console.log(x, y);
}

foo({}) // undefined, 5,觸發(fā)默認(rèn)值
foo({x: 1}) // 1, 5 ,觸發(fā)默認(rèn)值
foo({x: 1, y: 2}) // 1, 2
//因為參數(shù)是一個對象,對象之后才會解析x y參數(shù)
foo() // TypeError: Cannot read property "x" of undefined

//雙重默認(rèn)值,第一重是對象默認(rèn)值,第二重是對象里面的屬性的默認(rèn)值
function fetch(url, { method = "GET" } = {}) {
    console.log(method);
}
//當(dāng)觸發(fā)兩重的默認(rèn)值的時候,會使用最里面的默認(rèn)值
fetch("http://example.com")
// "GET"

function foo(x = 5, y = 6) {
    console.log(x, y);
}

//undefiend會觸發(fā)默認(rèn)值,null則不會
foo(undefined, null)
// 5 null

指定了默認(rèn)值以后，函數(shù)的length屬性，將返回沒有指定默認(rèn)值的參數(shù)個數(shù)。也就是說，指定了默認(rèn)值后，length屬性將失真。

console.log((function (a) {}).length) // 1
console.log((function (a = 5) {}).length) // 0
console.log((function (a, b, c = 5) {}).length) // 2

一旦設(shè)置了參數(shù)的默認(rèn)值，函數(shù)進(jìn)行聲明初始化時，參數(shù)會形成一個多帶帶的作用域（context）。等到初始化結(jié)束，這個作用域就會消失。這種語法行為，在不設(shè)置參數(shù)默認(rèn)值時，是不會出現(xiàn)的。

var x = 1;
//即使x=1,但是沒有影響里面的值
function f(x, y = x) {
    console.log(y);
}

f(2) // 2
//---------------------------

let x = 1;
//同理,不過這里是函數(shù)里面設(shè)置了x值來測試
function f(y = x) {
    let x = 2;
    console.log(y);
}

f() // 1

如果參數(shù)的默認(rèn)值是一個函數(shù)，該函數(shù)的作用域也遵守這個規(guī)則

let foo = "outer";
//設(shè)置了一個默認(rèn)值func,是一個匿名函數(shù),匿名函數(shù)返回的是foo變量
//這個變量指向的是外部的foo,因為默認(rèn)值形成的多帶帶作用域沒有foo,所以會向上層繼續(xù)找
function bar(func = x => foo) {
    let foo = "inner";
    console.log(func()); // outer
}
//觸發(fā)默認(rèn)值,所以輸出
bar();

var x = 1;
//y的默認(rèn)值是一個匿名函數(shù),并且里面設(shè)置了x=2,
//這個x是指向參數(shù)里的x,他們屬于同一個多帶帶的作用域(默認(rèn)值生成的)
function foo(x, y = function() { x = 2; }) {
    var x = 3;
    y();//執(zhí)行y后并沒有改變內(nèi)部函數(shù)的x
    console.log(x);//所以輸出3
}

foo() // 3
console.log(x) // 1,x沒有變化,所以是1

參數(shù)的默認(rèn)值不是在定義時執(zhí)行，而是在運行時執(zhí)行（即如果參數(shù)已經(jīng)賦值，默認(rèn)值中的函數(shù)就不會運行）

//參數(shù)默認(rèn)值設(shè)為undefined，表明這個參數(shù)是可以省略的。
function foo(optional = undefined) { ··· }

ES6 引入 rest 參數(shù)（形式為“...變量名”），用于獲取函數(shù)的多余參數(shù)，這樣就不需要使用arguments對象了。rest 參數(shù)搭配的變量是一個數(shù)組，該變量將多余的參數(shù)放入數(shù)組中。

function add(...values) {
    let sum = 0;

    for (var val of values) {
        sum += val;
    }

    return sum;
}
//自動獲取了其他參數(shù)
console.log(add(2, 5, 3)) // 10

// arguments變量的寫法
function sortNumbers() {
  return Array.prototype.slice.call(arguments).sort();
}

// rest參數(shù)的寫法
const sortNumbers = (...numbers) => numbers.sort();

function push(array, ...items) {//...的是數(shù)組
  items.forEach(function(item) {//支持?jǐn)?shù)組的方法forEach
    array.push(item);
    console.log(item);
  });
}

var a = [];
push(a, 1, 2, 3)

擴(kuò)展運算符（spread）是三個點（...）。它好比 rest 參數(shù)的逆運算，將一個數(shù)組轉(zhuǎn)為用逗號分隔的參數(shù)序列。(輸出結(jié)果并沒有使用逗號分隔)

console.log(...[1, 2, 3])
// 1 2 3

console.log(1, ...[2, 3, 4], 5)
// 1 2 3 4 5

由于擴(kuò)展運算符可以展開數(shù)組，所以不再需要apply方法，將數(shù)組轉(zhuǎn)為函數(shù)的參數(shù)了。

// ES5的寫法
function f(x, y, z) {
  // ...
}
var args = [0, 1, 2];
f.apply(null, args);

// ES6的寫法
function f(x, y, z) {
  // ...
}
var args = [0, 1, 2];
f(...args);

// ES5的寫法
Math.max.apply(null, [14, 3, 77])

// ES6的寫法
Math.max(...[14, 3, 77])

// 等同于
Math.max(14, 3, 77);

（1）合并數(shù)組

var arr1 = ["a", "b"];
var arr2 = ["c"];
var arr3 = ["d", "e"];

// ES5的合并數(shù)組
console.log(arr1.concat(arr2, arr3));
// [ "a", "b", "c", "d", "e" ]

// ES6的合并數(shù)組
console.log([...arr1, ...arr2, ...arr3])
// [ "a", "b", "c", "d", "e" ]

（2）與解構(gòu)賦值結(jié)合

const [first, ...rest] = [1, 2, 3, 4, 5];
//位置是對應(yīng)的
console.log(first) // 1
console.log(rest)  // [2, 3, 4, 5]

const [first, ...rest] = [];
//當(dāng)沒有參數(shù)的時候,rest參數(shù)能夠獲取空數(shù)組
console.log(first) // undefined
console.log(rest)  // []:

const [first, ...rest] = ["foo"];
//有參數(shù)的時候,按順序
console.log(first)  // "foo"
console.log(rest)   // []

（3）函數(shù)的返回值
直接返回多個值

var dateFields = [1,2,3,4,5];
var d = test(...dateFields);
function test(x,y,z,a,b) {
    console.log(x);
    console.log(y);
    console.log(z);
    console.log(a);
    console.log(b);
}
d;

（4）字符串
將字符串轉(zhuǎn)為數(shù)組

[..."hello"]
// [ "h", "e", "l", "l", "o" ]

（5）實現(xiàn)了Iterator接口的對象
任何Iterator接口的對象，都可以用擴(kuò)展運算符轉(zhuǎn)為真正的數(shù)組。

在ES6中，有三類數(shù)據(jù)結(jié)構(gòu)原生具備Iterator接口：數(shù)組、某些類似數(shù)組的對象、Set和Map結(jié)構(gòu),但是其他數(shù)據(jù)結(jié)構(gòu)并沒有(主要是對象),需要自己手動設(shè)置

（6）Map和Set結(jié)構(gòu)，Generator函數(shù)
擴(kuò)展運算符內(nèi)部調(diào)用的是數(shù)據(jù)結(jié)構(gòu)的Iterator接口，因此只要具有Iterator接口的對象，都可以使用擴(kuò)展運算符，比如Map結(jié)構(gòu)。

ECMAScript 2016標(biāo)準(zhǔn)》做了一點修改，規(guī)定只要函數(shù)參數(shù)使用了默認(rèn)值、解構(gòu)賦值、或者擴(kuò)展運算符，那么函數(shù)內(nèi)部就不能顯式設(shè)定為嚴(yán)格模式，否則會報錯。

函數(shù)的name屬性，返回該函數(shù)的函數(shù)名。

詳細(xì)鏈接

參考引用:

es6函數(shù)擴(kuò)展