天天看點

徒手寫一個es6代碼庫

mkdir demo
cd demo
npm init
npm install -g babel
npm install -g babel-cli
npm install --save-dev babel-preset-es2015-node5           

複制

在項目目錄建立兩個檔案夾 functional-playground 和lib

mkdir functional-playground
mkdir lib           

複制

在lib目錄下建立檔案 es6-functional.js

const forEach = (array, fn) => {
  let i;
  for (i = 0; i < array.length; i++)
    fn(array[i])
}

export default forEach           

複制

在functional-playground目錄下建立檔案play.js

import forEach from '../lib/es6-functional'

var array = [1, 2, 3]
forEach(array, (data) => console.log(data))           

複制

執行指令

babel-node functional-playground/play.js --presets es2015-node5           

複制

執行結果如下

徒手寫一個es6代碼庫

也可以将上述腳本寫到package.json中

徒手寫一個es6代碼庫

執行 npm run playground 指令可以檢視到一樣的結果

在es6-functional.js中定義更多的抽象函數

const forEach = (array, fn) => {
  let i;
  for (i = 0; i < array.length; i++)
    fn(array[i])
}

const forEachObject = (obj, fn) => {
  for (var property in obj) {
    if (obj.hasOwnProperty(property)) {
      fn(property, obj[property])
    }
  }
}

const unless = (predicate, fn) => {
  if (!predicate)
    fn()
}

export {
  forEach,
  forEachObject,
  unless
}           

複制

在 play.js 調用

import {
  forEach,
  forEachObject,
  unless
} from '../lib/es6-functional'

var array = [1, 2, 3]
forEach(array, (data) => console.log(data))

let object = {
  a: 1,
  b: 2
}
forEachObject(object, (k, v) => console.log(k + ":" + v))

forEach([1, 2, 3, 4, 5, 6, 7], (number) => {
  unless((number % 2), () => {
    console.log(number, " is even")
  })
})           

複制

執行 npm run playground 指令 檢視結果