zoukankan      html  css  js  c++  java
  • ES6(十一)Proxy和Reflect

    Proxy
    
    let obj = {
      time: '2019-01-01',
      name: 'ronle'
    }
    let monitor = new Proxy(obj, {
      // 拦截对象属性的读取
      get (target, key) {
        return target[key].replace('2019', '2020')
      },
      // 拦截对象设置属性
      set (target, key, value) {
        // 只有key等于name才修改
        if (key === 'name') {
          return Reflect.set(target, key, value)
        } else {
          return target[key]
        }
      },
      // 拦截 key in object操作
      has (target, key) {
        if (key === 'name') {
          return target[key]
        } else {
          return false
        }
      },
      // 拦截delete
      deleteProperty (target, key) {
        if (key.indexOf('-')) {
          delete target[key]
          return true
        } else {
          return target[key]
        }
      },
      // 拦截Object.keys
      // Object.getOwnPropertySymbols
      // Object.getOwnPropertyNames
      ownKeys (target) {
        return Object.keys(target).filter(item => item !== 'time')
      }
    })
    // 2020-01-01
    console.log('get', monitor.time)
    monitor.time = '2030'
    monitor.name = 'kaka'
    // 只有name被修改  kaka
    console.log('set', monitor, monitor.name)
    
    console.log('has', 'name' in monitor, 'time' in monitor)
    // // 删除掉日期
    // delete monitor.time
    // console.log('delete', monitor)
    
    // 返回不等于key不等于time的元素
    console.log('ownKeys', Object.keys(monitor))
    
    
    Reflect 跟proxy代理类似,方法属性都一样
    
    let obj = {
      time: '2019-01-01',
      name: 'ronle'
    }
    
    console.log(Reflect.get(obj, 'time'))
    Reflect.set(obj, 'name', 'kaka')
    console.log(obj)
    console.log(Reflect.has(obj, 'name'))
  • 相关阅读:
    刷题记录:[ByteCTF 2019]EZCMS
    angularJS——自定义指令
    HTML5——语音输入
    jQuery表单验证插件——jquery.validate.js
    纯CSS气泡效果
    管理Cookie的插件——jquery.cookie.js
    网页打印
    CSS hack
    如何挑选适合的前端框架(去哪儿网前端架构师司徒正美)
    让DIV水平和垂直居中的几种方法
  • 原文地址:https://www.cnblogs.com/ronle/p/11563989.html
Copyright © 2011-2022 走看看