美文网首页js
JS 数组扁平化(多维转一维)

JS 数组扁平化(多维转一维)

作者: Cherry丶小丸子 | 来源:发表于2021-09-07 15:47 被阅读0次
方法一:普通的递归
const arr = [1, [2, [3, [4, 5]]]];
const flatten = (arr) => {
    let result = [];
    for (let i = 0; i < arr.length; i++) {
        if (Array.isArray(arr[i])) {
            result = result.concat(flatten(arr[i]));
        } else {
            result.push(arr[i]);
        }
    }
    return result;
};
console.log(flatten(arr)); // [0, 1, 2, 3, 4, 5]
方法二:利用 reduce 函数迭代
// 利用 es5 的 arr.reduce(callback[, initialValue]) 实现

let arr = [[0, 1], [2, 3], [4, [5, 6, 7]]]
const flatten = (arr) => {
    return arr.reduce((pre, cur) => {
        return pre.concat(Array.isArray(cur) ? flatten(cur) : cur)
    }, []);
};
console.log(flatten(arr)); // [0, 1, 2, 3, 4, 5, 6, 7]


// 指定维数进行扁平
const arr = [1, 2, 3, 4, [5, 6, 7, [8, 9, 10, [11, 12, 13]]], 14, 'string', { name: '张铁蛋同学' }];
const flatten = (arr, num = 1) => {
    return arr.reduce((pre, cur) => {
        return pre.concat(Array.isArray(cur) ? flatten(cur, num - 1) : cur);
    }, []);
};
console.log(flatten(arr, 2)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, Array(3), 14, 'string', {…}] 
方法三:利用扩展运算符和 map
let arr = [[1, 2], 3, [[[4], 5]]]
const flatten = (arr) => {
    return [].concat(...arr.map(x => Array.isArray(x) ? flatten(x) : x))
}
console.log(flatten(arr)) // [1, 2, 3, 4, 5]
方法四:利用 while 和 some 和 扩展运算符
let arr = [[1, 2], 3, [[[4], 5]]]
const flatten = (arr) => {
    while(arr.some(item =>  Array.isArray(item))){
        arr = [].concat(...arr);
    }
    return arr;
};
console.log(flatten(arr)); // [1, 2, 3, 4, 5]
方法五:split 和 toString 共同处理,但结果会变成字符串
let arr = [[1, 2], 3, [[[4], 5]]]
const flatten = (arr) => {
    return arr.toString().split(',')
};
console.log(flatten(arr)); // ['1', '2', '3', '4', '5']
方法六:利用 ES 的最新语法,Array.prototype.flat(),缺点是有兼容性问题,优点是非常简单
flat() 方法会递归到指定深度将所有子数组连接,并返回一个新数组。
语法:`let newArray = arr.flat(depth)`,参数说明:depth,可选,指定嵌套数组中的结构深度,默认值为1。

const arr = [1, [2, [3, [4, 5]]]];
const flatten = (arr) => {
    return arr.flat(Infinity)
};
console.log(flatten(arr)); // [1, 2, 3, 4, 5]

特殊说明:flat()方法会移除数组中的空项,但 undefined、null 仍会保留
let arr = [1, 2, , undefined, 4, 5, null];
arr.flat(); // [1, 2, undefined , 4, 5, null]
二维转一维
第一种

let arr = [[0, 1], [2, 3], [4, 5]];
let arr1 = [].concat.apply([], arr);
console.log(arr1) // [0, 1, 2, 3, 4, 5]



第二种
let arr = [[0, 1], [2, 3], [4, 5]];
let arr1 = arr.reduce((a, b) => a.concat(b));
console.log(arr1) // [0, 1, 2, 3, 4, 5]

相关文章

  • Array, Object扁平化

    1. 数组扁平化 数组扁平化就是将多维数组转化为一维数组: 1.1 toString + split 先将数组转化...

  • 5种方式实现数组扁平化

    5种方式实现数组扁平化 数组扁平化概念 数组扁平化是指将一个多维数组变为一维数组 实现 1. reduce 遍历数...

  • 数组扁平化

    数组扁平化的概念 数组扁平化是指将一个多维数组变为一维数组 [1, [2, 3, [4, 5]]] ------...

  • JavaScript之数组扁平化

    前言 所谓的数组扁平化指将多维度的数组转换为以为数组。 正文

  • js数组扁平化和数组去重处理(对比)

    数组扁平化(多维数组)(es6) 数组去重 (es6) 数组去重(es5)

  • JS 将多维数组扁平化

    原始数据 目标数据 方法一 方法二 方法三

  • 5种方式实现数组扁平化

    数组扁平化概念 数组扁平化是指将一个多维数组变为一维数组 实现 1. reduce 遍历数组每一项,若值为数组则递...

  • 数组扁平化

    数组扁平化概念 数组扁平化是指将一个多维数组变为一维数组 实现 1. reduce 遍历数组每一项,若值为数组则递...

  • js小算法

    1、数组扁平化 数组扁平化是指将一个多维数组变为一个一维数组 方法1:使用flat() 方法2:利用正则,但数据类...

  • JS 数组扁平化的5种方式

    什么是数组扁平化 数组扁平化是指将一个多维数组变为一维数组 数据准备 实现方法一 实现方法二 实现方法三 实现方法...

网友评论

    本文标题:JS 数组扁平化(多维转一维)

    本文链接:https://www.haomeiwen.com/subject/mrfvwltx.html