美文网首页
ES6-proxy比较重要的方法(1)

ES6-proxy比较重要的方法(1)

作者: 吴高亮 | 来源:发表于2019-01-09 13:56 被阅读0次

proxy 代理 元编程两个关键字;用于修改某些操作的默认行为;等同于在语言橙层面做出修改;所以属于一种 元编程;及对编程语言进行编程;

Proxy可以理解为。在目标对象之前架设一成拦截,外界对该对象的访问和操作;都要经过这个拦截;因此提供了一种机制;可以对外界的访问进行过滤和改写。Proxy这个词的愿意是代理;用在这里表示它来代理某些操作;

var obj = new Proxy({}, {
  get: function (target, key, receiver) {
    console.log(`getting ${key}!`);
    return Reflect.get(target, key, receiver);
  },
  set: function (target, key, value, receiver) {
    console.log(`setting ${key}!`);
    return Reflect.set(target, key, value, receiver);
  }
});

上面代码对一个空对象架设了一层拦截,重定义了属性的读取(get)和设置(set)行为。这里暂时先不解释具体的语法,只看运行结果。对设置了拦截行为的对象obj,去读写它的属性,就会得到下面的结果。

obj.count = 1
//  setting count!
++obj.count
//  getting count!
//  setting count!
//  2

上面代码说明,Proxy 实际上重载(overload)了点运算符,即用自己的定义覆盖了语言的原始定义。

ES6 原生提供 Proxy 构造函数,用来生成 Proxy 实例。
var proxy=new Proxy(target,handler);
Proxy对象的所有用法。都是上面这种形式;不同的是handler参数的写法;其中,new Proxy()表示生成一个Proxy实例;target参数表示所要拦截的目标对象,handler参数也是一个对象,用来定制拦截行为;
下面是另外拦截行为

var proxy=new Proxy({},{
get:function(target,property){
 return 35;
}
});
proxy.time  //35;
proxy.name //35;
proxy.title //35;

var  proxy=new Proxy({},{
get:function(){
 return 35;
}
});
let obj=Object.create(proxy);
obj.time//35;

上面代码中;通过Object.creat(proxy);创建了一个对象obj;proxy是他的原型;obj本身并没有time属性;所以根据原型链,会在proxy对象上读取该属性,导致被拦截;

//如果想要拦截一个null的值或者其他的类型的值;可以这么写;
var obj = new Proxy({}, {
  get: function (target, key, receiver) {
    console.log(`getting ${key}!`,target, key, receiver);
    if(target[key]==null){
        target[key]='空'
    }
    return Reflect.get(target, key, receiver);
  },
  set: function (target, key, value, receiver) {
    console.log(`setting ${key}!`,target, key, value, receiver);
    return Reflect.set(target, key, value, receiver);
  }
});
obj.coun    //空

关于proxy的一些实例方法;

  • get();
    get是拦截属性的读取操作;可以接受三个参数;目标对象 以及属性名称;和proxy实例本身;,其中最后一个参数可选;
    get方法的用法;
var person={
name:'张三'
};
var proxy=new Proxy(person,{
 get(target,peoperty){
  if(property in target){
   return target[property];
  }else{
   throw new PeferenceEffor("Property"+property+"\dees not exist.");
  }
 }
});
proxy.name  //‘张三’
proxy.age //抛出异常;

上面代码中;不存在就抛出异常;如果没有这个拦截函数;就返回undefined;

get方法可以继承;

function createArray(...element){
let handler={
  get(target,propKey,receiver){
    let index=number(propKey);
   if(index<0){
     propKey=String(target.length+index);
   };
   return Peflect.get(target,propkey,receiver)
 }
}
}

相关文章

  • ES6-proxy比较重要的方法(1)

    proxy 代理 元编程两个关键字;用于修改某些操作的默认行为;等同于在语言橙层面做出修改;所以属于一种 元编程;...

  • ES6-proxy比较重要的方法(2)

    set 前面讲了get;家下来说set; set方法用来拦截某属性的赋值操作;可以接受四个参数;依次是目标对象;属...

  • 时间管理3+1表

    工作中到底是能力比较重要?努力比较重要?还是方法比较重要?能力和努力固然都很重要,但是其实方法更加重要,方法不对,...

  • ES6系列之Proxy

    原文链接 http://blog.poetries.top/2018/12/21/es6-proxy/ 关注公众号...

  • 快速入门雅思考试的五大原则

    1. 在list of heading 题中: ⑴根据topic sentence 解题是比较重要的方法之一。因而...

  • Blockcanary的使用以及电话冷启动优化实战

    背景:其实优化内存。比较重要的是找到哪方法比较耗时。然后优化它。但是往往找那个方法比较耗时是最麻烦了。最笨的方法就...

  • iOS笔记之UITextField

    1、UITextField属性与方法 挑选几个比较重要的样式展示一下 重写绘制行为除了UITextField对象的...

  • Android View事件分发机制

    首先,我们来看看View中比较重要的几个方法 dispatchTouchEventonTouchListener ...

  • 产品经理的自我管理

    重点说明: 1. 目标管理中的一些原则比较实用也比较重要,可以重点学习一下SMART原则和PDCA方法。 2. 时...

  • 方法比较

    对比总结 1、09年的通过保边滤波解决 halo artifacts (halo artifacts are ...

网友评论

      本文标题:ES6-proxy比较重要的方法(1)

      本文链接:https://www.haomeiwen.com/subject/serwrqtx.html