简述es6的proxy代理和generator生成器与yield语句

proxy 对对象进行代理,类似于监控对象的一个方法

这个方法接收两个参数,

  • 第一个参数为要代理的对象,
  • 第二个为一个对象
//对象例子
let teacher = {
  name:"jaki",
  age:25,
  traching:function(){
    console.log(this.name);
  }
}
//这个对象里面的set方法前3个参数.
let proxy_teacher =new Prooxy(teacher,{
    // 第一个为代理对象的本身,
    //第二个参数为被赋值的属性,
    //第三个参数为给这个属性的值.
  //set为添加对象属性时触发
set:(target,key,value)=>{
    console.log("添加属性",key);
    target[key] = value;
  },
   //get方法前两个参数
    //- 第一个参数为代理对象本身,
    //- 第二个为要访问的属性名
//get为访问对象属性时触发
get:(target,key)=>{
    console.log("获取属性",key);
    return target[key]
  },
//判断是否包含某个属性时触发
has:(target,key)=>{..}
//输出对象属性时触发
deleteProxy:(..){..}
//输出对象属性时触发
deleteProxy:(..){..}
//拦截call()和apply方法 用于函数对象
apply:(target,object,arguments)=>{
  console.log("拦截  call,apply方法");
target.apply(object,arguments)
}
//拦截构造函数的方法
construct:(target,arguments)=>{
  return {}
}
...
//..方法很多资料就不一一列举了
})
console.log(proxy_teacher.name) 
proxy_teacher.subject = "javascript"
console.log(proxy_teacher.subject) 
打印如下
//获取属性:name
//Jaki
//添加属性:subject
//获取属性:subject
//javascript

proxy可以当成是一个对象的钩子函数来使用,在对象某个时期执行某个方法.

generator生成器与yield语句

  • 个人理解generator的函数使用环境为在一个方法里面分开几个部分来,到达某一个条件才执行这个函数的后一部分,而不需要跑完这个函数整体.
  • 在generator生成器里面的函数返回值为一个对象.这个对像的value属性值为这个函数的返回值,done为这个函数返回这个值时,这个函数的执行状态,如果执行结束则为true否则为false.如果为false则这个函数依旧可以使用next()执行下一步.

上代码

function* generatorFunc(){
    console.log("one");
  yield 1;
  console.log("tow");
  yield 2;
  console.log(three);
  return 3;
}

let g = generatorFunc();
let one = g.next()    //one   执行第一阶段代码且返回值
let tow = g.next()    //tow
let three = g.next()  //three
let four = g.next()
console.log(one); // {value:1,done:false}   返回的值为1,函数还可以执行
//...
console.log(one); // {value:undefined,done:false}   返回的值为空,函数整体已经执行结束了.
  • 在调用yield时我们还可以传入参数,此参数会作为上一个任务yield表达式的值,这个值会作为上一次任务yield的值.第一次使用yield时不能传入值.
function* cal(){
  let a = yidle;
  let b = yield;
  let res = a+b;
  yield res;
  res = res*res;
  let d = yield res;
  res = res -d;
  return res; 
}
let c = cal();
c.next();
c.next(5);
console.log(c.next(3)); {value:8,done,false}
....

你可能感兴趣的:(简述es6的proxy代理和generator生成器与yield语句)