[ES6] Use ES6 Proxies
A JavaScript Proxy allows you to intercept operations performed on objects, arrays, or functions like property lookup, assignment, invocation, property deletion, and more to add custom behavior. In this lesson we look at how to intercept property lookup with the get "trap" that will allow us to get items starting from the end of the array with ease.
console.clear() const characters = [
'Harry Potter',
'Ron Weasly',
'Hermione Granger',
'Nevel Longbottom',
'Lavender Brown',
'Scabbers',
'Pigwidgeon',
] const handler = {
// target: the array itself
// name: the index which passed in
get(target, name) { // check whether index is 0,1...6
if(name in target) { // if yes, then get the value back
return Reflect.get(target, name)
} else { // if not, then the name is -1, -2, -3...
const index = Number(name);
return Reflect.get(target, target.length + index)
}
}
} const proxy = new Proxy(characters, handler) console.log(proxy[]); // Nevel Longbottom
console.log(proxy[]); // Harry Potter
console.log(proxy[-]); // Scabbers
[ES6] Use ES6 Proxies的更多相关文章
- 深入浅出 ES6:ES6 与 Babel / Broccoli 的联用
深入浅出 ES6指的是添加在 ECMASript 标准第六版中的 JavaScript 编程语言的新特性,简称为 ES6. 虽然 ES6 刚刚到来,但是人们已经开始谈论 ES7 了,它未来的样子,以及 ...
- react案例->新闻移动客户端--(react+redux+es6+webpack+es6的spa应用)
今天分享一个react应用,应在第一篇作品中说要做一个react+redux+xxx的应用.已经做完一部分,拿出来分享.github地址为:点我就可以咯~ 这里实现了一个新闻移动站的spa.本来想写p ...
- ES6基础-ES6 class
作者 | Jeskson 来源 | 达达前端小酒馆 ES - Class 类和面向对象: 面向对象,即万物皆对象,面向对象是我们做开发一种的方式,开发思维,面向对象的思维中万物皆对象,以人作为例子,它 ...
- ES6基础-ES6的扩展
进行对字符串扩展,正则扩展,数值扩展,函数扩展,对象扩展,数组扩展. 开发环境准备: 编辑器(VS Code, Atom,Sublime)或者IDE(Webstorm) 浏览器最新的Chrome 字符 ...
- 【ES6 】ES6 字符串扩展及新增方法
模板字符串 传统写法 var str = 'There are <b>' + basket.count + '</b> ' + 'items in your basket, ' ...
- 【ES6 】ES6 解构赋值--数组解构赋值
定义 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构 数组的解构赋值 以前,为变量赋值,只能直接指定值. let a = 1; let b = 2; let c = 3; ...
- 【ES6】ES6入门笔记
1.概要 - ECMAScript2015(ES6)是Javascript最标准的语法式样,是在2015年6月由Ecma国籍组织公布的最新版本,现在已经被多个领域和浏览器所广泛采纳和使用. 2.学习网 ...
- 【es6】es6使用集锦
一.查找数组中是否包含某个元素 使用includes ,返回值为布尔值 arr.includes(searchElement, fromIndex): 解析:searchElement 查询元 ...
- 【ES6 】ES6 解构赋值--函数参数解构赋值
函数的参数也可以使用解构赋值. function add([x, y]){ return x + y; } add([1, 2]); 上面代码中,函数add的参数表面上是一个数组,但在传入参数的那一刻 ...
随机推荐
- [NOI2008]假面舞会(DFS)
Description 一年一度的假面舞会又开始了,栋栋也兴致勃勃的参加了今年的舞会.今年的面具都是主办方特别定制的.每个参加舞会的人都可以在入场时选择一 个自己喜欢的面具.每个面具都有一个编号,主办 ...
- MFC CListctr显示缩略图
我们知道通过CImageList可以让listctr显示出图片,但是添加的图片大小必须和要CImageList 创建的图片大小一致,才能显示出来.最近遇到一个需求,需要把很多大小不一的jpeg图片通过 ...
- CISP/CISA 每日一题 六
CISA 每日一题(答) 采用电子数据交换 EDI 的好处: 1.较少的书面工作: 2.较少的信息交换错误: 3.改善了数据库到数据库.公司到公司的信息流: 4.没有多余的数据重新键入: 5.较少的通 ...
- CISP/CISA 每日一题 二
CISA 观察和测试用户操作程序 1.职责分离:确保没人具有执行多于一个下列处理过程的能力:启动.授权.验证或分发 2.输入授权:可以通过在输入文件上的书面授权或唯一口令的使用来获得证据 3.平衡:验 ...
- Codeforces Round #277.5 解题报告
又熬夜刷了cf,今天比正常多一题.比赛还没完但我知道F过不了了,一个半小时贡献给F还是没过--应该也没人Hack.写写解题报告吧= =. 解题报告例如以下: A题:选择排序直接搞,由于不要求最优交换次 ...
- 存储过程和SQL语句比较
做为SQL存储过程和.NET的新手,下面的指导还是很有用的,自己这一段刚刚接触这些东西,搜集了一些相关的东西,能使新手较容易上手,当然啦,要精通和熟练应用,还是要看更多更深的资料的,高手请不要见笑.以 ...
- Java vs C++:子类覆盖父类函数时缩小可访问性的不同设计
Java 和 C++ 都是面向对象的语言,允许对象之间的继承.两个语言的继承都设置有允许子类覆盖父类的“虚函数”,加引号是因为 Java 中没有虚函数这一术语,但是我们的确可以把 Java 的所有函数 ...
- Something-Summary
1.Combinatorial Mathematics 1.1 Bell Number: \(B_n\)表示元素个数为n的集合划分成若干个不相交集合的方案数. \(B_{n + 1} = \sum_{ ...
- GCJ 2008 Round 1A Minimum Scalar Product
https://code.google.com/codejam/contest/32016/dashboard 题目大意: GCJ(google code jam)上的水题.下周二有比赛,来熟悉熟悉. ...
- IDEACould not autowire. No beans of 'xxxMapper' type found.
作为一名刚开始使用idea的新手,最近在使用maven+springMVC框架时遇到了这样一个问题:Could not autowire. No beans of 'xxxMapper' type f ...