/**
 * 為異步函數(shù)添加自動(dòng)超時(shí)功能
 * @param timeout 超時(shí)時(shí)間
 * @param action 異步函數(shù)
 * @returns 包裝后的異步函數(shù)
 */
function asyncTimeout(timeout, action) {
 return function(...args) {
 return Promise.race([
  Reflect.apply(action, this, args),
  wait(timeout).then(Promise.reject),
 ])
 }
}

const get = async i => i
get._name = 'get'

/**
 * 為異步函數(shù)添加自動(dòng)超時(shí)功能
 * @param timeout 超時(shí)時(shí)間
 * @param action 異步函數(shù)
 * @returns 包裝后的異步函數(shù)
 */
function asyncTimeout(timeout, action) {
 return new Proxy(action, {
 apply(_, _this, args) {
  return Promise.race([
  Reflect.apply(_, _this, args),
  wait(timeout).then(Promise.reject),
  ])
 },
 })
}

;(async () => {
 console.log(await get(1))
 console.log(get._name)
})()

async function list() {
 // 此處僅為構(gòu)造列表
 class Person {
 constructor({ id, name, age, sex, address } = {}) {
  this.id = id
  this.name = name
  this.age = age
  this.sex = sex
  this.address = address
 }
 }
 return [
 new Person({ id: 1, name: '琉璃' }),
 new Person({ id: 2, age: 17 }),
 new Person({ id: 3, sex: false }),
 new Person({ id: 4, address: '幻想鄉(xiāng)' }),
 ]
}

;(async () => {
 // 為所有為賦值屬性都賦予默認(rèn)值 ''
 const persons = (await list()).map(
 ({ id = '', name = '', age = '', sex = '', address = '' }) => ({
  id,
  name,
  age,
  sex,
  address,
 }),
 )
 console.log(persons)
})()

function warp(obj) {
 const result = obj
 for (const k of Reflect.ownKeys(obj)) {
 const v = Reflect.get(obj, k)
 result[k] = v === undefined ? '' : v
 }
 return obj
}
;(async () => {
 // 為所有為賦值屬性都賦予默認(rèn)值 ''
 const persons = (await list()).map(warp)
 console.log(persons)
})()

function warp(obj) {
 const result = new Proxy(obj, {
 get(_, k) {
  const v = Reflect.get(_, k)
  if (v !== undefined) {
  return v
  }
  return ''
 },
 })
 return result
}

/**
 * 系統(tǒng)菜單
 */
class SysMenu {
 /**
 * 構(gòu)造函數(shù)
 * @param {Number} id 菜單 id
 * @param {String} name 顯示的名稱
 * @param {Number} parent 父級(jí)菜單 id
 */
 constructor(id, name, parent) {
 this.id = id
 this.name = name
 this.parent = parent
 }
}
/**
 * 系統(tǒng)權(quán)限
 */
class SysPermission {
 /**
 * 構(gòu)造函數(shù)
 * @param {String} uid 系統(tǒng)唯一 uuid
 * @param {String} label 顯示的菜單名
 * @param {String} parentId 父級(jí)權(quán)限 uid
 */
 constructor(uid, label, parentId) {
 this.uid = uid
 this.label = label
 this.parentId = parentId
 }
}

const sysMenuProxy = { parentId: 'parent' }
const sysMenu = new Proxy(new SysMenu(1, 'rx', 0), {
 get(_, k) {
 if (Reflect.has(sysMenuProxy, k)) {
  return Reflect.get(_, Reflect.get(sysMenuProxy, k))
 }
 return Reflect.get(_, k)
 },
})
console.log(sysMenu.id, sysMenu.name, sysMenu.parentId) // 1 'rx' 0

const sysPermissionProxy = { id: 'uid', name: 'label' }
const sysPermission = new Proxy(new SysPermission(1, 'rx', 0), {
 get(_, k) {
 if (Reflect.has(sysPermissionProxy, k)) {
  return Reflect.get(_, Reflect.get(sysPermissionProxy, k))
 }
 return Reflect.get(_, k)
 },
})
console.log(sysPermission.id, sysPermission.name, sysPermission.parentId) // 1 'rx' 0

/**
 * 橋接對(duì)象不存在的字段
 * @param {Object} map 代理的字段映射 Map
 * @returns {Function} 轉(zhuǎn)換一個(gè)對(duì)象為代理對(duì)象
 */
function bridge(map) {
 /**
 * 為對(duì)象添加代理的函數(shù)
 * @param {Object} obj 任何對(duì)象
 * @returns {Proxy} 代理后的對(duì)象
 */
 return function(obj) {
 return new Proxy(obj, {
  get(target, k) {
  // 如果遇到被代理的屬性則返回真實(shí)的屬性
  if (Reflect.has(map, k)) {
   return Reflect.get(target, Reflect.get(map, k))
  }
  return Reflect.get(target, k)
  },
  set(target, k, v) {
  // 如果遇到被代理的屬性則設(shè)置真實(shí)的屬性
  if (Reflect.has(map, k)) {
   Reflect.set(target, Reflect.get(map, k), v)
   return true
  }
  Reflect.set(target, k, v)
  return true
  },
 })
 }
}

const sysMenu = bridge({
 parentId: 'parent',
})(new SysMenu(1, 'rx', 0))
console.log(sysMenu.id, sysMenu.name, sysMenu.parentId) // 1 'rx' 0

const sysPermission = bridge({
 id: 'uid',
 name: 'label',
})(new SysPermission(1, 'rx', 0))
console.log(sysPermission.id, sysPermission.name, sysPermission.parentId) // 1 'rx' 0

// 模擬頁(yè)面的復(fù)選框列表
const hobbyMap = new Map()
 .set(1, '小說(shuō)')
 .set(2, '動(dòng)畫(huà)')
 .set(3, '電影')
 .set(4, '游戲')
const user = {
 id: 1,
 // 保存興趣 id 的列表
 hobbySet: new Set(),
 // 發(fā)送到后臺(tái)的興趣 id 拼接后的字符串，以都好進(jìn)行分割
 hobby: '',
}
function onClick(id) {
 user.hobbySet.has(id) ? user.hobbySet.delete(id) : user.hobbySet.add(id)
}

// 模擬兩次點(diǎn)擊
onClick(1)
onClick(2)

console.log(user.hobby) // ''

/**
 * 深度監(jiān)聽(tīng)指定對(duì)象屬性的變化
 * 注：指定對(duì)象不能是原始類型，即不可變類型，而且對(duì)象本身的引用不能改變，最好使用 const 進(jìn)行聲明
 * @param object 需要監(jiān)視的對(duì)象
 * @param callback 當(dāng)代理對(duì)象發(fā)生改變時(shí)的回調(diào)函數(shù)，回調(diào)函數(shù)有三個(gè)參數(shù)，分別是對(duì)象，修改的 key，修改的 v
 * @returns 返回源對(duì)象的一個(gè)代理
 */
function watchObject(object, callback) {
 const handler = {
 get(_, k) {
  try {
  // 注意: 這里很關(guān)鍵，它為對(duì)象的字段也添加了代理
  return new Proxy(v, Reflect.get(_, k))
  } catch (err) {
  return Reflect.get(_, k)
  }
 },
 set(_, k, v) {
  callback(_, k, v)
  return Reflect.set(_, k, v)
 },
 }
 return new Proxy(object, handler)
}

// 模擬頁(yè)面的復(fù)選框列表
const hobbyMap = new Map()
 .set(1, '小說(shuō)')
 .set(2, '動(dòng)畫(huà)')
 .set(3, '電影')
 .set(4, '游戲')
const user = {
 id: 1,
 // 保存興趣 id 的列表
 hobbySet: new Set(),
 // 發(fā)送到后臺(tái)的興趣 id 拼接后的字符串，以都好進(jìn)行分割
 hobby: '',
}

const proxy = watchObject(user, (_, k, v) => {
 if (k === 'hobbySet') {
 _.hobby = [..._.hobbySet].join(',')
 }
})
function onClick(id) {
 proxy.hobbySet = proxy.hobbySet.has(id)
 ? proxy.hobbySet.delete(id)
 : proxy.hobbySet.add(id)
}
// 模擬兩次點(diǎn)擊
onClick(1)
onClick(2)

// 現(xiàn)在，user.hobby 的值將會(huì)自動(dòng)更新
console.log(user.hobby) // 1,2

const proxy = new Proxy(new Set([]), {})
proxy.add(1) // Method Set.prototype.add called on incompatible receiver [object Object]

const proxy = new Proxy(new Set([]), {
 get(_, k) {
 const v = Reflect.get(_, k)
 // 遇到 Function 都手動(dòng)綁定一下 this
 if (v instanceof Function) {
  return v.bind(_)
 }
 return v
 },
})
proxy.add(1)