搜文章
推荐 原创 视频 Java开发 iOS开发 前端开发 JavaScript开发 Android开发 PHP开发 数据库 开发工具 Python开发 Kotlin开发 Ruby开发 .NET开发 服务器运维 开放平台 架构师 大数据 云计算 人工智能 开发语言 其它开发
Lambda在线 > IT技术大神 > 多的话不说,部分ECMAScript 2018

多的话不说,部分ECMAScript 2018

IT技术大神 2018-10-30



Q6

对象的扩展属性 (Spread properties for Objects)

扩展属性看起来就像具有三个点的Rest属性一样..., 但区别在于您使用扩展来创建(重新构建)新对象。


      提示:扩展操作符用于等号的右侧。Rest用于等号的左侧


// person 和 account 合并
const person = { fName: 'john', age: 20 };

constaccount= { name: 'bofa', amount: '$1000' };

// 通过扩展运算符提取person和account的属性,并将其添加到一个新对象中。
constpersonAndAccount = { ...person, ...account };
personAndAccount; // {fName: 'john', age: 20, name: 'bofa', amount: '$1000' }


Q7

RegExp 声明

这是对RegExp的增强,它允许我们确保某些字符串立即存在于其他字符串之前。


您现在可以使用一个组(?<=...)(问号,小于,等于)来查找肯定的声明。


此外,您可以使用(?<=...)(问号,小于,感叹号)来查看否定声明。从本质上讲,只要-ve声明通过,就会匹配。


正面声明:假设我们想要确保#符号在单词winning之前存在(即:#winning)并且希望正则表达式只返回字符串“winning”。这是你如何写它。

/(?<=#).*/.test('winning')// false
/(?<=#).*/.test('#winning'); // true
//之前
'#winning'.match(/#.*/)[0]; // '#wining',包含#
//ES2018后
'#winning'.match(/(?<=#).*/)[0]; // 'wining' 没有#, #是用来验证的


否定声明:假设我们想从这些数字之前的具有€符号而不是$符号的行中提取数字。


// 3.00不能匹配,因为符号$在前面
'A gallon of milk is $3.00'.match(/(?<\$)\d+\.?\d+/); // null
// 2.43匹配成功,因为前面没有符号$
//当匹配时,不包含符号€

'A gallon of milk is €3.00'.match(/(?<\$)\d+\.?\d+/)[0]; //2.43



Q8

RegExp Unicode属性转义

要编写RegExp来匹配各种Unicode字符并不容易。像\w,\W,\d等只能匹配英文字符和数字。但是对于印度语,希腊语等其他语言的数字呢?


这就是Unicode Property Escapes的用武之地。结果是,Unicode为每个符号(字符)添加了元数据属性,并使用它来对各种符号进行分组或描述各种符号。


例如,Unicode数据库将所有印地语字符(हिन्दी)组合在一个名为具有值Devanagari的Script脚本的属性下,另一个名为具有相同值Devanagari的Script_Extensions的属性 。所以我们可以搜索Script=Devanagari并获得所有印地文字符。


        Devanagari(梵文)可用于马拉地语,北印度语,梵语等各种印度语言。


从ECMAScript 2018开始,我们可以使用\p转义字符和{Script=Devanagari}来匹配所有印度字符。也就是说,我们可以在RegEx中使用:\p{Script=Devanagari}来匹配所有梵文字符。

//他跟随匹配多个印地文字符
/^\p{Script=Devanagari}+$/u.test('  '); //true  
//PS:有3个印地文字符h


同样,Unicode数据库将所有希腊字符组合为Script_Extensions(和Script)属性,其值为Greek。所以我们可以使用Script_Extensions=Greek或Script=Greek来搜索所有希腊字符。


也就是说,我们可以在RegEx中使用:\p{Script = Greek}来匹配所有希腊字符。


//以下匹配一个希腊字符
/\p{Script_Extensions=Greek}/u.test('π'); // true


此外,Unicode数据库将各种类型的Emojis(表情符号)存储在属性值为“true”的布尔属性Emoji,Emoji_Component,Emoji_Presentation,Emoji_Modifier和Emoji_Modifier_Base下。所以我们可以通过简单地选择表情符号来查找所有表情符号。


也就是说,我们可以使用:\p{Emoji},\Emoji_Modifier等来匹配各种Emojis。


下面的例子将会清楚。

// 下面是匹配表情字符
/\p{Emoji}/u.test('❤️'); //true
// 下面的操作失败了,因为****色的emojis没有Emoji_Modifier!
/\p{Emoji}\p{Emoji_Modifier}/u.test('✌️'); //false
//下面的操作是匹配的,\p{Emoji} 紧跟后面是 \p{Emoji_Modifier}
/\p{Emoji}\p{Emoji_Modifier}/u.test('✌); //true
// 解释:
// 默认情况下,胜利表情是有颜色的。如果我们使用相同表情的棕色、黑色或其他,它们被认为是原始表情的变体,并使用两个unicode字符表示。一个是原始表情符号,另一个是颜色的unicode字符。在下面的例子中,虽然我们只看到一个棕色的胜利表情符号,但它实际上使用了两个unicode字符,一个用于表情符号,另一个用于棕色。
//在Unicode数据库中,这些颜色具有Emoji_Modifier属性。因此,我们需要使用\p{Emoji}和\p{Emoji_Modifier}来正确和完全匹配棕色的表情符号。

/\p{Emoji}\p{Emoji_Modifier}/u.test('✌); //true

最后,我们可以使用大写的“P”(\P)转义字符而不是小p(\p)来否定匹配。


参考:
ECMAScript 2018 Proposal



Q9

Promise.prototype.finally()

finally() 是添加到Promise的新实例方法。他的主要想法是允许在解决或拒绝之后运行回调以帮助清理事情。finally回调被调用时没有任何价值,并且无论如何总是被执行。


我们来看看各种情况:


// Resolve
let started = true;
let myPromise = newPromise(function(resolve, reject) {
    resolve('all good');
})
    .then(val => {
console.log(val); //all good
    })
    .catch(e => {
console.log(e)l // 跳过
    })
    .finally(() => {
console.log('This functio**** **** ****lways executed!');
        started = false; // 清除
    })
// Reject
let started = true;
let myPromise = newPromise(function(resolve, reject) {
    resolve('reject apple');

})
    .then(val => {
console.log(val); //reject apple
    })
    .catch(e => {
console.log(e)l //catch被跳过
    })
    .finally(() => {
//注意这里没有任何值
console.log('This functio**** **** ****lways executed!');
        started = false; //清除
    })
//错误情况1
//Promise 抛出错误

let started = true;
let myPromise = newPromise(function(resolve, reject) {
thrownewError('Error');
})
    .then(val => {
console.log(val); // 跳过
    })
    .catch(e => {
console.log(e)l // 出现错误catch被调用
    })
    .finally(() => {
// 注意这里没有任何值
console.log('This functio**** **** ****lways executed!');
        started = false; // 清除
    })
// 错误从“catch”事件中抛出
let started = true;
let myPromise = newPromise(function(resolve, reject) {
thrownewError('something happend');
})
    .then(val => {
console.log(val); // 跳过
    })
    .catch(e => {
thrownewError('throw another error')
    })
    .finally(() => {
// 注意这里没有任何值
console.log('This functio**** **** ****lways executed!');
        started = false; //清除

// 错误形式的捕获将需要在其他地方调用函数来处理
    })



Q10

异步迭代 (Asynchronous Iteration)

这是一个非常有用的功能。基本上它允许我们轻松创建异步代码循环!


这个特性增加了一个新的“for-await-of”循环,允许我们调用异步函数来返回Promise(或带有一系列Promise的数组)。很酷的是循环等待每个Promise在下一个循环前解析。


const promises = [
newPromise(resolve => resolve(1)),
newPromise(resolve => resolve(2)),
newPromise(resolve => resolve(3)),
]
// 之前
// for-of使用常规同步迭代器
// 不等待Promise 去解决

asyncfunctiontest1() {
for (const obj of promise) {
console.log(obj) // 记录3 条Promise对象
    }
}
// 以后
// for-wait-of使用异步迭代

asyncfunctiontest2() {
forawait (const obj of promises) {
console.log(obj)// 1,2,3
    }
}
test1() // promise, promise, promise
test2() // 1,2,3


历史回顾



؏؏☝ᖗ乛◡乛ᖘ☝؏؏


IT技术大神   小白到大神的进阶之路





版权声明:本站内容全部来自于腾讯微信公众号,属第三方自助推荐收录。《多的话不说,部分ECMAScript 2018》的版权归原作者「IT技术大神」所有,文章言论观点不代表Lambda在线的观点, Lambda在线不承担任何法律责任。如需删除可联系QQ:516101458

文章来源: 阅读原文

相关阅读

关注IT技术大神微信公众号

IT技术大神微信公众号:whitcast

IT技术大神

手机扫描上方二维码即可关注IT技术大神微信公众号

IT技术大神最新文章

精品公众号随机推荐