//每日前端夜话第篇//正文共:字//预计阅读时间:6分钟
EcmaInternational负责对JavaScript的标准化。是他们制定了ECMAScript规范。当提到ECMAScript时,基本上可以把它看作是JavaScript的同义词。从年开始,开始用年份标记版本,即ECMAScript缩写为ES。但是也会使用版本号的计数,所以ES6与ES相同。尚未发布的功能被称为ESNext。
ECMAScript/ES/ES11于6月发布,并且已经在现代浏览器中实现。让我们看看这会带来什么好处。
太长不看版如果你不想看细节,那么只看这张图就够了。
空值合并如果你在赋值时想要一个默认值(如果它为null或undefined),则可以使用??。
constname=person.fullName??anonymous;
如果对象person没有fullName值,则name将被赋值为“anonymous”。如果person的fullName有值,则把该值赋值给变量name。
你可能认为用
就能做到。但这几乎是几乎相同的,如果
前面的值是虚值,那么这个表达式将不会短路,并且会使用后面的值。但是请记住,空字符串,0,NaN和false都是虚值,在这些情况下将使用默认值,如果我们要用这些进行赋值的话,就行不通了。??则只检查null和undefined。
constuser={preferredSound:0}letsound=user.preferredSound??50//valueis0letsoundWrong=user.preferredSound
50//valueis50
仅当preferredSound为undefined或者null时才使用50这个值。
可选链如果要使用多级嵌套在对象中的属性,在以前必须要检查它们是否为null或undefined,以避免代码崩溃。现在可以在访问这些属性之前使用?.,这样就可以只有在值不为null或undefined时使用?.后面的代码。
例如:
consthouse={owner:{name:Jim,pet:null}};//OldJavaScriptif(househouse.ownerhouse.owner.pethouse.owner.pet.type===dog){console.log(ownerhasadog);}//ESif(house?.owner?.pet?.type===dog){console.log(ownerhasadog);}Promise.allSettled
如果要执行更多的异步请求,可以使用Promise.all来收集它们。但是如果其中任何一个请求失败的话,将会引发异常。如果我们希望每个请求都能够完成,无论其请求是否失败,那该怎么办。这时可以用Promise.allSettled,当所有请求都被解决或拒绝时,它将返回。
constpromises=[Promise.resolve(1),Promise.reject(2)];const[result1,result2]=awaitPromise.allSettled(promises);
即使其他promise被拒绝了,我们仍然可以在这里使用result1的值。
matchAll如果要用正则表达式查找所有的匹配项,可以用match来得到所有子字符串。但是,如果你既需要子字符串又需要索引,该怎么办?这时可以用matchAll并进行重复匹配。
例如找到一个字符串中的所有数字:
constmatches=Herearesomenumbers:.matchAll(/\d+/g);for(constmatchofmatches){console.log(match);}//输出://["5",index:22,input:"Herearesomenumbers:",groups:undefined]//["12",index:24,input:"Herearesomenumbers:",groups:undefined]//["88",index:27,input:"Herearesomenumbers:",groups:undefined]BigInt
BigInt是JavaScript中新的原始数据类型,与Boolean、Number、String、Symbol和undefined的地位相同。BigInt可以安全的处理大于Number限制的整数数字。也就是说如果要处理大于的数字时应该用BigInt。BigInt在数字末尾用n表示。
9_____+2;//BigInt(9_____)+BigInt(2)//n动态导入
以前只能在文件开头静态导入模块。现在有了动态导入,可以按需在代码中的任何位置进行这种操作。import()会与模块一起返回一个Promise。
constmodule=awaitimport(module);模块命名空间导出
在大多数情况下,我们能够通过导入导出JavaScript模块来重命名模块的名称,就像这样:
import*asvaluesfrommodule;import{valueasv}frommodule;export{vasvalue};
但是没有办法直接从名称被更改的另一个模块中重新导出某些内容。现在有了ES,则可以这样做:
export*assomeUtilsfromutils;globalThis
如果你的代码需要在多个环境(例如浏览器和Node服务器)下运行,那么它们所使用全局对象名称并不一致。在浏览器中用的是window,Node则用的是global,而webworker用的是self。现在,无论代码在哪种环境中运行,globalThis都能够为你提供正确的全局对象。
下面是一个例子,我们需要检查是否可以向用户提示alert。如果代码在浏览器中运行,则globalThis将会引用window,并且alert也可以使用。
if(typeofglobalThis.alert===function){globalThis.alert(hi);}精彩文章回顾,点击直达
点分享
点收藏
点点赞
点在看
预览时标签不可点收录于话题#个上一篇下一篇