Includes(es7)
判断一个数组或者字符串中是否包含某个元素,包含则返回 true,否则返回false。(在es7之前,可以用indexOf判断,不存在返回-1)
const arr = ['a', 'b', 'c']
console.log(arr.includes('a')); // true
console.log(arr.includes('d')); // false
const str = 'abc'
console.log(str.includes('a')); // true
console.log(str.includes('d')); // false
指数(乘方) 运算符 **(es7)
在ES7之前,计算数字的乘方需要通过 Math.pow 方法来完成,在ES7中,增加了 ** 运算符,可以对数字来计算乘方。
const res1 = Math.pow(2, 2)
const res2 = 2 ** 2 // es7
console.log(res1); // 4
console.log(res2); // 4
Object values 和 Object entries(es8)
这es5中有个Object.keys方法,可以获取一个对象所有的key
Object values获取所有的value值
Object.entries 可以获取到一个数组,数组中会存放可枚举属性的键值对数组
Object.formEntries(es10)
将entries转换成对象
在这里插入代码片
padStart,padEnd(es8)
对字符串的首尾进行填充
const message = 'xt'
// String.padStart(maxLength: number, fillString?: string): string maxLength:总长度
console.log(message.padStart(4,'a')); // aaxt
console.log(message.padEnd(4,'a')); // xtaa
flat,flatMap(es10)
flat():按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回
flatMap() :首先使用映射函数映射每个元素,然后将结果压缩成一个新数组。
const arr = [1, 2, [3, 4,],[[10, 11], [5, 15]], 100]
console.log(arr.flat()); // [ 1, 2, 3, 4, [ 10, 11 ], [ 5, 15 ], 100 ]
console.log(arr.flat(2)); // [ 1, 2, 3, 4, 10, 11, 5, 15, 100 ]
const arr1 = [10, 20, 30]
const newArr1 = arr1.flatMap(item => {
return item + 1
})
console.log(newArr1); // [ 11, 21, 31 ]
const arr2 = ['hello xt', 'my name is xt']
const newArr2 = arr2.flatMap(item => {
return item.split(' ')
})
console.log(newArr2); // [ 'hello', 'xt', 'my', 'name', 'is', 'xt' ]
空值合并操作符 ??(es11)
const val = false
const val1 = 0
const val2 = undefined
const val3 = null
console.log(val || 'xt'); // xt
console.log(val1 || 'xt'); // xt
console.log(val2 || 'xt'); // xt
console.log(val3 || 'xt'); // xt
// ??能更精准的判断类型 只有为undefined与null时才会用后面的值
console.log(val ?? 'xt'); // false
console.log(val1 ?? 'xt'); // 0
console.log(val2 ?? 'xt'); // xt
console.log(val3 ?? 'xt'); // xt
可选链 ?(es11)
代码在进行null和undefined判断时更加清晰和简洁
const obj = {
friend: {
girlFriend: {
name: 'tx'
}
}
}
console.log(obj.friend?.girlFriend?.name); // tx
console.log(obj.friendone?.girlFriend?.name); // undefined
globalThis(es11)
获取JavaScript环境的全局对象,以前不同的环境获取的方式是不一样的,比如在浏览器中可以通过this、window来获取,比如在Node中我们需要通过global来获取,所以在es11中统一了用法:globalThis
console.log(this); // 浏览器上
console.log(global); // node
console.log(globalThis); // 都可以
WeakRefs(es12)
默认将一个对象赋值给另外一个引用,这个引用是一个强引用,如果希望他是一个弱引用,可以使用WeakRef。
let obj = {
name: 'xt'
}
let obj1 = new WeakRef(obj)
console.log(obj1.deref()); // { name: 'xt' }
||= &&= ??=(es12)
let message = ''
// 逻辑或赋值运算
message ||= 'xt' // message = message || xt
console.log(message); // xt
// 逻辑与赋值运算 &&=
let num = 1
const obj = {
num: 3
}
num &&= obj.num // num = num && obj.num
console.log(num); // 3
// 逻辑空赋值运算 ??=
let foo = null
foo ??= 'xt' // foo = foo ?? 'xt'
console.log(foo); // xt