JavaScript学习笔记--ES2019

142 阅读2分钟

Array.protorype.flat(levelNum)

可指定深度递归遍历数组,将遍历到的子数组中的元素拼接到已有元素,最后返回一个新数组

let arr=[1,2,[3,4]]
arr=arr.flat();     //默认levelNum=1 返回[1,2,3,4]

let arr2=[1,2,[3,4,[5,6]]];
arr2=arr2.flat();    //返回[1,2,3,4,[5,6]]
arr2=arr2.flat(2);   //返回[1,2,3,4,5,6]

//使用Infinity作为深度,展开任意深度的嵌套数组
arr2=arr2.flat(Infinity);   //返回[1,2,3,4,5,6]

flat()方法可以移除空项

var arr4 = [1, 2, , 4, 5];
arr4=arr4.flat(); // [1, 2, 4, 5]

通过reduce和concat和递归实现flat方法

function flatten(arr){
    arr=[...arr];   //转为数组,防止传入的不是数组
    return arr.reduce((pre,next)=>{
        return pre.concat(Array.isArray(next)? flatten(next):next)
    },[])
}
var arr1 = [1,2,3,[1,2,3,4, [2,3,4]]];
console.log(flatten(arr1));     //[1, 2, 3, 1, 2, 3, 4, 2, 3, 4]

不使用递归

function flatten2(arr){
    arr=[...arr];
    let res=[];
    while(arr.length){
        let val=arr.shift();
        if(Array.isArray(val)){
            arr.unshift(...val);
        }else{
            res.push(val);
        }
    }
    return res;
}
var arr1 = [1,2,3,[1,2,3,4, [2,3,4]]];
console.log(flatten2(arr1));     //[1, 2, 3, 1, 2, 3, 4, 2, 3, 4]

数组转成字符串再转回数组

function flatten3(arr){
    arr=[...arr];
    let str=arr.toString(); //"1,2,3,4,5,6"
    arr=str.split(",")      //["1", "2", "3", "4", "5", "6"]
}
flatten3([1,2,[3,4,[5,6]]])

//但是这样得到的是字符串的数组,对于是number类型的数组则会被改变
//改造
function flatten4(arr){
    arr=[...arr];
    let str=arr.toString(); //"1,2,3,4,5,6"
    arr=str.split(",")      //["1", "2", "3", "4", "5", "6"]
    arr=arr.map(item=>+item)    //使用+item 将字符串转为number类型
}

Array.prototype.flatMap()

flatMap方法先用映射方法map映射每个元素,然后将结果压缩成一个新数组,相当于使用map()函数映射+flat(1)

//map方法的使用
let arr=[1,2,3];
let arr2=arr.map(v=>{
   return v*2;  //也可省略花括号和return
})
console.log(arr2);  //[2,4,6]

//map方法与flatMap方法的区别
let arr3=arr.map(v=> [v*2])
console.log(arr3);  //[[2],[4],[6]]

let arr4=arr.flatMap(v=>[v*2])
console.log(arr4);  //[2,4,6]   会将数组压平一层,相当于再调用flat方法

flatMap方法用处

let arr = ["今天天气不错", "", "早上好"]
let arr1=arr.map(v=>v.split(''));
console.log(arr1);  //[["今", "天", "天", "气", "不", "错"],[""],["早", "上", "好"]]

let arr2=arr.flatMap(v=>v.split(""))
console.log(arr2);  // ["今", "天", "天", "气", "不", "错", "早", "上", "好"]
//既将每个字都拆分数组的一个元素,也不包含空字符

//可以使用reduce和concat实现相同的功能
let arr3=arr.reduce((pre,next)=>{
    return pre.concat(next.split(''))
},[])

String.prototype.trimStart()和String.prototype.trimEnd()

移除字符串左/右端连续的空白符,并将新字符串返回,不会修改原字符串

trim()移除的是两端的空白符

Object.fromEntries

将键值对数组转为对象,与Object.entries()相反,Object.Entries()是将对象的键值对转为数组的元素

const obj1 = { a: 1, b: 2, c: 3 };
let arr=Object.entries(obj1);   //[['a',1],['b',2],['c',3]] 注意每一个键值对包含在一个数组里,以逗号隔开。Object.entries()的e是小写
let obj=Object.fromEntries(arr);    //{ a: 1, b: 2, c: 3 }