填坑-十萬個爲何？（20）

簡介:不少概念不清或忘記，從新構建本身的知識體系。天天問本身1~多個問題。我是菜鳥 成爲大神之路!

1.認識es6 Generator函數！

generator（生成器）是ES6標準引入的新的數據類型

generator跟函數很像，定義以下：

function* foo(x) {
    yield x + 1;
    yield x + 2;
    return x + 3;
}
複製代碼

generator和函數不一樣的是，generator由function*定義（注意多出的*號），而且，除了return語句，還能夠用yield返回屢次。

function* foo(){
	let a = 1;
	yield a;
	a++;
	yield a;
	a++;
	return a;
}
let f = foo();
console.log(f.next());
console.log(f.next());
console.log(f.next());
複製代碼

參考地址： developer.mozilla.org/en-US/docs/…

2.es7語法糖async/await

async關鍵字提及，它被放置在一個函數前面。就像下面這樣：

async function f() {
    return 1
}
複製代碼

函數前面的async一詞意味着一個簡單的事情：這個函數老是返回一個promise，若是代碼中有return <非promise>語句，JavaScript會自動把返回的這個value值包裝成promise的resolved值。

`代碼①`
async function f() {
    return 1
}
f().then(function(data){console.log(data)});//1

`代碼②`
async function f() {
    return Promise.resolve(1)
}
f().then(function(data){console.log(data)});//1

`代碼①和代碼②執行結果同樣`
複製代碼

關鍵詞await可讓JavaScript進行等待，直到一個promise執行並返回它的結果，JavaScript纔會繼續往下執行。

async function f() {
    let promise = new Promise((resolve, reject) => {
        setTimeout(() => resolve('done!'), 1000)
    })
    let result = await promise // 直到promise返回一個resolve值（*）
    console.log(result) // 'done!' 
}
f()
複製代碼

await字面上使得JavaScript等待，直到promise處理完成， 而後將結果繼續下去。這並不會花費任何的cpu資源，由於引擎可以同時作其餘工做：執行其餘腳本，處理事件等等。

參考文章：
① developer.mozilla.org/en-US/docs/…
② segmentfault.com/a/119000001…