7.1、Promise.allSettled
调用 allsettled 方法，返回的结果始终是成功的，返回的是promise结果值
<script>//声明两个promise对象const p1 = new Promise((resolve, reject) => {setTimeout(() => {resolve("商品数据 - 1");}, 1000);});const p2 = new Promise((resolve, reject) => {setTimeout(() => {// resolve("商品数据 - 2");reject('出错啦!');}, 1000);});//调用 allsettled 方法，返回的结果始终是成功的，返回的是promise结果值const res = Promise.allSettled([p1, p2]);console.log(res,'res');//调用all方法，返回的结果要根据Promise状态来决定，必须要全部成功，才能成功const res1 = Promise.all([p1, p2]);console.log(res1,'res1');</script>
7.2、动态 import 导入
标准用法的 import 导入的模块是静态的，会使所有被导入的模块，在加载时就被编译（无法做到按需编译，降低首页加载速度）。有些场景中，你可能希望根据条件导入模块或者按需导入模块，这时你可以使用动态导入代替静态导入。
即：动态导入是我需要的时候，再导入进来，然后调用，不需要的时候，我不导入
html文件
<body><button id="btn">登录</button><script>// 用户输入用户名,密码function login() {return "普通用户";}let btn = document.querySelector("#btn");btn.onclick = function () {// 拿到用户名密码let role = login();// 将拿到的用户密码放到处理函数里render(role); //处理函数};async function render(role) {if (role == "管理员") {// 第一种写法// let res1 = import("./js/1.js"); //返回一个Promise对象// res1.then((res) => {// console.log(res);// });// 第二种写法let res1 = await import("./js/1.js");console.log(res1);} else {// let res2 = import("./js/2.js"); //返回一个Promise对象// res2.then((res) => {// console.log(res);// });// 第二种写法let res2 = await import("./js/2.js");console.log(res2);}}</script></body>1.js 需要动态导入的js逻辑文件
console.log('hello.js');
export default{name:'管理员'
}}2.js 需要动态导入的js逻辑文件
console.log("2.js");
export default {name: "普通用户",
};7.3、BigInt
7.3.1、概念
BigInt数据类型提供了一种方法来表示大于2^53-1的整数。BigInt可以表示任意大的整数
适用场景：更加准确的使用时间戳和数值比较大的ID
7.3.2、BigInt()构造函数
- 传递给BigInt()的参数将自动转换为BigInt
- 无法转换的数据类型和值会引发异常
- 除了不能使用一元加号运算符外，其他的运算符都可以使用
- BigInt和Number之间不能进行混合操作
<script>//大整形（用来做更大的数值运算）//语法：数字+n// let n = 521n;// console.log(n, typeof(n));//521n 'bigint'//（1）传递给BigInt()的参数将自动转换为BigInt// let n = 123;// console.log(BigInt(n));//123n//（2）无法转换的数据类型和值会引发异常// console.log(BigInt(1.2));// 不能有浮点数子，会报错//BigInt(null); //报错//BigInt("a"); // 报错//（3）BigInt除了不能使用一元加号运算符外，其他的运算符都可以使用// console.log(BigInt(+1n));//报错let max = Number.MAX_SAFE_INTEGER; //最大安全整数console.log(max, "max"); //9007199254740991console.log(max + 1); //9007199254740992console.log(max + 2); 9007199254740992 不可以运算正确的结果了console.log(BigInt(max)); //9007199254740991nconsole.log(BigInt(max) + BigInt(1)); //9007199254740992nconsole.log(BigInt(max) + BigInt(2)); //9007199254740993n// （4）BigInt和Number之间不能进行混合操作console.log(1n + 5); //报错</script>7.4、globalThis 对象
globalThis 提供了一个标准的方式来获取不同环境下的全局 this 对象（也就是全局对象自身）。不像 window 或者 self这些属性，它确保可以在有无窗口的各种环境下正常工作。所以，你可以安心的使用 globalThis，不必担心它的运行环境。为便于记忆，你只需要记住，全局作用域中的 this 就是 globalThis。
<script>console.log(globalThis);//Window</script>7.5、String.matchAll
matchAll() 方法返回一个包含所有匹配正则表达式的结果的迭代器。可以使用 for...of 遍历，或者使用 展开运算符(...) 或者 Array.from 转换为数组.
<script>// 需求，提取li中的内容let str = `<ul><li>1111</li><li>2222</li></ul>`;//声明正则const reg = /<li>(.*)<\/li>/g;//调用方法const result = str.matchAll(reg);console.log(result, "result");//result里有next()方法，可遍历for (let v of result) {//返回一个数组，[0]符合条件的每一项，[1]每一项里面的值// console.log(v, "v");}</script>7.6、可选链操作符
语法：?.
判断前面的值有没有传入，如果传了继续读取后面的属性，如果没有传，那就返回undefined，也不会报错 ，免去了做层层判断
<script>function main(obj) {const person = obj?.one?.name;// const person = obj?.one?.name?.age;//undefinedconsole.log(person);//张三}main({one: {name: "张三",sex: "男",},two: {name: "李四",sex: "男",},});</script>7.7、空值合并运算符
空值合并运算符（??）是一个逻辑运算符。
当左侧操作数为 null 或 undefined 时，其返回右侧的操作数。否则返回左侧的操作数。
<script>let obj = {name: "张三",age: 18,};// ||或运算符 像亲情，找true &&与运算符 像爱情，找false// console.log(obj.age || "年龄不详"); //18// console.log(obj.age && "年龄不详"); //'年龄不详'// ??// console.log(obj.age ?? "19"); // 18// console.log(obj.age1 ?? "19"); //19// || 或运算符无法区分false、0、空字符串和null/undefined// ??无法识别null/undefined// console.log(false ||'你好');//你好// console.log(false ??'你好');//false// console.log(''||'hello');//hello// console.log(''??'hello');//返回空// console.log(0 || "你好"); //你好// console.log(0 ?? "hello"); //0// console.log(null || "你好1"); //你好// console.log(null ?? "hello1"); //hello// console.log(undefined || "你好2"); //你好// console.log(undefined ?? "hello2"); //hello</script>??和 || 的区别是什么呢?
他们两个最大的区别就是 ' '和 0，??的左侧 为 ' '或者为 0 的时候，依然会返回左侧的值；
|| 会对左侧的数据进行boolean类型转换，所以’ '和 0 会被转换成false,返回右侧的值
8.1、逻辑赋值操作符
逻辑赋值操作符 ??=、&&=、 ||=
<script>let a = true;let b = false;//console.log(a || b);//true//console.log(a && b);//falsea ||= b; //a=a||b//console.log(a); //truea &&= b; //a=a&&b//console.log(a); //falselet obj = {name: "章三",};// obj.name ??= "李四";// console.log(obj.name);obj.age ??= 18;console.log(obj.age);</script>8.2、数字分隔符
这个新特性是为了方便程序员看代码而出现的，如果数字比较大，那么看起来就不是那么一目了然
分隔符不仅可以分割十进制，也可以分割二进值或者十六进值的数据，非常好用
<script>let num=123456789let num1=123_456_789console.log(num===num1);//true</script>8.3、 replaceAll
所有匹配都会被替代项替换。模式可以是字符串或正则表达式，而替换项可以是字符串或针对每次匹配执行的函数。并返回一个全新的字符串
<script>let str = "Lorem,Lorem ipsum dolor sit Lorem.";let newStr = str.replaceAll("Lorem",'*');console.log(newStr);//*,* ipsum dolor sit *.</script>8.4、Promise.any
只要参数实例有一个变成fulfilled状态，包装实例就会变成fulfilled状态；如果所有参数实例都变成rejected状态，包装实例就会变成rejected状态。
<script>let ajax1 = function () {return new Promise((resolve, reject) => {reject("失败1");});};let ajax2 = function () {return new Promise((resolve, reject) => {reject("失败2");});};let ajax3 = function () {return new Promise((resolve, reject) => {reject("失败3");// resolve('成功')});};Promise.any([ajax1(), ajax2(), ajax3()]).then((res) => {console.log(res);}).catch((err) => {console.log("err", err);});</script>
