珠峰架构-函数

知识点：

高阶函数，解决异步问题、发布订阅模式和观察者模式、promise核心应用，promise解决异步问题、实现一个完成的promise库、promise中常见的面试题、扩展promise中常见的方法、掌握 generator的使用以及co库的应用、异步方案 async+await

高阶函数

AOP 面向切片编程

// 高阶函数 函数参数如果是函数，或者这个函数返回一个新的函数，我们就叫它高阶函数

// AOP 面向切片编程
// before函数

function say(who) {
  console.log(who + ' hello')
}

Function.prototype.before = function (beforeFn) {
  return (...args) => {
    beforeFn();
    this(...args);
  }
}

Function.prototype.after = function (afterFn) {
  return (...args) => {
    this(...args);
    afterFn();
  }
}

let beforeSay = say.before(() => {
  console.log('开始说话')
})

let afterSay = beforeSay.after(() => {
  console.log('结束说话')
})


afterSay('laibh.top');
/**
开始说话
laibh.top hello
结束说话
*/

React事务简单模拟

class Transaction {
  perform(anyMethod, wrappers) {
    wrappers.forEach(wrapper => wrapper.initialize())
    anyMethod();
    wrappers.forEach(wrapper => wrapper.close())
  }
}

let transaction = new Transaction()

let oldFunc = () => {
  console.log('原有的逻辑')
}

transaction.perform(oldFunc, [
  { // wrapper1
    initialize() {
      console.log('初始化1')
    },
    close() {
      console.log('关闭1')
    }
  },
  { // wrapper2
    initialize() {
      console.log('初始化2')
    },
    close() {
      console.log('关闭2')
    }
  }
])
/**
初始化1
初始化2
原有的逻辑
关闭1
关闭2
*/

判断类型

// 判断数据类型

// typeof instaceof constructor Object.prototype.toString.call

function isType(type) {
  return (args) => Object.prototype.toString.call(args) === `[object ${type}]`
}
const types = ['String', 'Boolean', 'Number', 'Null', 'Undefined', 'Symbol', 'Object']

const utils = {}

for (let i = 0; i < types.length; i++) {
  let type = types[i]
  utils[`is${type}`] = isType(type)
}

console.log(utils.isSymbol(Symbol()))

异步并发 lodash after

// lodash after 在执行多少次之后
// 做异步的并发处理

function after(times, callback) {
  return () => {
    if (--times == 0) {
      callback();
    }
  }
}

let fn = after(3, () => {
  console.log('执行三次后才执行')
})

fn()
fn()
fn()

// node 方法异步的 I/O

let fs = require('fs')

const after = (times, callback) => {
  let website = {}
  return (key, value) => {
    website[key] = value
    if (--times === 0) {
      callback(website)
    }
  }

}
const out = after(2, (website) => {
  console.log(website)
})

fs.readFile('./name.txt', 'utf8', (err, data) => {
  out('name', data)
});

fs.readFile('./age.txt', 'utf8', (err, data) => {
  out('age', data)
});

发布订阅模式和观察者模式

发布订阅解决异步

// node 方法异步的 I/O

let fs = require('fs')

// 希望两次都完成后，分别打印最终结果，再打印一次已经处理完毕的

// 发布emit 订阅 on 一种一对多的关系 [fn,fn,fn]
class Events {
  constructor() {
    this.stack = []
  }
  on(callback) {
    this.stack.push(callback)
  }
  emit() {
    this.stack.forEach(callback => callback())
  }
}


let events = new Events();
let website = {};
events.on(() => {
  if (Object.keys(website).length === 2) {
    console.log(website)
  }
  console.log('当前获取完毕')
})


fs.readFile('./name.txt', 'utf8', (err, data) => {
  website.name = data
  events.emit();
});

fs.readFile('./age.txt', 'utf8', (err, data) => {
  website.age = data
  events.emit();
});

观察者模式简单模拟

// 观察者模式
class Subject { // 被观察者
  constructor() {
    this.stack = [];
    this.state = 'happy'
  }
  attach(observer) {
    this.stack.push(observer)
  }
  setState(newState) {
    this.state = newState
    this.stack.forEach(p => p.update(newState))
  }
}

class Observer { // 观察者
  constructor(name) {
    this.name = name
  }
  update(newState) {
    console.log(`${this.name},小宝宝${newState}`)
  }
}

let p1 = new Observer('爸爸')
let p2 = new Observer('妈妈')

let c = new Subject('小宝宝')
c.attach(p1)
c.attach(p2)
c.setState('unhappy')

Promise