你没注意到的 ES6 知识点

本贴最后更新于 2124 天前,其中的信息可能已经事过境迁

增强的对象字面量

  • 分配变量的简化形式
let x = 'a'; let y = 'b'; const obj = { x, y }
  • 允许在创建时定义计算成员的名称
const person = { name: 'wmai', surname: 'travy', get fullname() { return this.name + ' ' + this.surname; }, set fullname(val) { let arr = val.split(' '); this.name = arr[0]; this.surname = arr[1]; } } console.log(person.fullname); // wmai travy console.log(person.fullname = 'wen yujie'); // wen yujie console.log(person);

通过 get 和 set 定义的 fullname 属性, 默认情况下, set 方法的返回值是 get 方法返回的相同属性的值。

Map 和 Set

可以定义哈希映射集合。

const pro = new Map(); pro.set('x', 'x1'); pro.set('y', 'y1'); pro.set('x1', 'x2'); pro.set('y1', 'y2'); console.log(pro.size); // 4 console.log(pro.get('x')); // x1 console.log(pro.get('a')); // undefined console.log(pro.has('y')); // true console.log(pro.has('a')); // false console.log(pro.delete('x')); // true console.log(pro.has('x')); // false for(const item of pro) { console.log(item); } /* [ 'y', 'y1' ] [ 'x1', 'x2' ] [ 'y1', 'y2' ] */

Map 提供了 set,get,has,delete 等方法,还有 size 属性。可以用 for...of 来遍历。

Map 可以使用函数和对象作为 key , 这是普通对象不具有的。可以利用此特性来创建一个微测试框架。

const test = new Map() test.set( () => 2+2, 4); test.set( () => 2*2, 4); test.set( () => 2/2, 2); for(const entry of test) { console.log(entry[0]() === entry[1] ? 'PASS' : 'FAIL'); } /* PASS PASS FAIL */

Set 可以构建一个集合,所有的 key 是唯一的。key 允许是对象或者函数。

const s = new Set([0,1, 3, 4]); console.log(s.add(1)); // will not be added console.log(s.has(2)); // false console.log(s.delete(3)); // true for(const entry of s) { console.log(entry); // 0 1 4 }

WeakMap 和 WeakSet

const set = new Set([0, 1, 2, 3]); let obj = {}; const map = new WeakMap(); map.set(obj, {key: 'some value'}); console.log(map.get(obj)); // { key: 'some value' } obj = undefined; console.log(map.get(obj)); // undefined

WeakMap 没有办法迭代所有条目,key 只能为对象。

let obj1 = {key: 'val1'}; let obj2 = {key: 'val2'}; const ss = new WeakSet([obj1, obj2]); console.log(ss.has(obj1)); // true obj1 = undefined; console.log(ss.has(obj1)); // false

WeakSet 只允许存储对象且不能重复,允许内部对象在只剩下引用的时候被垃圾回收。

其他特性

  • 模版字面量
  • Promise
  • 默认方法参数
  • 剩余参数
  • 扩展运算符
  • 解构
  • new.target
  • Proxy
  • Reflect
  • Symbol
  • ES6
    10 引用 • 6 回帖 • 1 关注
  • 前端

    前端技术一般分为前端设计和前端开发,前端设计可以理解为网站的视觉设计,前端开发则是网站的前台代码实现,包括 HTML、CSS 以及 JavaScript 等。

    245 引用 • 1338 回帖
  • JavaScript

    JavaScript 一种动态类型、弱类型、基于原型的直译式脚本语言,内置支持类型。它的解释器被称为 JavaScript 引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在 HTML 网页上使用,用来给 HTML 网页增加动态功能。

    729 引用 • 1278 回帖 • 1 关注

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • qvo

    还‌真‌是‌些‌细‌节‌,‌不‌管‌是‌什‌么‌语‌言‌,‌没‌有‌认‌真‌学‌习‌的‌话‌也‌无‌法‌真‌正‌理‌解