📜  ES8-新功能

📅  最后修改于: 2020-10-25 10:51:26             🧑  作者: Mango


本章重点介绍ES8中的新功能。

填充字符串

ES8引入了两个用于填充字符串的字符串处理功能。这些函数可用于在字符串值的开头和结尾添加空格或任何所需的字符集。

串。 padStart()

这个函数从一开始就多次焊盘当前字符串与给定的输入字符串,直到当前字符串达到给定长度。 padStart()函数的语法如下:

句法

string_value.padStart(targetLength [, padString])

padStart()函数接受两个参数,如下所示:

  • targetLength-一个数值,代表填充后字符串的目标长度。如果此参数的值小于或等于字符串的现有长度,则按原样返回字符串值。

  • padString-这是一个可选参数。此参数指定要用于填充字符串中的字符。如果没有值传递给此参数,则字符串值将用空格填充。

下面的示例声明一个字符串变量product_cost。该变量将从左开始用零填充,直到字符串的总长度为7。该示例还说明了padStart()函数的行为(如果没有值传递给第二个参数)。


以上代码的输出将如下所示-

0001699
7
1699
7

String.padEnd()

此函数焊盘当前字符串与从端部的给定输入字符串反复,直到当前字符串达到指定的长度。

padEnd()函数的语法如下:

句法

string_value.padEnd(targetLength [, padString])

padEnd()函数接受两个参数-

  • targetLength-一个数值,代表填充后字符串的目标长度。如果此参数的值小于或等于字符串的现有长度,则按原样返回字符串值。

  • padString-这是一个可选参数。此参数指定要用于填充字符串中的字符。如果没有值传递给此参数,则字符串值将用空格填充。

下面的示例声明一个字符串变量product_cost。变量将从右开始用零填充,直到字符串的总长度为7。该示例还说明了padStart()函数的行为(如果没有值传递给第二个参数)。


上面代码的输出将如下所述-

1699xxx
7
1699
7

尾随逗号

尾随逗号只是列表中最后一项之后的逗号。尾部逗号也称为最终逗号。

尾随逗号和数组

使用Array.prototype.forEach循环时,将跳过数组中的尾部逗号。

下面的示例使用foreach循环使用尾随逗号来迭代数组。


上面代码的输出将如下所示-

4
[100, 90, 80, empty]
100
90
80

尾随逗号和函数调用

JavaScript运行时引擎会忽略在定义或调用函数时作为参数传递的结尾逗号。但是,有两个例外-

  • 函数定义或仅包含逗号的调用将导致SyntaxError。例如,以下代码段将引发错误-

function test(,){} // SyntaxError: missing formal parameter
(,)=>{}; //SyntaxError: expected expression, got ','
test(,) //SyntaxError: expected expression, got ','
  • 尾部逗号不能与rest参数一起使用。

function test(...arg1,){} // SyntaxError: parameter after rest parameter
(...arg1,)=>{} // SyntaxError: expected closing parenthesis, got ','

下面的示例声明在参数列表尾随逗号的函数。


上面代码的输出如下-

60
6

Object:entries()和values()

ES8为内置对象类型引入了以下新方法-

  • Object.entries -Object.entries()方法可用于访问对象的所有属性。

  • Object.values() -Object.values()方法可用于访问对象所有属性的值。

  • Object.getOwnPropertyDescriptors() -此方法返回一个包含对象所有自身属性描述符的对象。如果对象没有任何属性,则可能会返回一个空对象。


上面的代码输出如下:

[
["firstName", "Kannan"],
["lastName", "Sudhakaran"],
]
["Kannan", "Sudhakaran"]


上面代码的输出如下:

["0", 10],
["1", 20],
["2", 30],
["3", 40]
]
[10, 20, 30, 40]


上面代码的输出将如下所述-

{firstName: {value: "Mohtashim", writable: true, enumerable: true, configurable: true}
fullName: {get: ƒ, set: undefined, enumerable: true, configurable: true}
lastName: {value: "Mohammad", writable: true, enumerable: true, configurable: true}
}

异步并等待

异步/等待是ES8中非常重要的功能,它是JavaScript中Promises的语法糖。 await关键字与promise一起使用。此关键字可用于暂停执行函数,直到兑现承诺为止。如果已解决承诺,则await关键字将返回承诺的值;如果拒绝了承诺,则关键字将引发错误。等待函数只能在标记为异步的功能内使用。使用async关键字声明的函数始终返回promise。

句法

下面给出了带有await的异步函数的语法-

async function function_name(){
   let result_of_functionCall = await longRunningMethod();
}
//invoking async function

function_name().then(()=>{})
   .catch(()=>{})

考虑一个示例,该示例具有一个异步函数,该函数需要两秒钟的时间执行并返回字符串值。可以通过以下两种方式调用该函数

  • 使用promise.then()
  • 使用aync / await。

以下代码显示了使用传统的ES6语法-promise.then()调用异步函数


上面的代码输出如下:

end of script
response is:2 seconds have passed

以下代码显示了使用ES8语法调用异步函数简洁的方法-async / await


上面代码的输出将如下所述-

inside my_AsyncFunc
end of script
response is:2 seconds have passed

使用Async / await进行Promise链接

以下示例使用async / await语法实现promise链。

在此示例中,add_ positivenos_async()函数异步添加两个数字,如果传递负值,则拒绝。当前异步函数调用的结果将作为参数传递给后续函数调用。


上面代码的输出如下:

end
first result 30
second result 60
third result 120
Async : Done Sequence