如何在jQuery中扁平化数组？

Question

如何在jQuery中简单地展平数组？我有：

[1, 2, [3, 4], [5, 6], 7]

我想要：

[1, 2, 3, 4, 5, 6, 7]

- extern.fx

Answer 1

你可以使用jQuery.map，如果你已经加载了jQuery库的话，这是一个很好的选择。

$.map( [1, 2, [3, 4], [5, 6], 7], function(n){
   return n;
});

返回

[1, 2, 3, 4, 5, 6, 7]

- MarioRicalde

---

当然，这正是问题中所表述的方式，但这只会将一个层次压平。 - phil

对于那些想知道这是如何工作的人：与 Array.prototype.map 不同，jQuery 的 map 对从回调函数返回的数组有特殊处理：_【回调】函数可以返回任何值。返回的数组将被展平到结果数组中_。 - Nickolay

Answer 2

利用JavaScript的威力：

var a = [[1, 2], 3, [4, 5]];

console.log( Array.prototype.concat.apply([], a) );
//will output [1, 2, 3, 4, 5]

- bjornd

---

如果您只有嵌套一层的数组，那么这个方法可以生效。但是如果您有一个数组内嵌在另一个数组中，再嵌套在另一个数组中，它将无法被展平。 - dnuttle

@dnuttle 当然可以，但这个条件在问题中并没有被说明。 - bjornd

请问您能解释一下 apply([], a) 这段代码的含义吗？ :) - Sebastian Patten

Answer 3

这里是使用jQuery将深度嵌套的数组扁平化的方法:

$.map([1, 2, [3, 4], [5, [6, [7, 8]]]], function recurs(n) {
    return ($.isArray(n) ? $.map(n, recurs): n);
});

返回：

[1, 2, 3, 4, 5, 6, 7, 8]

利用jQuery.map和jQuery.isArray。

- Xavi

Answer 4

var a = [1, 2, [3, 4], [5, [6, [7, 8]]]];
var b = [];

function flatten(e,b){
    if(typeof e.length != "undefined")
    {
        for (var i=0;i<e.length;i++)
        {
            flatten(e[i],b);
        }
    }
    else
    {
        b.push(e);
    }
}
flatten(a,b);
console.log(b);

使用flatten函数即可，无需jQuery。只需将以下代码复制到Firebug中并运行。

- dnuttle

---

我应该补充说明，这将使不仅是数组，而是任何具有“length”方法的东西变平。在Javascript中，除非声明为new Array()，否则无法确定某些东西是否为真正的数组。 - dnuttle

dnuttle: 其实，我认为使用 obj instanceof Array 是非常可靠的。（除非有另一个名为 Array 的变量，那么你可以使用 obj instanceof [].constructor） - user216441

嗯，你说得对。我本来以为我之前试过了，但没成功。 - dnuttle

dnuttle：这个答案讨论了它：https://dev59.com/I3NA5IYBdhLWcg3wL6yx#1058753 看起来我的方法存在问题 :( - user216441

你可以随时使用 $.isArray。纯JS很棒，但库也很好用 =]。 - Xavi

如果你的解释清楚易懂，请点赞支持。其他使用 $.map 或 Array.prototype.concat.apply([], arr) 的答案非常聪明，但如果其他人查看代码可能无法理解正在发生什么。 - Jai

Answer 5

要递归地展开一个数组，您可以使用原生的Array.reduce函数。这不需要使用jQuery。

function flatten(arr) {
    return arr.reduce(function flatten(res, a) { 
        Array.isArray(a) ? a.reduce(flatten, res) : res.push(a);
        return res;
    }, []);
}

执行中

flatten([1, 2, [3, 4, [5, 6]]])

返回结果

[ 1, 2, 3, 4, 5, 6 ]

- Fabian Jakobs

---

值得注意的是，它可以工作，但仅适用于现代浏览器（除非进行 shim 处理）。 - Brett Zamir

Answer 6

你可以使用jQuery.map()：

callback( value, indexOrKey )是用来处理每个项目的函数。该函数的第一个参数是值；第二个参数是数组或对象属性的索引或键。该函数可以返回任何值以添加到数组中。返回的数组将被展平为结果数组。在函数内部，this指向全局（window）对象。

- Sarfraz

Answer 7

如果你有多个层级，请使用递归。

flaten = function(flatened, arr) {
    for(var i=0;i<arr.length;i++) {
        if (typeof arr[i]!="object") {
            flatened.push(arr[i]);
        }
        else {
            flaten(flatened,arr[i]);
        }
    }
    return;
}

a=[1,[4,2],[2,7,[6,4]],3];
b=[];
flaten(b,a);
console.log(b);

- Mr Boss

Answer 8

你可以使用Array.prototype.reduce，它在技术上不是jQuery，但是是有效的ES5：

var multidimensionArray = [1, 2, [3, 4], [5, 6], 7];
var initialValue = [];

var flattened = multidimensionArray.reduce(function(accumulator, current) {
    return accumulator.concat(current);
}, initialValue);

console.log(flattened);

- Elise Chant

Answer 9

虽然这是一个老问题，但是...

我发现这个方法可行且速度快：

function flatten (arr) {
  b = Array.prototype.concat.apply([], arr);
  if (b.length != arr.length) {
    b = flatten(b);
  };

  return b;
}

- phil

Answer 10

你需要 arr.flat([depth])

var arr1 = [1, 2, [3, 4]];
arr1.flat(); 
// [1, 2, 3, 4]

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

var arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2);
// [1, 2, 3, 4, 5, 6]

- Eugen Konkov