ES Function

檢查本地Node版本對(duì)ES6支持情況:

npm -g install es-checker
es-checker

執(zhí)行結(jié)果如下圖:
node 6.10.0支持率為90%


安裝bable

npm --save-dev install babel-cli
npm --g install babel-cli

至于--save-dev --g同時(shí)使用,搜了如下:


安裝完babel-cli之后,直接執(zhí)行如下即可

babel-node filename

<br />
<br />

ES6中函數(shù)的拓展

支持如下設(shè)置默認(rèn)值

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

<br />

解構(gòu)賦值

function m1({x = 0, y = 0} = {}) {
  return [x, y];
}

function m2({x, y} = { x: 0, y: 0 }) {
  return [x, y];
}

// 綜述,{}={},右邊的值會(huì)被函數(shù)傳入值所替代

m1() // [0, 0]
m2() // [0, 0]
m1({x: 3, y: 8}) // [3, 8]
m2({x: 3, y: 8}) // [3, 8]
m1({x: 3}) // [3, 0]
m2({x: 3}) // [3, undefined]
m1({}) // [0, 0];
m2({}) // [undefined, undefined]
m1({z: 3}) // [0, 0]
m2({z: 3}) // [undefined, undefined]

<br />

傳入undefine會(huì)被默認(rèn)值覆蓋,null不會(huì)

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

foo2(undefined, null)
// 5 null

<br />

function().length


//  返回有默認(rèn)值參數(shù)之前,未設(shè)默認(rèn)值的參數(shù)個(gè)數(shù)
(function (a) {}).length // 1
(function (a = 5) {}).length // 0
(function (a, b, c = 5) {}).length // 2
(function (a = 0, b, c) {}).length // 0
(function (a, b = 1, c) {}).length // 1

<br />

函數(shù)參數(shù)作用域

let foo4 = 'outer';
function bar(func = x => foo4) {    //  這里的foo指向外層的foo(outer)
  let foo4 = 'inner';
  console.log(func()); // outer
}
bar();

var x3 = 1;
function foo3(x, y = function() { x3 = 2; }) {
  var x3 = 3;
  y();
  console.log(x);
}
foo3()  // 3
x       // 1

<br />

rest參數(shù)

//  rest參數(shù)(...values),代替arguments對(duì)象
//  function().length不會(huì)算入rest參數(shù)
//  講一串都好分隔的變量,轉(zhuǎn)換成數(shù)組
function add(...values) {
  let sum = 0;

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

  return sum;
}

add(2, 5, 3) // 10

<br />

...拓展運(yùn)算符

//拓展運(yùn)算符,rest逆運(yùn)算,把數(shù)組展開成都好分隔的變量
console.log(...[1, 2, 3])
// 1 2 3

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

//合并數(shù)組
var arr1 = ['a', 'b'];
var arr2 = ['c'];
var arr3 = ['d', 'e'];

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

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

//  拆分?jǐn)?shù)組
const [first, ...rest] = [1, 2, 3, 4, 5];
var item1 = first // 1
var item2 = rest  // [2, 3, 4, 5]

//實(shí)現(xiàn)了Iterator接口的對(duì)象
//var nodeList = document.querySelectorAll('div');
//var array = [...nodeList];


//沒有部署Iterator接口的類似數(shù)組的對(duì)象
let arrayLike = {
  '0': 'a',
  '1': 'b',
  '2': 'c',
  length: 3
};

// TypeError: Cannot spread non-iterable object.
//  let arr = [...arrayLike];

<br />
####檢測(cè)Node版本對(duì)es6的支持情況:

> npm -g install es-checker
> es-checker
> 
![
![GSJS3B45$W)M@GL9QJ(2J0T.png](http://upload-images.jianshu.io/upload_images/1759843-a897b920036fe454.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
](http://upload-images.jianshu.io/upload_images/1759843-0442d81b2a6809a8.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)





let map = new Map([
  [1, 'one'],
  [2, 'two'],
  [3, 'three'],
]);

<br />

箭頭函數(shù),不贅述

箭頭函數(shù)有幾個(gè)使用注意點(diǎn)。

  • 函數(shù)體內(nèi)的this對(duì)象,就是定義時(shí)所在的對(duì)象,而不是使用時(shí)所在的對(duì)象。
  • 不可以當(dāng)作構(gòu)造函數(shù),也就是說,不可以使用new命令,否則會(huì)拋出一個(gè)錯(cuò)誤。
  • 不可以使用arguments對(duì)象,該對(duì)象在函數(shù)體內(nèi)不存在。如果要用,可以用Rest參數(shù)代替。
  • 不可以使用yield命令,因此箭頭函數(shù)不能用作Generator函數(shù)。

<br />

尾遞歸優(yōu)化另外總結(jié)

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 前言 webpack2和vue2已經(jīng)不是新鮮東西了,滿大街的文章在講解webpack和vue,但是很多內(nèi)容寫的不是...
    技術(shù)宅小青年閱讀 6,679評(píng)論 4 43
  • 阮一峰的博客 http://es6.ruanyifeng.com/ 一 ES6簡(jiǎn)介 ECMAScript 6.0(...
    ai搞搞閱讀 1,835評(píng)論 0 0
  • 開發(fā)過程中遇到的一些奇妙的事情:(基礎(chǔ)知識(shí),碰到了忘了又百度了又怕忘了就記下來了)注:此篇文章是我參考阮一峰老師的...
    HW_____T閱讀 298評(píng)論 0 0
  • 函數(shù)參數(shù)的默認(rèn)值 基本用法 在ES6之前,不能直接為函數(shù)的參數(shù)指定默認(rèn)值,只能采用變通的方法。 上面代碼檢查函數(shù)l...
    呼呼哥閱讀 3,703評(píng)論 0 1
  • 地鐵眾生相 (1) 有天晚班后,很是疲憊,站立在,渾身上下難受,想盡快到家。九十點(diǎn)鐘的地鐵站人已經(jīng)不多了。 不知什...
    半月散人閱讀 230評(píng)論 1 1

友情鏈接更多精彩內(nèi)容