flag
- flat() 方法会按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回
- 语法：
let newArr = arr.flat([depth])
- depth 指定要提取嵌套数组的结构深度，默认值为 1。使用 Infinity，可展开任意深度的嵌套数组
const arr1 = [1, 2, 3, [4, 5, 6]];
console.log(arr1.flat()); // [ 1, 2, 3, 4, 5, 6 ]
const arr2 = [1, 2, 3, [[[4, 5, 6]]]];
console.log(arr2.flat()); // [1, 2, 3, [[4, 5, 6]]]
console.log(arr2.flat(2)); // [1, 2, 3, [4, 5, 6]]
console.log(arr2.flat(3)); // [1, 2, 3, 4, 5, 6]
let arr3 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
console.log(arr3.flat(Infinity)) // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
flat() 方法会移除数组中的空项
const arr4 = [1,2,,3,4]
console.log(arr4) // [ 1, 2, <1 empty item>, 3, 4 ]
console.log(arr4.flat()) // [ 1, 2, 3, 4 ]
flagMap
- flatMap() 方法首先使用映射函数映射每个元素，然后将结果压缩成一个新数组。
- 它与 map 连着深度值为1的 flat 几乎相同，但 flatMap 通常在合并成一种方法的效率稍微高一些。
const newArr = arr.flatMap(item => item)
//相当于下面：
const newArr = arr.map(item => item).flat()
- 返回值：一个新的数组，其中每个元素都是回调函数的结果，并且结构深度 depth 值为1。
const arr = [1, 2, [3, 4], [5, [6]]];
const newArr1 = arr.map((item) => item);
const newArr2 = arr.flatMap((item) => item);
console.log(newArr1); // [1, 2, [3, 4], [5, [6]]]
console.log(newArr2); // [1, 2, 3, 4, 5, [6]]
const arr1 = ["it's Sunny in", "", "California"];
const newArr3 = arr1.map((item) => item.split(" "));
console.log(newArr3); // [ [ "it's", 'Sunny', 'in' ], [ '' ], [ 'California' ] ]
const newArr4 = arr1.flatMap((item) => item.split(" "));
console.log(newArr4); // [ "it's", 'Sunny', 'in', '', 'California' ]
flatMap可以用于在一个 map() 期间增加或去除一些项
//如下，想在3和4之前添加一个字符串'aaa',并且删除数字6
const arr2 = [1, 2, 3, 4, 5, 6, 7];
const newArr5 = arr2.flatMap((item) => {
let res = item;
if (item === 3) {
res = [item, "aaa"];
}
if (item === 6) {
res = [];
}
return res;
});
console.log(newArr5); //[1, 2, 3, "aaa", 4, 5, 7];
Object.fromEntries
- Object.fromEntries() 方法把键值对列表转换为一个对象
把[['name', 'why'], ['age', 18]]转换为对象{name: 'why', age: 18}
const map = new Map([
["name", "why"],
["age", 18],
]);
console.log(map); // Map(2) { 'name' => 'why', 'age' => 18 }
const obj = Object.fromEntries(map);
console.log(obj); // { name: 'why', age: 18 }
把对象{name: 'why', age: 18}转换为[['name', 'why'], ['age', 18]]
const entries = Object.entries({ name: "why", age: 18 });
console.log(entries); // [ [ 'name', 'why' ], [ 'age', 18 ] ]
把name=why&age=18转换为对象
const params = new URLSearchParams("name=why&age=18");
console.log(params); // URLSearchParams { 'name' => 'why', 'age' => '18' }
const obj1 = Object.fromEntries(params);
console.log(obj1); //{ name: 'why', age: '18' }
trimStart和trimEnd
- ES10之前，可以使用trim方法去除字符串头部和尾部空格
- ES10新增了trimStart和trimEnd
- trimStart 去除字符串头部空格
- trimEnd 去除字符串尾部空格
const message = " hello world ";
console.log(message.length); //15
console.log(message.trim(), message.trim().length); //hello world 11
console.log(message.trimStart(), message.trimStart().length); //hello world 12
console.log(message.trimEnd(), message.trimEnd().length); // hello world 14
非常感谢王红元老师的深入JavaScript高级语法让我学习到很多 JavaScript 的知识
