[ECMAScript] ES 2017 新特性汇总

1. Object.values / Object.entries

const a = {x:1,y:2};

// ES5 2009
Object.keys(a);    // ["x", "y"]

// ES 2017    
Object.values(a);    // [1, 2]
Object.entries(a);    // ["x", 1], ["y", 2]]

Github: proposal-object-values-entries
TC39: proposal-object-values-entries
MDN: Object.values
MDN: Object.entries

2. String padding

'abc'.padStart(10);         // "       abc"
'abc'.padStart(10, "foo");  // "foofoofabc"
'abc'.padStart(6,"123465"); // "123abc"
'abc'.padStart(8, "0");     // "00000abc"
'abc'.padStart(1);          // "abc"

'abc'.padEnd(10);          // "abc       "
'abc'.padEnd(10, "foo");   // "abcfoofoof"
'abc'.padEnd(6, "123456"); // "abc123"
'abc'.padEnd(1);           // "abc"

Github: proposal-string-pad-start-end
TC39: proposal-string-pad-start-end
MDN: padStart
MDN: padEnd

3. Object.getOwnPropertyDescriptors

var o, d;

o = { get foo() { return 17; } };
d = Object.getOwnPropertyDescriptor(o, 'foo');
/*
    {
        configurable: true,
        enumerable: true,
        get: function get foo(),
        set: undefined
    }
*/

o = { bar: 42 };
d = Object.getOwnPropertyDescriptor(o, 'bar');
/*
    {
        configurable: true,
        enumerable: true,
        value: 42,
        writable: true
    }
*/

o = {};
Object.defineProperty(o, 'baz', {
    value: 8675309,
    writable: false,
    enumerable: false
});
d = Object.getOwnPropertyDescriptor(o, 'baz');
/*
    {
        configurable: false,
        enumerable: false,
        value: 8675309,
        writable: false
    }
*/

Github: proposal-object-getownpropertydescriptors
TC39: proposal-object-getownpropertydescriptors
MDN: Object.getOwnPropertyDescriptor

4. Trailing commas in function parameter lists and calls

function clownPuppiesEverywhere(
    param1,
    param2,    // 这里可以用逗号结尾
) { /* ... */ }

clownPuppiesEverywhere(
    'foo',
    'bar',    // 这里可以用逗号结尾
);

Github: proposal-trailing-function-commas

5. Async functions

async function f1() {
    const v1 = await f2();
    return v1;
}

async function f2() {
    return 1;
}

f1().then(v => console.log(v));

（1）async function的返回值是一个promise，async function的返回值就是promise resolved的值，async function如果抛异常，则异常值就是promise rejected的值。
（2）await接受一个promise作为参数，如果await后面的值不是promise，会转换一个resolved的promise。
（3）arrow function也支持async，称为async arrow function，例如，

const f = async () => { ... };

注：
generator arrow function =>*，目前只是Stage 1。

Github: ecmascript-asyncawait
TC39: ecmascript-asyncawait
MDN: async function
MDN: await
ECMAScript 2017: 14.7 Async Arrow Function Definitions

6. Shared memory and atomics

// index.js

const worker = new Worker('./worker.js');

const buffer = new SharedArrayBuffer(Int32Array.BYTES_PER_ELEMENT * 10);
var ia = new Int32Array(buffer);

worker.postMessage(ia);

setTimeout(() => {
    Atomics.store(ia, 0, 100);
    Atomics.wake(ia, 0, 1);
}, 1*1000);

// worker.js

let ia;
onmessage = ({ data }) => {
    ia = data;
    console.log(data);    // Int32Array(10) [0, 0, 0, 0, 0, 0, 0, 0, 0, 0]

    Atomics.wait(ia, 0, 0);
    
    // 1s 后
    console.log(ia);    // Int32Array(10) [100, 0, 0, 0, 0, 0, 0, 0, 0, 0]
};

Github: ecmascript_sharedmem
MDN: SharedArrayBuffer
MDN: Atomics

7. Lifting template literal restriction

Template literals遵从字符串的转义规则：
（1）以\u开头，后跟4个16进制数字，例如，\u00B1表示±
（2）以\u开头，使用大括号括起来的16进制数字，例如，\u{2F804}表示你
（3）以\x开头，后跟2个16进制数字，例如，\xB1表示±
（4）以\开头，后跟10进制数字，用来表示八进制字面量（注：strict mode下不支持）

解释器遇到\u和\x，如果发现后面的字符不满足以上条件，就会报语法错。例如，

> latex`\unicode`
> Uncaught SyntaxError: Invalid Unicode escape sequence

Lifting template literal restriction改善了这个问题，
（1）去除\u或者\x的限制，只适用于Tagged template literals，而对于untagged template literals无效，仍然会报语法错。
（2）为了兼容性，该提案只是将转义后的字符串数组strs，置为单元素数组[undefined]，tag函数需要手动处理strs.raw进行处理。

const foo = (strs, ...exprs) => {
    console.log(strs);        // [undefined]
    console.log(strs.raw);    // ["something else \unicode"]
};

foo`something else \unicode`;

Github: proposal-template-literal-revision
TC39: proposal-template-literal-revision
MDN: Tagged template literals

---

参考

Github: finished-proposals