2-1生成器函數

1.自定義迭代器

function myItrator(arr) {
    let index = 0
    return {
        next: () => {
            if (index < arr.length) {
                return { value: arr[index++], done: false }
            } else {
                return { done: true }
            }
        }
    }
}

const arr=['起床','刷牙','洗臉','吃飯']
let it=myItrator(arr)
 console.log(it.next().value)
 console.log(it.next().value)
 console.log(it.next().value)
 console.log(it.next().value)

2.使用generator 生成器函數

//  generator 生成器
function *myItrator(arr){
    for(let i=0;i<arr.length;i++){
        yield arr[i]  //遍歷元素 用yield關鍵字處理元素
    }
}

const arr=['起床','刷牙','洗臉','吃飯']
let it=myItrator(arr)
 console.log(it.next().value)
 console.log(it.next().value)
 console.log(it.next().value)
 console.log(it.next().value)

下面通過co庫來進一步了解generator 生成器

2-2 co 庫執行 promise 和 generator function

image.png

image.png

2-4 異步函數 asyunc function 統一世界

const fs = require('fs')
// 第一階段 回調函數
function  readFile(cb) {
    fs.readFile('./package.json',(err,data)=>{
        if(err) return cb(err)
        cb(null,data)
    })
}
 
readFile((err,data)=>{
    err||console.log(JSON.parse(data).name)
})

// 第二階段promise 
function readFileAsyc(){
    return new Promise((resolve,reject)=>{
        fs.readFile('./package.json',(err,data)=>{
            if(err) reject(err)
            resolve(JSON.parse(data))
        }) 
    })
}

readFileAsyc().then(data=>{console.log(data.name)})

// 第三階段 co + generator + promisify
const util=require('util')
const co=require('co')
co(function *(){
    let data = yield util.promisify(fs.readFile)('./package.json')
    console.log(JSON.parse(data).name)
})

// 第四節度 Async 統一世界
let _readFile = util.promisify(fs.readFile)

async function init(){
    let data = await _readFile('./package.json')
    console.log(JSON.parse(data).name)
}
init()

2-5 借助 babel 編譯 import 與 export

//先全部加載fs然后 再拿到writeFile
//必須等到代碼運行時加載  運行時加載
const { writeFile } = require('fs')

//所以我們希望能在編譯的時候就能獲取到這個方法 靜態加載  銅鼓import實現

具體步驟如下：
1.npm i babel-cli babel-preset-env -D
2.新建.babelrc文件

{
    "presets":[
        [
            "env":{
                "targets":{
                    "node":"current"
                }
            }
        ]
    ]
}

3.在package.json中新建dev配置

"scripts": {
    "dev":"nodemon -w src --exec \"babel-node src --presets env",
    "test": "echo \"Error: no test specified\" && exit 1"
  },

4.全局安裝 nodemon
npm i nodemon -g

然后就可以用import和export了

image.png

2-6 生產環境使用 babel 支持 es6-7

1.新增build命令
"build":"rimraf dist && babel src -s -D -d dist --presets env",
(其中 rimraf dist 是指每次build的時候清空dist目錄 npm i rimraf -D)
2.新增babel支持es6-7
npm install -S babel-plugin-transform-runtime babel-runtime --registry=https://registry.npm.taobao.org
3.在babelrc中配置

{
    "presets":[
        [
            "env":{
                "targets":{
                    "node":"current"
                }
            }
        ]
    ],
    "plugins":[
        [
            "transform-runtime",{
                "polyfill":false,
                "regenerator":true
            }
        ]
    ]
}