ECMAScript 2017（ES8）新特性

ECMAScript 2017（ES8）新特性：

• 函数参数列表结尾允许,（逗号）。
• 异步函数：async、await。
• 对象函数：Object.values()、Object.entries()。
• 字符串填充：String.prototype.padStart()、String.prototype.padEnd()。
• 列出对象所有属性的描述对象集合：Object.getOwnPropertyDescriptors()。
• 二进制数据缓冲区：ShareArrayBuffer和Atomics对象，用于从共享内存位置读取和写入。

函数参数列表结尾允许逗号

function foo(param1,param2,) {}
foo('abc','def',);

异步函数：async、await

如果某个方法的返回值是一个 Promise 实例对象，我们可以在它的调用的方法名前加await，最后这个方法返回值就不是 Promise 对象，而是一个具体的值，但是在调用这个方法的外部函数需要加上async。

async getData(){
    const res = await api.getTableData();
    // do something    
}

Object.values()、Object.entries()

ES5 引入了Object.keys()方法，返回一个数组，成员是参数对象自身的（不含继承的）所有可遍历属性的键名。ES8 引入了跟Object.keys()配套的Object.values()和Object.entries()，作为遍历一个对象的补充手段，供for…of循环使用。

• Object.keys(obj)：返回一个包含该对象所有的键的数组。
• Object.values(obj)：返回一个包含该对象所有的值的数组。
• Object.entries(obj)：返回一个包含该对象所有[key, value]键值对的数组。

Object.values(obj)方法返回一个数组，成员是参数对象自身的（不含继承的）所有可遍历属性的键值。

const obj = { foo: 'bar', baz: 42 };
Object.values(obj) // ["bar", 42]

const obj = { 100: 'a', 2: 'b', 7: 'c' };
Object.values(obj) // ["b", "c", "a"]
// 注意：如果属性名为数值的属性，是按照数值大小，从小到大遍历的，因此返回的顺序是 b、c、a。

Object.entries(obj)方法返回一个数组，成员是参数对象自身的（不含继承的）所有可遍历属性的键值对数组。

const obj = { foo: 'bar', baz: 42 };
Object.entries(obj) // [ ["foo", "bar"], ["baz", 42] ]

const obj = { 10: 'xxx', 1: 'yyy', 3: 'zzz' };
Object.entries(obj); // [['1', 'yyy'], ['3', 'zzz'], ['10': 'xxx']]

String.prototype.padStart()、String.prototype.padEnd()

在 ES8 中 String 新增了两个实例函数String.prototype.padStart()和String.prototype.padEnd()，允许将空字符串或其他字符串添加到原始字符串的开头或结尾。

String.padStart(targetLength,padStringh)
String.padEnd(targetLength,padStringh)

• targetLength：必填。当前字符串需要填充到的目标长度。如果这个数值小于当前字符串的长度，则返回当前字符串本身。
• padStringh：可选。默认值""（空字符串）。填充字符串。如果字符串太长，使填充后的字符串长度超过了目标长度，则只保留最左侧的部分，其他部分会被截断。

'x'.padStart(5, 'ab') // 'ababx'

'hello'.paddingStart(10);  // '          hello';
'hello'.paddingEnd(10);  //  'hello          ';

有时候我们处理日期、金额的时候经常要格式化，这个特性就派上用场：

'12'.padStart(10, 'YYYY-MM-DD') // "YYYY-MM-12"
'09-12'.padStart(10, 'YYYY-MM-DD') // "YYYY-09-12"

Object.getOwnPropertyDescriptors()

• ES5 的Object.getOwnPropertyDescriptor()：返回某个对象属性的描述对象（descriptor）。所谓属性的描述就是指这个属性是否可写，是否可以数之类。
• ES8 的Object.getOwnPropertyDescriptors()：返回指定对象所有自身属性（非继承属性）的描述对象集合。如果没有任何自身属性，则返回空对象。

const obj = {[Symbol('foo')]: 123, get bar() { return 'abc' },};
console.log(Object.getOwnPropertyDescriptors(obj));
/*
{
    [Symbol('foo')]:{ 
      value: 123,
      writable: true,
      enumerable: true,
      configurable: true
    },
    bar:{
      get: [Function: bar],
      et: undefined,
      enumerable: true,
      configurable: true 
    } 
}
*/

虽然在 ES6 中，Obj 已经引入了一个Object.assign()方法用来拷贝 properties，但只能拷贝具有默认属性值的属性。对于那些具有非默认属性值的属性 getters, setters, non-writable properties来说，Object.assign()是不能拷贝的。这个时候就需要使用Object.getOwnPropertyDescriptors()方法。

const target2 = {};
//属性copy
Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
console.log(Object.getOwnPropertyDescriptor(target2, 'foo'));
/*
{ 
    get: undefined,
    set: [Function: foo],
    enumerable: true,
    configurable: true
}
*/

SharedArrayBuffer、Atomics

SharedArrayBuffer对象用来表示一个通用的，固定长度的原始二进制数据缓冲区。

// 语法：new SharedArrayBuffer(length)
// 参数：length指所创建的数组缓冲区的大小，以字节(byte)为单位。
// 返回值：一个大小指定的新 SharedArrayBuffer 对象。其内容被初始化为 0。
// 注意：需要new运算符构造
// 创建一个1024字节的缓冲

let sab = new SharedArrayBuffer(1024);

/**
 * 
 * @param {*} length 所创建的数组缓冲区的大小，以字节(byte)为单位。  
 * @returns {SharedArrayBuffer} 一个大小指定的新 SharedArrayBuffer 对象。其内容被初始化为 0。
 */

new SharedArrayBuffer(10)

Atomics对象提供了一组静态方法用来对SharedArrayBuffer对象进行原子操作。

这些原子操作属于Atomics模块。与一般的全局对象不同，Atomics不是构造函数，因此不能使用new操作符调用，也不能将其当作函数直接调用。Atomics的所有属性和方法都是静态的（与 Math 对象一样）。多个共享内存的线程能够同时读写同一位置上的数据。原子操作会确保正在读或写的数据的值是符合预期的，即下一个原子操作一定会在上一个原子操作结束后才会开始，其操作过程不会中断。

鹏仔微信 15129739599 鹏仔QQ344225443 鹏仔前端 pjxi.com 共享博客 sharedbk.com