Javascript 简明教程

JavaScript - ECMAScript 2017

ECMAScript 2017 版本的 JavaScript 于 2017 年发布。ECMAScript 2017 为该语言引入了许多新特性。其中一个最显着的特性是 async/await 语法,它允许我们以更同步的方式编写异步操作。它提供了共享内存和原子运算,增强了对并发编程的支持。

在本章中,我们将讨论 ECMAScript 2017 中所有新增特性。

New Features Added in ECMAScript 2017

以下是添加到 ECMAScript 2017 版本 JavaScript 中的新方法、特性等。

  1. padStart() and padEnd() methods

  2. Object.entries() method

  3. Object.values() method

  4. JavaScript async and await

  5. Object getOwnPropertyDescriptors() Method

  6. JavaScript Shared Memory

这里,我们详细解释了每项特性。

String Padding: padStart() and padEnd() methods

ECMAScript 2017 引入了两个字符串方法,即 padStart()padEnd() 方法,允许您通过添加特定字符来在字符串的开头和结尾添加填充。这些方法用于扩展字符串并实现所需的长度。

Example

在下面的代码中,我们将所需的字符串长度作为 padStart() 和 padEnd() 方法的第一个参数,字符作为第二个参数传递。

不过,您也可以将字符串作为第二个参数传递。

<html>
<body>
   <div id = "output1">After padding at the start: </div>
   <div id = "output2">After padding at the end: </div>
   <script>
      let base = "TurorialsPoint";
      let start_updated = base.padStart(18, "@"); // Padding at the start
      let end_updated = base.padEnd(18, "*");   // Padding at the end
      document.getElementById("output1").innerHTML += start_updated;
      document.getElementById("output2").innerHTML += end_updated;
   </script>
</body>
</html>
After padding at the start: @@@@TurorialsPoint
After padding at the end: TurorialsPoint****

The Object.entries() Method

ECMAScript 2017 向对象添加了 Object.entries() 方法。Object.entries() 方法返回一个迭代器以遍历对象的键值对。

Example

在下面的代码中,employee 对象包含三个属性。我们使用 Object entries() 方法获取对象的迭代器。

接下来,我们使用 for…of 循环使用迭代器遍历对象的属性。

<html>
<body>
   <div id = "demo"> </div>
   <script>
      const output = document.getElementById("demo");
      const employee = {
         Company: "TutorialsPoint",
         Ex_company: "TCS",
         Experience: 4,
      }
      const emp_iterator = Object.entries(employee);
      for (let pair of emp_iterator) {
         output.innerHTML += pair + "<br>";
      }
   </script>
</body>
</html>
Company,TutorialsPoint
Ex_company,TCS
Experience,4

The Object.values() Method

ECMAScript 2017 向对象中引入了 Object.values() 方法。JavaScript Object.values() 方法用于获取对象属性值的数组。

Example

在下面的代码中,我们使用 Object.values() 方法获取对象的所有值(在数组中)。

<html>
<body>
   <div id = "output">Object values are: </div>
   <script>
      const wall = {
         color: "blue",
         size: "15x12",
         paintBrand: "Asiant paints"
      }
      document.getElementById("output").innerHTML +=
	  " " + Object.values(wall);
    </script>
</body>
</html>
Object values are: blue,15x12,Asiant paints

JavaScript async and await

在 ECMAScript 2017 中,将 async 和 await 关键字添加到该语言中。async/await 关键字用于创建异步函数。async 关键字用于创建异步函数,而 await 关键字处理操作。

Example

下面的代码中,printMessage() 函数是异步的。我们在函数内部定义了一个新承诺,并将它存储在 getData 变量中。

承诺需要 0.5 秒的时间来解决。‘await’ 关键字处理承诺,并在承诺得到解决之前阻止函数代码执行。

<html>
<body>
   <div id = "output"> </div>
   <script>
      async function printMessage() {
         let getData = new Promise(function (res, rej) {
            setTimeout(() => { res("Promise resolved !!"); }, 500);
         });
         document.getElementById("output").innerHTML = await getData;
      }

      printMessage();
   </script>
</body>
</html>
Promise resolved !!

The Object.getOwnPropertyDescriptors() Method

Object.getOwnPropertyDescriptor() 方法返回每个属性的属性描述符,例如可写、可枚举、可配置、值等。它是对象属性的元数据。

Example

在下面的代码中,我们使用 getOwnPrpopertyDescriptors() 方法获取对象每个属性的属性描述符。

<html>
<body>
   <div id = "output">The Property descriptors of the wall object is: <br></div>
   <script>
      const wall = {
         color: "blue",
         thickness: 10,
      }
      document.getElementById("output").innerHTML +=
	  JSON.stringify(Object.getOwnPropertyDescriptors(wall));
   </script>
</body>
</html>
The Property descriptors of the wall object is:
{"color":{"value":"blue","writable":true,"enumerable":true,"configurable":true},"thickness":{"value":10,"writable":true,"enumerable":true,"configurable":true}}

JavaScript Shared Memory and Atomics

在 JavaScript 中,共享内存允许多个线程共享一个内存,实现多个线程之间的有效通信。

JavaScript 是一种单线程编程语言。不过,你可以使用 web 工作线程在不同的线程中运行 JavaScript 代码。

2018 年,引入了 SharedArrayBuffer,通过共享数据来共享内存和执行原子操作。