ES10(2019)基础知识

166 阅读1分钟

ES7~ES10.png 各大浏览器、平台支持ES的情况

image.png

ES10

原型对象的能力进行了增强

image.png

Symbol.prototype.description

description 是一个只读属性,它会返回 Symbol 对象的可选描述的字符串。

console.log(Symbol('desc').description);
// "desc"

console.log(Symbol.iterator.description);
// "Symbol.iterator"

console.log(Symbol.for('foo').description);
//  "foo"

console.log(`${Symbol('foo').description}bar`);
// "foobar"

JSON.stringify

能力升级。ES10之前的bug:超出一定的范围的Unicode的展示错误 0xD800-0xDFFF

console.log(JSON.stringify('\u{D800}')); // \ud800  转义输出

Array.flat

可指定的深度去扁平化

let arr = [1, [2, 3], [4, 5, [6, 7]]]
console.log(arr.flat());
console.log(arr.flat(1));
console.log(arr.flat(2));

image.png

Array.flatMap

var arr1 = [1, 2, 3, 4];

arr1.map(x => [x * 2]);
// [[2], [4], [6], [8]]

arr1.flatMap(x => [x * 2]);
// [2, 4, 6, 8]

// only one level is flattened
arr1.flatMap(x => [[x * 2]]);
// [[2], [4], [6], [8]]

trimStart

从字符串的开头删除空格。trimLeft() 是此方法的别名。

let str = '  foo  '
// console.log(str.replace(/^\s+|\s$/g, '__'));
// console.log(str.replace(/^\s+|\s$/g, ''));

console.log(str.trimStart());

trimEnd

从一个字符串的末端移除空白字符。trimRight() 是这个方法的别名.

let str = '  foo  '
// console.log(str.replace(/^\s+|\s$/g, '__'));
// console.log(str.replace(/^\s+|\s$/g, ''));

console.log(str.trimEnd());

Object.fromEntries

const arr = [['foo', 1], ['bar', 2]]
const obj = Object.fromEntries(arr)
console.log(obj);
console.log(obj.bar);

image.png

const obj = {
    abc: 1,
    def: 3,
    ghkkjf: 5
}
console.log(Object.entries(obj));
let res = Object.fromEntries(
    Object.entries(obj).filter(([key, val]) => key.length === 3)
)
console.log(res);

image.png

try...catch的加强

try {
    // 
} catch (e) { // 之前不允许省略 (e)
    
}

正则中matchAll(草案)

matchAll

返回一个包含所有匹配正则表达式的结果及分组捕获组的迭代器。

let str = `"foo" and "bar" and "baz"`
// exec
function select (regExp, str) {
    const matches = []
    while(true) {
        const match = regExp.exec(str)
        if (match === null) break
        matches.push(match[1])
    }
    return matches
}
console.log(select(/"([^"]*)"/g, str));
let str = `"foo" and "bar" and "baz"`
console.log(str.match(/"([^"]*)"/g)); // ['"foo"', '"bar"', '"baz"']
let str = `"foo" and "bar" and "baz"`
function select (regExp, str) {
    const matches = []
    str.replace(regExp, function (all, first) {
        matches.push(first)
    })
    return matches
}
console.log(select(/"([^"]*)"/g, str)); // ['foo', 'bar', 'baz']
let str = `"foo" and "bar" and "baz"`
function select (regExp, str) {
    const matches = []
    for (const match of str.matchAll(regExp)) {
        matches.push(match[1])
    }
    return matches
}
console.log(select(/"([^"]*)"/g, str));

BigInt(草案)

可以处理大于 2^53的数字。数据后面加n

const a = 11n; // eslint会报错,因为还不支持

image.png

练习

image.png