没想到啊,ES2021居然更新了这样的5个 API

news/2024/7/19 13:18:23 标签: js, gwt, web, sharepoint, character
js_content">
  • 作者:陈大鱼头

  • github:KRISACHAN

如果没什么特殊情况,每一年 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); // 2

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

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

WeakRefWeak 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


http://www.niftyadmin.cn/n/1251518.html

相关文章

java 微信 菜单_java微信公众账号自定义菜单怎么弄,求指导

开发模式自定义菜单,post一个结构体,一下是我测试的代码,报错,publicstaticvoidzidingyi(){Stringurl"https://api.weixin.qq.com/cgi-bin/menu/create?access_tokenYiq1_L1kLRj...开发模式自定义菜单,post一个结…

2021年,为什么一定要学源码?

前两天有粉丝在后台留言说:最近总是能看到关于源码类的文章,工作中也用不到,为什么都说要学源码?相信不只是他,大多数人都有这样的疑问。但是深入想想,如果不懂源码,在遇到问题的时候要怎么解决…

java 手机访问_java servlet手机app访问接口(三)高德地图云存储及检索

这篇关于高德地图的随笔内容会多一点,一、业务说明对应APP业务中的成员有两类,一是服务人员,二是被服务人员, 主要实现功能, 对APP中的服务人员位置进行时时定位, 然后通过被服务人员登录APP时提供的一个经纬度来计算服…

Vue 3.0 现状报告,未来规划

近况158 万周活跃用户(通过 devtools 插件来统计),940 万的月下载量。对比去年Devtools:110 万 -> 158 万(43.6%) NPM:620 万 -> 940 万(51.6%)Vue 3.0 One Piece自…

java中的进程,在Java中启动进程?

Is there a way to start a process in Java? in .Net this is done with for example:System.Diagnostics.Process.Start("processname");Is there an equivalent in Java so I can then let the user find the application and then it would work for any OS?解…

关于 z-index,你可能一直存在误区

z-index 这个属性表面看上去很简单,但如果你想搞清楚其工作原理的话,其实是有不少值得探讨之处的。本文将从层叠上下文(stacking contexts)和一些实际案例出发,谈一谈 z-index 的内部工作原理。CSS 为盒模型的布局提供…

python获取redis数据_Python读写Redis数据库操作示例

导读热词使用Python如何操作Redis呢?下面用实例来说明用Python读写Redis数据库。比如,我们插入一条数据,如下:import redisclass Database:def __init__(self):self.host localhostself.port 6379def write(self,website,city,y…

大家都在看的二维码扫码登录原理

在日常生活中,二维码出现在很多场景,比如超市支付、系统登录、应用下载等等。了解二维码的原理,可以为技术人员在技术选型时提供新的思路。对于非技术人员呢,除了解惑,还可以引导他更好地辨别生活中遇到的各种二维码&a…