旧的 JS 版本以数字命名:ES5 (2009) 和 ES6 (2015)。
从 2016 年开始,版本按年份命名:ECMAScript 2016、2017、2018、2019,...
Promise any():style="word-wrap:break-word;">const first=wait Promise.any([prom1,prom2,prom3]);
字符串替换全部()
数字分隔符 (_)
数组 at()
字符串位于()
正则表达式 /d
对象.hasOwn()
错误原因
等待导入
私有方法和字段
类字段声明
这些功能相对较新。
较旧的浏览器可能需要替代代码(Polyfill)
ES2021 引入了字符串方法 replaceAll()
:
text = text.replaceAll("Cats","Dogs");
text = text.replaceAll("cats","dogs");
自己尝试一下 →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Strings</h1>
<h2>The replaceAll() Method</h2>
<p>ES2021 intoduced the string method replaceAll().</p>
<p id="demo"></p>
<script>
let text = "I love cats. Cats are very easy to love. Cats are very popular."
text = text.replaceAll("Cats","Dogs");
text = text.replaceAll("cats","dogs");
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>
replaceAll()
方法允许您指定一个 正则表达式而不是要替换的字符串。
如果参数是正则表达式,则必须设置全局标志(g),否则 抛出类型错误。
text = text.replaceAll(/Cats/g,"Dogs");
text = text.replaceAll(/cats/g,"dogs");
自己尝试一下 →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Strings</h1>
<h2>The replaceAll() Method</h2>
<p>ES2021 intoduced the string method replaceAll().</p>
<p id="demo"></p>
<script>
let text = "I love cats. Cats are very easy to love. Cats are very popular";
text = text.replaceAll(/Cats/g,"Dogs");
text = text.replaceAll(/cats/g,"dogs");
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>
ES2020引入了字符串方法matchAll()。
ES2021 引入了数字分隔符 (_) 以使数字更具可读性:
const num = 1_000_000_000;
自己尝试一下 →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Numbers</h1>
<p>ES2021 intoduced the numeric separator (_) to make numbers more readable:</p>
<p id="demo"></p>
<script>
const num = 1_000_000_000;
document.getElementById("demo").innerHTML = num;
</script>
</body>
</html>
数字分隔符仅供视觉使用。
const num1 = 1_000_000_000;
const num2 = 1000000000;
(num1 === num2);
自己尝试一下 →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Numbers</h1>
<p>ES2021 intoduced the numeric separator (_) to make numbers more readable:</p>
<p>Is 1_000_000_000 the same as 1000000000?</p>
<p id="demo"></p>
<script>
const num1 = 1_000_000_000;
const num2 = 1000000000;
document.getElementById("demo").innerHTML = (num1 === num2);
</script>
</body>
</html>
数字分隔符可以放置在数字中的任意位置:
const num1 = 1_2_3_4_5;
自己尝试一下 →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Numbers</h1>
<p>ES2021 intoduced the numeric separator (_) to make numbers more readable:</p>
<p id="demo"></p>
<script>
const num = 1_2_3_4_5;
document.getElementById("demo").innerHTML = num;
</script>
</body>
</html>
数字的开头或结尾不允许使用数字分隔符。
在 JavaScript 中,只有变量可以以 _ 开头。
自 2020 年 1 月起,所有现代浏览器都支持数字分隔符:
Chrome 75 | Edge 79 | Firefox 74 | Safari 13.1 | Opera 67 |
Jun 2019 | Jan 2020 | Oct 2019 | Sep 2019 | Jun 2019 |
at()
ES2022引入了数组方法at()
:
获取水果的第三个元素:
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fruit = fruits.at(2);
自己尝试一下 →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Arrays</h1>
<h2>The at() Method</h2>
<p>The at() method returns an indexed element from an array:</p>
<p id="demo"></p>
<script>
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fruit = fruits.at(2);
document.getElementById("demo").innerHTML = fruit;
</script>
</body>
</html>
获取水果的第三个元素:
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fruit = fruits[2];
自己尝试一下 →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Arrays</h1>
<h2>Bracket Notation</h2>
<p>The bracked notation [] returns an indexed element from an array:</p>
<p id="demo"></p>
<script>
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fruit = fruits[2];
document.getElementById("demo").innerHTML = fruit;
</script>
</body>
</html>
at()
方法从数组返回索引元素。
at()
方法返回与 []
相同的结果。
自 2022 年 3 月起,所有现代浏览器均支持 at()
方法:
Chrome 92 | Edge 92 | Firefox 90 | Safari 15.4 | Opera 78 |
Apr 2021 | Jul 2021 | Jul 2021 | Mar 2022 | Aug 2021 |
许多语言允许像 [-1] 这样的负括号索引
来访问从末尾开始的元素 对象/数组/字符串。
这在 JavaScript 中是不可能的,因为 [] 用于访问数组和对象。 obj[-1] 指的是键 -1 的值,而不是对象的最后一个属性。
ES2022 中引入了 at()
方法来解决这个问题。
at()
ES2022 引入了字符串方法 at()
:
获取名字的第三个字母:
const name = "W3Schools";
let letter = name.at(2);
自己尝试一下 →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Strings</h1>
<h2>The at() Method</h2>
<p>The at() method returns an indexed element from a string:</p>
<p id="demo"></p>
<script>
const name = "W3Schools";
let letter = name.at(2);
document.getElementById("demo").innerHTML = letter;
</script>
</body>
</html>
获取名字的第三个字母:
const name = "W3Schools";
let letter = name[2];
自己尝试一下 →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Strings</h1>
<h2>Bracket Notation</h2>
<p>The bracked notation [] returns an indexed element from a string:</p>
<p id="demo"></p>
<script>
const name = "W3Schools";
let letter = name[2];
document.getElementById("demo").innerHTML = letter;
</script>
</body>
</html>
at()
方法从字符串返回索引元素。
at()
方法返回与 []
相同的结果。
自 2022 年 3 月起,所有现代浏览器均支持 at()
方法:
Chrome 92 | Edge 92 | Firefox 90 | Safari 15.4 | Opera 78 |
Apr 2021 | Jul 2021 | Jul 2021 | Mar 2022 | Aug 2021 |