ES11 ------ 新增属性-CFANZ编程社区

私有属性 ‘#’

	class Person{
        // 公有属性
        name
        // 私有属性
        #age
        #weight
        // 构造方法
        constructor(name,age,weight){
            this.name = name
            this.#age = age
            this.#weight = weight
        }

        intro(){
            console.log(this.name)
            console.log(this.#age)
            console.log(this.#weight)
        }
    }

        // 实例化
        const girl = new Person('小兰', 18, '45kg')

        girl.intro()

在这里插入图片描述

Promise.allSettled

接收一个 promise 数组，返回的结果是 promise 对象（永远是成功的状态）。
用于批量异步任务。

	// 声明两个 Promise 对象
    const p1 = new Promise((resolve, reject)=>{
        setTimeout(()=>{
            resolve('商品数据 - 1')
        },1000)
    })
        
    const p2 = new Promise((resolve, reject)=>{
        setTimeout(()=>{
            // resolve('商品数据 - 2')
            reject('出错啦')
        },1000)
    })

    // 调用 allsettled 方法
    const result = Promise.allSettled([p1,p2])
    console.log(result)

在这里插入图片描述

String.prototype.matchAll

参考视频

	let str = `
        <ul>
            <li>
                <a>肖生克的救赎</a>
                <p>上映日期: 1994-09-10</p>
            </li>
            <li>
                <a>阿甘正传</a>
                <p>上映日期: 1994-07-06</p>
            </li>
        </ul>
        `
    // 声明正则
    const reg = /<li>.*?<a>(.*?)<\/a>.*?<p>(.*?)<\/p>/sg
    // 调用方法
    const result = str.matchAll(reg)
        
    const arr = [...result]
    console.log(arr)

可选链操作符 ?.

	function main(config){
        // 方法一: && 运算符在两边结果都为 true 时返回右边的值
        // const dbHost = config && config.db && config.db.host

		// 方法二: ?. 可选链操作符
        const dbHost = config?.db?.host
        console.log(dbHost) //192.168.1.100
    }
    main({
        db:{
            host:'192.168.1.100',
            username:'root'
        },
        cache:{
            host:'192.168.1.200',
            username:'admin'
        }
    })

注：如果使用方法一，当 mian() 中没有内容时，会报错。方法二会输出 undefined

动态 import

用的时候引入，提高加载效率。

实现效果：引入文件，点击按钮，弹出 hello

创建 hello.js 文件

	export function hello(){
    	alert('hello')
	}

创建 app.js 文件

	// 获取元素
	const btn = document.getElementById('btn')

	btn.onclick = function(){
    	import('./hello.js').then(module=>{
        	module.hello()
    	})
	}

创建 Demo.html 文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button id="btn">点击</button>
    <script src="app.js">
    
    </script>
</body>
</html>

BigInt

大整型

	let n = 520n
    console.log(n, typeof(n)) // 520n 'bigint'

函数

    let n = 123
    console.log(BigInt(n)) // 123n

大数值运算

	let max = Number.MAX_SAFE_INTEGER
    console.log(max)
    console.log(max + 1)
    console.log(max + 2)

    console.log('-----------------')
        
    console.log(BigInt(max))
    console.log(BigInt(max) + BigInt(1))
    console.log(BigInt(max) + BigInt(2))