[ES6-重点纪录] 其他的 API 与特性扩展

在 JavaScript ES6 标準规範中，其实还有很多的新扩展、新语法、新 API 都很有特色，只是这些就比较不常用了，大部分的功能也都能使用旧方法去实现，至少这些新事物能帮助简化程序就是一大进步了。

本篇将会简单地介绍 ES6 其他较实用常见的 API 与扩展，主要知道基本内容就好，并不会深入探讨。

JavaScript ES6 其他常见的新 API

Promise 物件

Promise 是一种非同步 (asynchronous) 处理的解决方案特别参考JavaScript ES6 Promise Object 物件JavaScript ES6 Promise实用範例参考Promise 实例 & 程式码片段Fun with promises in JavaScript

Set 物件

这是新的资料结构物件，Set 类似于阵列，但内容成员不会有重複的值放入有重複的值将会被覆盖，内容成员总数不变与 Map 物件一样都有类似的操作方法与迭代方法

let set = new Set();// 可以使用 add() 方法设置资料内容set.add(10);set.add(10);set.add('text');set.add({sayHi: 'Hi'});console.log(map);// Set(4) {10, "text", {sayHi: "Hi"}}

Proxy 物件

概念为重新定义 JavaScript 中某些操作的原始行为，拦截那些操作方法去改变它应用範例 :利用 Proxy 可以让 "读取 Object 的属性值" 转变为 "执行某个函数"，从而实现属性的方法操作，不需要建立函数利用 Proxy 可以让 "设定 Object 的属性值" 作为 "数据绑定"，发生变化时就会自动更新 DOM 与浏览器上的渲染

// 这是基本语法var proxy = new Proxy(target, handler);// 此用来拦截变数的 "物件内容"，改变它的原始行为 var proxy = new Proxy({}, {    get: function(target, propKey, receiver) {        return 'getting';    },    set: function(target, propKey, value, receiver) {        console.log('setting');    }});console.log(proxy.test);  // 'getting' console.log(proxy.other); // 'getting' // 以下都会执行 console.log('setting');proxy.abc = 10; proxy[10] = 'test'; 

Reflect 物件

概念也是拦截 JavaScript 中某些操作方法去改变它Reflect 可以在 Proxy 的内部方法调用，确保该操作方法会执行原始的行为，然后再执行 Proxy 内定义的额外的功能另外 Reflect 物件的其他用途可以用来取代 Object 原型中部分的操作方法，改善了一些物件原始结构的问题

Generator 生成器函数

它有点类似一般的函数，使用关键词function*Generator 的运作概念就像是一个状态机 (state machine)，会一直改变内部的不同状态取得的 Generator 物件，起始状态会先暂停什么都不做，而每次执行next()方法，就会继续执行函数，直到遇到下一个 yield 关键字，又会暂停函数的执行，而每一次暂停时会 yiled (产出)一个当前状态值yiled 会返回一个{value: anyType, done: boolean}结构的物件Generator 产生的物件也有 Iterator 的性质，所以可以用for...of迭代迴圈去取得 yield 返回的 value 值

function* gen() {     yield 1;    yield 2;}var g = gen();// 第一次执行 next() - 停在 yield 1// 返回 Object {value: 1, done: false}g.next(); // 第二次执行 next() - 停在 yield 2// 返回 Object {value: 2, done: false}g.next(); // 第三次执行 next() - 没有 yield 将会结束// 返回 Object {value: undefined, done: true}g.next(); 

JavaScript ES6 其他较实用的扩展

字串 (Sting) 可使用 Unicode 表示法

// Unicode 表示法console.log("\u{41}\u{42}\u{43}"); // ABC

数值 (Number) 可以使用二进制和八进製表示法前缀须加上0b(或0B)、0o(或0O)表示数值 (Number) 可以使用**关键字当作指数运算

// 二进制和八进製表示法console.log(0b1100011); // 99console.log(0o143); // 99// 指数运算console.log(2**6); // 64

JavaScript ES6 其他新功能 - 参考网址

ECMAScript 2015 support in Mozilla