ES6+语法记录

 

· includes 

const mingzhu = ['西游记','红楼梦']
console.log( mingzhu.includes('西游记') )    // true
console.log( mingzhu.includes('三国') )    // false

 

· ES8对象方法的扩展 Object.values()、Object.entries()、Object.getOwnPropertyDescriptors()

const school = {
    name: "SSS",
    cities: ['北京','上海','深圳'],
    xueke: ['前端','Java','大数据','运维']
}
console.log( Object.keys(school) )    // 获取对象所有的键
console.log( Object.values(school) )    // 获取对象所有的值
console.log( Object.entries(school) )    // entries
const m = new Map(Object.entries(school));
console.log( m.get('cities') );
console.log( Object.getOwnPropertyDescriptors(school) )    // 对象属性的描述对象
const obj = Object.create( null, {
    name: {
        value: 'SSS',    // 设置值
        writable: true,    // 属性特性
        configurable: true,    // 属性特性
        enumerable: true,    // 属性特性
    }
} )

 

· ES9扩展运算符和rest参数

rest:  ...NAME     // 更多参数 
扩展运算符: const mangsend = {...one, ...two, ...three, ...four}    // 对象的合并

 

· ES9正则扩展 — 命名捕获分组

let str = '<a href="https://www.baidu.com">百度</a>'
const reg = /<a href="(.*)">(.*)<\/a>/    // 提取url与标签文本
const result = reg.exec(str);
console.log(result);        // 数组, Arr[0]为整个, Arr[1]为url， Arr[2]为文本

let str = '<a href="https://www.baidu.com">百度</a>'
const reg = /<a href="(?<url>.*)">(?<text>.*)<\/a>/    // 提取url与标签文本
const result = reg.exec(str);
console.log(result);        //  groups.text: 百度   groups.url: https://www.baidu.com

 

· ES9正则断言

let str = "JS5201314你知道吗555啦啦啦";        // 声明字符串
const reg = /\d+(?=啦)/;    // 正向断言
const result = reg.exec(str);
console.log(result);        //  正向断言
const reg = /(?<=吗)\d+/;    // 反向断言
const result = reg.exec(str);
console.log(result);        //  反向断言

 

· ES9正则 dotAll 模式

// dot    . 元字符(除换行符意外的任意单个字符)
let str = `<ul><li><a>肖申克的救赎</a><p>2022-1-1</p></li><a>肖申克的救赎2</a><p>2022-1-12</p><li></li></ul>`
const reg = /<li>\s+<a>(.*?)<\/a>\s+<p>(.*?)<\/p>/;    // 声明正则
const result = reg.exec(str);        // 执行匹配
console.log(result);        // 

const reg = /<li>.*?<a>(.*?)<\/a>.*?<p>(.*?)<\/p></li>/gs;    // dot
let result;
let data = [];
while( result = reg.exec(str) ){
    console.log(result);
    data.push({ title:result[1], time:result[2] })
}
console.log(data);

 

· ES10 Object.fromEntries // 将二维数组转换为对象,  ES8: Object.entries将对象转换为二维数组

// 二维数组
const result = Object.fromEntries([
    ['name','SSS'],
    ['xueke','Java,大数据,前端,云计算']
]);
// Map
const m = new Map();
m.set('name','AAA')
const result = Object.fromEntries(m);
console.log(result);

 

· ES10 trimStart trimEnd 清除字符串左右侧空白

 

· ES10 flat faltMap

// flat 将多维数组转换为低维数组
const arr = [1,2,3,4,[5,6]];
console.log( arr.flat() );    // [1,2,3,4,5,6] 
const arr = [1,2,3,4,[5,6,[7,8,9]]];
console.log( arr.flat(2) );    // flat(深度)
// flatMap 
const arr = [1,2,3,4];
const result = arr.flatMap(item => item*10)
cosnole.log(result);    // [10,20,30,40]

 

· ES10 Symbol.prototype.description