ECMAScript 2017（ES8）特性概述

Kyxy 发布于2019-08-21 11:46 / 554人阅读

摘要：特性概述整理自，归纳于笔者的现代开发语法基础与实践技巧系列文章中也欢迎关注前端每周清单系列获得一手资讯。本部分则介绍了新的构造器与包含静态方法的命名空间对象。

ECMAScript 2017（ES8）特性概述整理自 ES8 was Released and here are its Main New Features，归纳于笔者的现代 JavaScript 开发：语法基础与实践技巧系列文章中；也欢迎关注前端每周清单系列获得一手资讯。

ECMAScript 2017（ES8）Features

ECMAScript 2017 或 ES8 与 2017 年六月底由 TC39 正式发布，可以在这里浏览完整的版本；而 ES8 中代表性的特征包括了字符串填充、对象值遍历、对象的属性描述符获取、函数参数列表与调用中的尾部逗号、异步函数、共享内存与原子操作等。

字符串填充

ES8 中添加了内置的字符串填充函数，分别为 padStart 与 padEnd，该函数能够通过填充字符串的首部或者尾部来保证字符串达到固定的长度；开发者可以指定填充的字符串或者使用默认的空格，函数的声明如下：

str.padStart(targetLength [, padString])

str.padEnd(targetLength [, padString])

如上所示，函数的首个参数为目标长度，即最终生成的字符串长度；第二个参数即是指定的填充字符串：

"es8".padStart(2);          // "es8"
"es8".padStart(5);          // "  es8"
"es8".padStart(6, "woof");  // "wooes8"
"es8".padStart(14, "wow");  // "wowwowwowwoes8"
"es8".padStart(7, "0");     // "0000es8"
"es8".padEnd(2);          // "es8"
"es8".padEnd(5);          // "es8  "
"es8".padEnd(6, "woof");  // "es8woo"
"es8".padEnd(14, "wow");  // "es8wowwowwowwo"
"es8".padEnd(7, "6");     // "es86666"

对象指遍历

Object.values 函数会返回指定对象的可枚举的属性值数组，数组中值顺序与 for-in 循环保持一致，函数的声明为：

Object.values(obj)

首个参数 obj 即为需要遍历的目标对象，它可以为某个对象或者数组（数组可以看做键为下标的对象）：

const obj = { x: "xxx", y: 1 };
Object.values(obj); // ["xxx", 1]

const obj = ["e", "s", "8"]; // same as { 0: "e", 1: "s", 2: "8" };
Object.values(obj); // ["e", "s", "8"]

// when we use numeric keys, the values returned in a numerical 
// order according to the keys
const obj = { 10: "xxx", 1: "yyy", 3: "zzz" };
Object.values(obj); // ["yyy", "zzz", "xxx"]
Object.values("es8"); // ["e", "s", "8"]

而 Object.entries 方法则会将某个对象的可枚举属性与值按照二维数组的方式返回，数组中顺序与 Object.values 保持一致，该函数的声明与使用为：

const obj = { x: "xxx", y: 1 };
Object.entries(obj); // [["x", "xxx"], ["y", 1]]

const obj = ["e", "s", "8"];
Object.entries(obj); // [["0", "e"], ["1", "s"], ["2", "8"]]

const obj = { 10: "xxx", 1: "yyy", 3: "zzz" };
Object.entries(obj); // [["1", "yyy"], ["3", "zzz"], ["10": "xxx"]]
Object.entries("es8"); // [["0", "e"], ["1", "s"], ["2", "8"]]

对象的属性描述符获取

getOwnPropertyDescriptors 函数会返回指定对象的某个指定属性的描述符；该属性必须是对象自己定义而不是继承自原型链，函数的声明为：

Object.getOwnPropertyDescriptor(obj, prop)

obj 即为源对象，而 prop 即为需要查看的属性名；结果中包含的键可能有 configurable、enumerable、writable、get、set 以及 value。

const obj = { get es8() { return 888; } };
Object.getOwnPropertyDescriptor(obj, "es8");
// {
//   configurable: true,
//   enumerable: true,
//   get: function es8(){}, //the getter function
//   set: undefined
// }

函数参数列表与调用中的尾部逗号

该特性允许我们在定义或者调用函数时添加尾部逗号而不报错：

function es8(var1, var2, var3,) {
  // ...
}
es8(10, 20, 30,);

异步函数

ES8 中允许使用 async/await 语法来定义与执行异步函数，async 关键字会返回某个 AsyncFunction 对象；在内部实现中虽然异步函数与迭代器的实现原理类似，但是其并不会被转化为迭代器函数：

function fetchTextByPromise() {
  return new Promise(resolve => { 
    setTimeout(() => { 
      resolve("es8");
    }, 2000);
  });
}
async function sayHello() { 
  const externalFetchedText = await fetchTextByPromise();
  console.log(`Hello, ${externalFetchedText}`); // Hello, es8
}
sayHello();

console.log(1);
sayHello();
console.log(2);

// 调用结果
1 // immediately
2 // immediately
Hello, es8 // after 2 seconds

共享内存与原子操作

共享内存允许多个线程并发读写数据，而原子操作则能够进行并发控制，确保多个存在竞争关系的线程顺序执行。本部分则介绍了新的构造器 SharedArrayBuffer 与包含静态方法的命名空间对象 Atomics。Atomic 对象类似于 Math，我们无法直接创建其实例，而只能使用其提供的静态方法：

add /sub - 增加或者减去某个位置的某个值

and / or /xor - 进行位操作

load - 获取值

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/87100.html

ES8 走马观花（ECMAScript2017 新特性）

摘要：距离上一篇走马观花已经快两年时间了，上个月底正式发布，再写一篇姊妹篇，介绍新特性。会议的每一项决议必须大部分人赞同，并且没有人强烈反对才可以通过。已经准备就绪，该特性会出现在年度发布的规范之中。距离上一篇《ES6 走马观花》已经快两年时间了，上个月底 ES8 正式发布，再写一篇姊妹篇，介绍 ES8 新特性。什么是 ES8 ES8 是 ECMA-262 标准第 8 版的简称，从 ES...

meislzhua 2019-08-20 18:04 评论0 收藏0
ES8新特性ECMAScript2017

摘要：新特性我们大家都知道从开始组织每年都发布一些新的标准，今天也不例外，组织在今年也发布了的语法引入了规范功能引入了字符串补全长度的功能。如果某个字符串不够指定长度，会在头部或尾部补全。 ES8新特性ECMAScript2017 我们大家都知道从es6开始ECMA组织每年都发布一些新的标准，今天也不例外，ECMA组织在今年也发布了es7的语法 padStart()/padEnd() es2...

DangoSky 2019-08-20 18:15 评论0 收藏0
细解JavaScript ES7 ES8 ES9 新特性

摘要：定期召开会议，会议由会员公司的代表与特邀专家出席。新版本将会包含每年截止时间之前完成的所有特性。它引入了一个新的构造函数和具有辅助函数的命名空间对象。导言：ECMAScript的演化不会停止，但是我们完全没必要害怕。除了ES6这个史无前例的版本带来了海量的信息和知识点以外，之后每年一发的版本都仅仅带有少量的增量更新，一年更新的东西花半个小时就能搞懂了，完全没必要畏惧。本文将带您花大约...

Youngs 2019-08-23 13:45 评论0 收藏0
ES6特性概述 - ES6 - ECMAScript特性 - Javascript核心

摘要：特性概述比较新特性更多。之后后分篇描述目前已经比较成熟的语法特性例如和。同上，但返回该元素的索引号。和对象的属性行为一致。不将参数强制转行为。判断是否为在范围内的正整数。不少层面的特性可以通过进行兼容性支持。原文： http://pij.robinqu.me/JavaScript_Core/ECMAScript/es6/es6_api_extension.html 源...

Ali_ 2019-08-19 14:50 评论0 收藏0
重读《学习JavaScript数据结构与算法-第三版》-第2章 ECMAScript与TypeScr

摘要：第二种接口的概念和面向对象编程相关接口视为一份合约，在合约里可以定义这份合约的类或接口的行为接口告诉类，它需要实现一个叫做的方法，并且该方法接收一个参数。定场诗八月中秋白露，路上行人凄凉；小桥流水桂花香，日夜千思万想。心中不得宁静，清早览罢文章，十年寒苦在书房，方显才高志广。前言洛伊安妮·格罗纳女士所著的《学习JavaScript数据结构与算法》第三版于2019年的5月份...

TZLLOG 2019-08-26 10:44 评论0 收藏0