最新公告
  • 欢迎您光临起源地模板网,本站秉承服务宗旨 履行“站长”责任,销售只是起点 服务永无止境!立即加入钻石VIP
  • 没想到啊,ES2021居然更新了这样的5个 API

    正文概述 掘金(陈大鱼头)   2021-03-14   490

    如果没什么特殊情况,每一年 tc39 都会更新一些特性 API ,今年出的则是第 12 版,也就是我们说的 ES12 , 下面让我们一起来看看都更新了哪些 API。

    数字分隔符(Numeric Separators)

    总所周知,我们的 Number 是长这样的:123456 。但是当金额大了之后,就会很不直观,每次看还得算,不过如今我们可以这样:

    // 旧的方案
    const count1 = 123456789;
    
    // 新的方案
    const count2 = 123_456_789;
    
    console.log(count2); // 123456789
    

    String.prototype.replaceAll()

    新的 replaceAll() 可以直接替换全部匹配的字符,就像这样:

    '好一朵美丽的茉莉花,茉莉花啊,茉莉花啊,你又香又好看'.replaceAll('茉莉花', '玫瑰花');
    // 好一朵美丽的玫瑰花,玫瑰花啊,玫瑰花啊,你又香又好看
    

    但是如果你在 replaceAll() 里用 g 以外的标识符,或者不加 g ,都会报错,例如:

    '好一朵美丽的茉莉花,茉莉花啊,茉莉花啊,你又香又好看'.replaceAll(/茉莉花/, '玫瑰花');
    // Uncaught TypeError: String.prototype.replaceAll called with a non-global RegExp argument
    

    所以这个只是 g 的语法糖。。。

    逻辑赋值运算符(Logical Assignment Operators)

    这次也更新了一些运算符,以后写起短链表达式来就方便多了。

    And and equals 运算符 (&&=)

    **&&= **仅在左操作数为 truthy 时才执行赋值。

    let a = 1;
    let b = 2;
    a &&= b;
    console.log(a); // 15
    
    // 等价于
    if (a) {
        a = b;
    }
    console.log(a); // 15
    

    Or or equals (||=)

    ||= 与 **&&= ** 相反,仅当左操作数为 falsy 时才执行赋值。

    let a = undefined;
    let b = 2;
    
    a ||= b;
    console.log(a); // 2
    
    // 等价于
    if (!a) {
        a = b;
    }
    

    Question question equals (??=)

    ??= 仅当左操作数为 null 或者 undefined 才执行赋值。

    let a = undefined;
    let b = 2;
    
    a ??= b;
    console.log(a); // 2
    
    // 等价于
    if (a === null || a === undefined) {
        a = b;
    };
    

    Promise.any

    这次 Promise 出了一个新方法 Promise.any ,跟 Promise.all 正好相反,只要有一个是 promisefulfilled 时,则直接返回该结果,如果都是 rejected ,则报错 。

    Promise
      .any([
        Promise.reject('rejected'),
        Promise.resolve('fulfilled')
    	])
    	.then(res => console.log(res))
    	.catch(err => console.error(err));
    // fulfilled
    
    Promise
      .any([
        Promise.reject('rejected1'),
        Promise.reject('rejected2')
    	])
    	.then(res => console.log(res))
    	.catch(err => console.error(err));
    // AggregateError: All promises were rejected
    
    Promise
      .any([
        Promise.resolve('resolve1'),
        Promise.resolve('resolve1')
    	])
    	.then(res => console.log(res))
    	.catch(err => console.error(err));
    // resolve1
    

    WeakRefs

    WeakRef 是 **Weak References(弱引用)**的简写,其主要用途是对另一个对象进行弱引用。这就意味着它不会阻止GC(garbage collector 垃圾收集器)收集对象。当我们不想将对象永远保存在内存中时,这就很有用了。但是使用的时候要慎重,因为有可能出现要使用时,被引用对象已经被回收的情况。就连 TC39 提案都建议能不用就不用。

    const newRef = new WeakRef({
         name: '鱼头',
         age: '26',
         sex: '男'
    });
    
    const obj = newRef.deref();
    
    console.log(obj); // {name: "鱼头", age: "26", sex: "男"}
    

    参考资料

    1. What's new in ECMAScript 2021
    2. Ecma TC39
    3. [ECMAScript] TC39 process
    4. The TC39 Process

    起源地下载网 » 没想到啊,ES2021居然更新了这样的5个 API

    常见问题FAQ

    免费下载或者VIP会员专享资源能否直接商用?
    本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。
    提示下载完但解压或打开不了?
    最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量,若小于网盘提示的容量则是这个原因。这是浏览器下载的bug,建议用百度网盘软件或迅雷下载。若排除这种情况,可在对应资源底部留言,或 联络我们.。
    找不到素材资源介绍文章里的示例图片?
    对于PPT,KEY,Mockups,APP,网页模版等类型的素材,文章内用于介绍的图片通常并不包含在对应可供下载素材包内。这些相关商业图片需另外购买,且本站不负责(也没有办法)找到出处。 同样地一些字体文件也是这种情况,但部分素材会在素材包内有一份字体下载链接清单。
    模板不会安装或需要功能定制以及二次开发?
    请QQ联系我们

    发表评论

    还没有评论,快来抢沙发吧!

    如需帝国cms功能定制以及二次开发请联系我们

    联系作者

    请选择支付方式

    ×
    迅虎支付宝
    迅虎微信
    支付宝当面付
    余额支付
    ×
    微信扫码支付 0 元