ES6学习笔记(12)----Reflect
参考书《ECMAScript 6入门》
http://es6.ruanyifeng.com/
Reflect
1.概述:Object对象的内部方法都能在Reflect中找到,同时Reflect将Object的一些命令改成了函数操作,且Reflect与Proxy一一对应。
2.静态方法
Object,Reflect,Proxy对比
Reflect第一个参数是对象,如果不是,则报错
let s = Symbol("ss");
let obj = {
"color" : "black",
size : 12,
[s] : "test symbol"
}
let obj1 = {
"type" : "A"
}
function Animal(name){
this.name = name;
}
Object.defineProperty(obj,'nonEm',{
value : "123",
enumerable : false,
confirgurable : true,
writable : true
});
Reflect.defineProperty(obj,'nonCn',{
value : "er",
enumerable : true,
configurable : false,
writable : true
});
Object.keys(obj);// ["color", "size", "nonCn"]
Reflect.ownKeys(obj);//["color", "size", "nonEm", "nonCn", Symbol(ss)]
obj.color //'black'
obj['color'] //'black'
Reflect.get(obj,'color'); //'black'
obj.name = "add name";//'add name'
Reflect.set(obj,'name','add name');//true
'size' in obj //true
Reflect.has(obj,'size');//true
Object.getOwnPropertyDescriptor(obj,'name');//{value: "add name", writable: true, enumerable: true, configurable: true}
Reflect.getOwnPropertyDescriptor(obj,'name');//{value: "add name", writable: true, enumerable: true, configurable: true}
Object.setPrototypeOf(obj,obj1);//{color: "black", size: 12, nonCn: "er", name: "add name", nonEm: "123", …}
Reflect.setPrototypeOf(obj,obj1);//true
Object.getPrototypeOf(obj);//{type: "A"}
Reflect.getPrototypeOf(obj);//{type: "A"}
Object.isExtensible(obj);//true
Reflect.isExtensible(obj);//true
Object.preventExtensions(obj);//{color: "black", size: 12, nonCn: "er", name: "add name", nonEm: "123", …}
Reflect.preventExtensions(obj);//true
Object.isExtensible(obj);//false
Reflect.isExtensible(obj);//false
delete obj['color']//true
Reflect.deleteProperty(obj,'color');//true
Reflect.ownKeys(obj);//["size", "nonEm", "nonCn", "name", Symbol(ss)]
let cat = new Animal('cat');
let cat1 = Reflect.construct(Animal,'cat1');
3.观察者模式
let obj = {name : "test"}
let handler = {
set(target,propKey,propValue,receiver){
let origin = Reflect.set(target,propKey,propValue,receiver);
console.log("add " + propKey+ " = " + propValue + " to target");
return origin;
}
}
let proxy = new Proxy(obj,handler);
proxy.color = "red"; //add color = red to target "red"
将观察对象与反应行为改为动态参数
let fs = new Set();
let objTest = {name : "123"};
let action = function(t,k,v){
console.log("add new attributes");
}
let observe = function(fn){
fs.add(fn);
}
let observeObj = function(obj){
return new Proxy(obj,{
set(target,propKey,propValue,receiver){
let origin = Reflect.set(target,propKey,propValue,receiver);
fs.forEach(fn => fn());
return origin;
}
});
}
observe(action);
let x = observeObj(objTest);
x.color = "455";//add new attributes "455"
ES6学习笔记(12)----Reflect的更多相关文章
- ES6学习笔记<二>arrow functions 箭头函数、template string、destructuring
接着上一篇的说. arrow functions 箭头函数 => 更便捷的函数声明 document.getElementById("click_1").onclick = ...
- ES6学习笔记之变量的解构赋值
变量的解构赋值 ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构. 数组的解构赋值 以前,为变量赋值,只能直接指定值: 1 2 3 var a = 1; var b = 2; ...
- JS&ES6学习笔记(持续更新)
ES6学习笔记(2019.7.29) 目录 ES6学习笔记(2019.7.29) let和const let let 基本用法 let 不存在变量提升 暂时性死区 不允许重复声明 块级作用域 级作用域 ...
- Ext.Net学习笔记12:Ext.Net GridPanel Filter用法
Ext.Net学习笔记12:Ext.Net GridPanel Filter用法 Ext.Net GridPanel的用法在上一篇中已经介绍过,这篇笔记讲介绍Filter的用法. Filter是用来过 ...
- es6学习笔记-class之一概念
前段时间复习了面向对象这一部分,其中提到在es6之前,Javasript是没有类的概念的,只从es6之后出现了类的概念和继承.于是乎,花时间学习一下class. 简介 JavaScript 语言中,生 ...
- SQL反模式学习笔记12 存储图片或其他多媒体大文件
目标:存储图片或其他多媒体大文件 反模式:图片存储在数据库外的文件系统中,数据库表中存储文件的对应的路径和名称. 缺点: 1.文件不支持Delete操作.使用SQL语句删除一条记录时,对应的文 ...
- golang学习笔记12 beego table name `xxx` repeat register, must be unique 错误问题
golang学习笔记12 beego table name `xxx` repeat register, must be unique 错误问题 今天测试了重新建一个项目生成新的表,然后复制到旧的项目 ...
- ES6学习笔记<五> Module的操作——import、export、as
import export 这两个家伙对应的就是es6自己的 module功能. 我们之前写的Javascript一直都没有模块化的体系,无法将一个庞大的js工程拆分成一个个功能相对独立但相互依赖的小 ...
- ES6学习笔记<四> default、rest、Multi-line Strings
default 参数默认值 在实际开发 有时需要给一些参数默认值. 在ES6之前一般都这么处理参数默认值 function add(val_1,val_2){ val_1 = val_1 || 10; ...
随机推荐
- WC2017游记
Day0 到杭州之后出了点锅换了辆车,等了好久才开= =到宿舍发现路由器就在房门口,稳啊,过了一会儿就连不上了= =而且只有门口那个连不上,可以连上楼下的= =之后干了啥也忘了…… Day1 上午直接 ...
- 「NOIP2005」「Codevs1106」篝火晚会
题目描述 Description 佳佳刚进高中,在军训的时候,由于佳佳吃苦耐劳,很快得到了教官的赏识,成为了“小教官”.在军训结束的那天晚上,佳佳被命令组织同学们进行篝火晚会.一共有n个同学,编号从1 ...
- web项目中url-pattern改成'/'后,js、css、图片等静态资源(404)无法访问问题解决办法
感谢http://blog.csdn.net/this_super/article/details/7884383的文章 1.增加静态资源url映射 如Tomcat, Jetty, JBoss, Gl ...
- 基于active状态类名的web交互开发
demo: 默认是这样的: 当我们点击更多按钮后,会以CSS3动画的方式展开剩余所有文字信息,如下动图: 下面我们看下关键的CSS代码,这个.active是如何自身无样式的: .box { max-h ...
- HTML 新属性
accesskey 属性 -- 代表链接的快捷键访问方式 定义了accesskey的链接可以使用快捷键(ALT+字母)访问. 主菜单与导航菜单使用accesskey,通常是不错的选择. 取值: 字母 ...
- 如何在Centos7上安装&使用docker
Docker 是一个开源工具,它可以让创建和管理 Linux 容器变得简单.容器就像是轻量级的虚拟机,并且可以以毫秒级的速度来启动或停止.Docker 帮助系统管理员和程序员在容器中开发应用程序,并且 ...
- Bootstrap Notify
https://github.com/mouse0270/bootstrap-notify $.notify('Hello World', { offset: { x: 50, y: 100 } }) ...
- 关于spring boot在启动的时候报错: java.lang.Error: generate operation swagger failed, xxx.xxx.xxx
Error starting ApplicationContext. To display the auto-configuration report re-run your application ...
- View Programming Guide for iOS ---- iOS 视图编程指南(三)---Windows
Windows Every iOS application needs at least one window—an instance of the UIWindow class—and some m ...
- sscanf非常的重要
刚进研究生阶段,发现曾经学习的c语言真的好少好少,很少能够看见scanf printf等..... 以后实验的80%以上都是在linux下面 老师让我看看关于一个日志会聚的一个项目模块 发现基本上都是 ...