JavaScript学习笔记:数组合并

特别声明:小站对部分原创文章已开启付费阅读,并开通年费VIP通道,年费价格为 ¥365.00元。如果您喜欢小站的内容,可以点击开通会员进行全站阅读。如果您对付费阅读有任何建议或想法,欢迎发送邮件至: airenliao@gmail.com!(^_^)

JavaScript中数组知识点很多,前面学习了一些基础知识。那么今天继续学习数组相关的知识。这篇文章主要是看在JavaScript中如何合并数组。

合并数组是一个相当常见,在实际使用的场景也有不同之处。比如说,我们有两个变量:

arr1 = [1,2];
arr2 = [3,4];

将数组arr1arr2合并成一个数组arr

arr = [1,2,3,4]

另外还有一种方式是将一个复合数组的数组项合并在一起,比如:

var myArray = [[1, 2],[3, 4, 5], [6, 7, 8, 9]];

将数组myArray的数组项合并在一起,变成想要的效果:

arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]

将多个数组合并成一个数组

我们先来考虑下面的这种情况,我们有两个(或多个)数组:

var arr1 = [1,2];
var arr2 = [3,4];

想要的结果是将arr1arr2合并在一起,最终想要的结果是:[1,2,3,4]。实现这样的效果,在JavaScript中有很多种,接下来看看各种实现方法。

Array.prototype.concat()方法

在JavaScript中Array.prototype.concat()方法可以传入的数组或非数组与原数组合并,并组成一个新数组再返回

如此一来就可以这样做:

var arr1 = [1,2];
var arr2 = [3,4];
var arr = arr1.concat(arr2);
console.log(arr); // [1, 2, 3, 4]

将上面的代码封装到一个函数中,比如:

function flatten (arr1, arr2) {
    return arr1.concat(arr2);
}
flatten(arr1,arr2); // [1, 2, 3, 4]

正如你看到的,返回的结果是一个全新的数组,将数组arr1arr2合并在一起,并且arr1arr2不会有任何变化。是不是很简单。

不过这种方法将会有所限制,如果arr1arr2数组元素都很多的话或者说内存有限的系统中经常重复这个过程,它其实还有很多改进的地方。

for循环和Array.prototype.push()方法

其实还可以使用for循环和Array.prototype.push()方法,将一个数组的内容复制到另一个。

function flatten (arr1, arr2) {
    for (var i = 0; i < arr2.length; i++) {
        arr1.push(arr2[i]);
    }
    return arr1;
}

上面的方法将数组arr2中的每个元素复制到数组arr1中。现在数组arr1中有了数组arr2的元素。

有个小细节,如果数组arr1arr2相比,数组arr1中的元素数量小于数组arr2时,出于内存和速度的原因,可以将更小的数组arr1放到数组arr2前面。在JavaScript中只需要将Array.prototype.push()方法换成

剩余80%内容付费后可查看
* 请输入阅读码(忘记阅读码?

如需转载,烦请注明出处:https://www.w3cplus.com/javascript/merge-flatten-an-array-of-arrays-in-javascript.html

如果文章中有不对之处,烦请各位大神拍正。如果你觉得这篇文章对你有所帮助,打个赏,让我有更大的动力去创作。(^_^)。看完了?还不过瘾?点击向作者提问!

赏杯咖啡,鼓励他创作更多优质内容!
返回顶部