精华内容
下载资源
问答
  • js合并数组
    2022-04-05 14:46:11

    合并三个数组

    <script>
    var parents = ["Jani", "Tove"];
    var brothers = ["Stale", "Kai Jim", "Borge"];
    var children = ["Cecilie", "Lone"];
    var family = parents.concat(brothers, children);
    document.write(family);
    </script>

    合并两个数组

    <script>
    var hege = ["Cecilie", "Lone"];
    var stale = ["Emil", "Tobias", "Linus"];
    var children = hege.concat(stale);
    document.write(children);
    </script>

    有多个数组a, b, c,需求是将多个数组合并成一个:

    let a = [1, 2, 3];
    let b = [4, 5, 6];
    let c = [7, 8, 9];

    1. concat()

    合并多个数组,不影响原数组(会造成内存浪费),不能处理嵌套数组。

    const r = a.concat(b); 
    a; // [1, 2, 3]
    b; // [4, 5, 6]
    r; // [1, 2, 3, 4, 5, 6]

    如果 a 数组有10000个元素, b 数组也有有10000个元素, 那么数组r就有20000个元素, 这种方式占用了2倍的内存。a = b = null;就会被垃圾回收机制回收。

    2. 基于for循环 - push()

    没有concat的内存浪费,看上去土而且不好维护, 只能合并两个数组,会改变原数组,不能处理嵌套数组。

    for(let i in b) {
      a.push(b[i]);
    }
    a; // [1, 2, 3, 4, 5, 6]
    b; // [4, 5, 6]

    3. apply

    简洁高效,能实现多个数组合并, 会改变原数组, 并且能够实现深度嵌套。

    a.push.apply(a, b);
    a; // [1, 2, 3, 4, 5, 6]
    b; // [4, 5, 6]

    4. 更优美的push

    多个数组合并, 会改变原数组, 效率比较高

    // es6
    a.push(...b, ...c)
    a; // [1, 2, 3, 4, 5, 6]
    b; // [4, 5, 6]
    c; // [7, 8, 9];
    更多相关内容
  • JS 合并数组的三大方式

    千次阅读 2021-04-27 08:16:58
    在这篇文章中,你会发现在JavaScript合并数组的3种方法:2种不可变的(合并后创建一个新数组)和1种可变的(合并到一个数组中)。 1. 数组的不可变合并 1.1使用扩展操作符进行合并 如果您想知道一种在JavaScript合并...

    在这里插入图片描述

    数组是表示索引项的有序集合的数据结构。

    对多个数组执行的一个常见操作是合并——将2个或多个数组合并成包含合并数组的所有项的更大数组。

    例如,有两个数组[1,2]和[5,6],然后合并这些数组得到[1,2,5,6]。

    在这篇文章中,你会发现在JavaScript中合并数组的3种方法:2种不可变的(合并后创建一个新数组)和1种可变的(合并到一个数组中)。

    1. 数组的不可变合并

    1.1使用扩展操作符进行合并

    如果您想知道一种在JavaScript中合并数组的好方法,那么请记住使用扩展操作符进行合并。

    在数组字面量中写入两个或更多带有扩展操作符前缀的数组,JavaScript将创建一个合并所有这些数组的新数组:

    const mergeResult = [...array1, ...array2];
    

    例如,让我们合并两个数组heroes和villains:

    const heroes = ['Batman', 'Superman'];
    const villains = ['Joker', 'Bane'];
    
    const all = [...heroes, ...villains];
    
    console.info(all); // ['Batman', 'Superman', 'Joker', 'Bane']
    

    const all = [...heros, ...villains] 创建一个合并了heroes和villains数组的新数组。

    数组字面量中合并数组的顺序很重要:合并数组中的项按照数组在字面量中出现的顺序插入。

    例如,让我们在合并的数组中把villains列表放在heroes列表之前:

    const heroes = ['Batman', 'Superman'];
    const villains = ['Joker', 'Bane'];
    
    const all = [...villains,  ...heroes];
    
    all; // ['Joker', 'Bane', 'Batman', 'Superman']
    

    扩展操作符方法允许同时合并2个甚至更多数组:

    const mergeResult = [...array1, ...array2, ...array3, ...arrayN];
    

    1.2使用array.concat()方法进行合并

    如果你喜欢用函数方式合并数组,那么你可以使用array1.concat(array2)方法:

    const mergeResult = array1.concat(array2);
    

    或者使用另一种形式:

    const mergeResult = [].concat(array1, array2);
    

    array.concat()方法不会改变调用它的数组,而是返回一个具有合并结果的新数组。例如:

    const heroes = ['Batman', 'Superman'];
    const villains = ['Joker', 'Bane'];
    
    const all1 = heroes.concat(villains);
    const all2 = [].concat(heroes, villains);
    
    all1; // ['Batman', 'Superman', 'Joker', 'Bane']
    all2; // ['Batman', 'Superman', 'Joker', 'Bane']
    

    heroes.concat(villains)[].Concat (heroes, villains)返回一个新数组,其中heroes和villains数组被合并。

    concat方法接受多个数组作为参数,因此你可以一次合并2个或多个数组:

    const mergeResult = [].concat(array1, array2, array3, arrayN);
    

    2. 数组的可变合并

    使用扩展操作符或array.concat()执行的合并将创建一个新数组。但是,有时不想创建一个新数组,而是想将它合并到一些现有的数组中

    下面的方法执行一种可变的合并方法。

    2.1使用array.push()方法进行合并

    你可能已经知道array.push(item)方法将一个项压入到数组的末尾,改变了调用该方法的数组:

    const heroes = ['Batman'];
    
    heroes.push('Superman');
    
    heroes; // ['Batman', 'Superman']
    

    多亏了这个array.push (item1,item2,…, itemN)接受多个项来推入,你可以使用应用于参数的扩展操作符(换句话说,执行合并)来推入整个数组:

    array1.push(...array2);
    

    例如,让我们将villains合并到heroes数组中:

    const heroes = ['Batman', 'Superman'];
    const villains = ['Joker', 'Bane'];
    
    heroes.push(...villains);
    
    heroes; // ['Batman', 'Superman', 'Joker', 'Bane']
    

    heroes.push(…villains)将villains数组中的所有元素推到heroes数组的末尾——执行一个可变的合并操作。heroes数组发生了变化。

    总结

    JavaScript提供了多种合并数组的方法。

    可以使用扩展操作符[…]array1,……Array2],或函数方式[].Concat (array1, array2)合并2个或多个数组。这些方法是不可变的,因为合并结果存储在一个新数组中。

    如果你想执行可变合并,即合并到一个数组而不创建一个新数组,那么你可以使用array1.push(…array2)方法。

    展开全文
  • 合并两个或多个数组。此方法不会更改现有数组,而是返回一个新数组。 实质上是一个浅拷贝,将原始数组复制一个副本到新数组中。 let a = [1, 2, 3]; let b = [fun, hello, ok]; let c =a.concat(b); console.log(c);...
  • JS合并数组与合并对象

    千次阅读 2021-04-08 12:41:22
    会改变原数组,如果不想改变原数组需要生成一个新数组 let a = [1, 2, 3]; let b = [4, 5]; //1 for循环 for (var i in b) { a.push(b[i]); } console.log(a); //[1,2,3,4,5] 2、concat() concat() 方法...

     

    目录

     

    一、对象合并

    1、Object.assign(target, ...sources)

    二、数组合并

    1、for循环

    2、concat()

    3、apply

    4、es6扩展运算符[…arr, …arr2]

    5、push(...arr)

     


    一、对象合并

    1、Object.assign(target, ...sources)

    Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象分配到目标对象,它将返回目标对象

    1、源对象属性替换目标对象属性

    2、同名属性,后面替换前面属性

    3、基本数据类型字符串生成对象

        let obj = { a: 1, b: 2, c: 3 }
        let obj2 = { b: 5, d: 6 }
        let res = Object.assign(obj, obj2)
        console.log(res);//{a: 1, b: 5, c: 3, d: 6}

    二、数组合并

    1、for循环

    会改变原数组,如果不想改变原数组需要生成一个新数组

        let a = [1, 2, 3];
        let b = [4, 5];
    
        //1 for循环
        for (var i in b) {
            a.push(b[i]);
        }
        console.log(a); //[1,2,3,4,5]

    2、concat()

    concat() 方法用于连接两个或多个数组,该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本

        let a = [1, 2, 3];
        let b = [4, 5];
        let c = a.concat(b);
        console.log(c);//[1,2,3,4,5]
        console.log(a);//[1,2,3] 原数组不变

    3、apply

        let a = [1, 2, 3];
        let b = [4, 5];
        let c = a.push.apply(a, b);
        console.log(a); //[1,2,3,4,5]

    4、es6扩展运算符[…arr, …arr2]

    扩展运算符(…)也可以将某些数据结构转为数组

        let a = [1, 2, 3];
        let b = [4, 5];
        let arr1 = [...a, ...b]
        console.log(arr1)

    5、push(...arr)

        let a = [1, 2, 3];
        let b = [4, 5];
        let c = a.push(...b)
        console.log(a)

     

    展开全文
  • 将图片左侧数据处理成右侧数据 ps: 顺带说下数据结构 直接看代码 这边封装成了一个函数 ... // 最终返回数组 for (let item of arr) { if (arrWarp.includes(item.classId) == false) { let obj =

    将图片左侧数据处理成右侧数据
    在这里插入图片描述

    ps: 顺带说下数据结构
    在这里插入图片描述

    直接看代码 这边封装成了一个函数 根据自己需求调整相应的字段

    			function resetArr(arr) {
    				// arrWarp 用于存放唯一Id result 最终返回数组
    				let arrWarp = [],result = [];
    				// 最终返回数组
    				for (let item of arr) {
    					if (!arrWarp.includes(item.classId)) {
    						let obj = {
    							className: item.name,
    							classId: item.classId,
    							classList: []
    							// classList 存放相同Id下的数据
    						}
    						obj.classList.push(item);
    						result.push(obj);
    						arrWarp.push(item.classId);
    					} else {
    						result[arrWarp.indexOf(item.classId)].classList.push(item);
    					};
    				};
    				return result;
    			}
    
    let arr = [{name:'班级1',class:'数学',classId:1},{name:'班级1',class:'美术',classId:1},{name:'班级1',class:'生物',classId:1},
              {name:'班级2',class:'数学',classId:2},{name:'班级2',class:'体育',classId:2},{name:'班级3',class:'数学',classId:3}]
    	console.log(arr)
    	console.log(resetArr(arr))
    

    最后打印输出 console.log(resetArr(arr)) 就是上方处理后的数据结构了

    展开全文
  • js合并数组相同key值的项
  • 主要介绍了JS合并数组的几种方法及优劣比较,本文讲解了concat、循环插入、reduce等方法合并数组,并对它们的优劣做了比较,需要的朋友可以参考下
  • js合并数组的方法大全

    千次阅读 2021-05-16 13:53:56
    本期,主要总结了一些关于数组合并的方法,有传统的js合并数组的方法,也有ES6合并数组的方法. //先声明两个数组 var a = [ 1, 2, 3, 4 ]; var b = [ 7, 8, 9 ]; 1.concat // 该方法可合并多个数组,原数组将...
  • js合并数组的方法

    千次阅读 2019-04-11 22:29:30
    js数组合并
  • //新数组 for (let i = 0; i ; i++) { if (tempArr.indexOf(beforeData[i].id) === -1) { afterData.push({ id: beforeData[i].id, score: beforeData[i].score, name: [beforeData[i].name], }); tempArr.push...
  • //合并数组对象,相同key键的某一项数组求和 //arr:数组,judgeKey:判断的键,mergeKey:求和的键 function compare(arr,judgeKey,mergeKey){ let result=[]; arr.forEach(item=>{ let index=-1; result.forEach(...
  • 数组重组数据 源数据: 目标数据: // 源数据 var oldData = [ { city_id: 1, city_name: '北京', city_img: "http://dfknbdjknvkjsfnvlkjdn.png", city_country: "中国" }, { city_id: 2, city_name: '...
  • 主要介绍了JavaScript合并两个数组并去除重复项的方法,涉及javascript操作数组的合并与去重的相关技巧,需要的朋友可以参考下
  • JS合并数组并排列

    2019-07-23 16:43:07
    请把两个数组 ['A1', 'A2', 'B1', 'B2', 'C1', 'C2', 'D1', 'D2'] 和 ['A', 'B', 'C', 'D'],合并为 ['A1', 'A2', 'A', 'B1', 'B2', 'B', 'C1', 'C2', 'C', 'D1', 'D2', 'D']。 let arr1 = ["A1", "A2", "B1", ...
  • 自己编写的一个数组对象合并的方法!
  • 前端开发:JavaScript合并数组的方法

    千次阅读 2021-11-15 23:11:08
    前言 在前端开发的时候,对于数据处理是很重要的一块,尤其是要根据实际的业务需求来处理数据,有很强的兼容性要求。...在JavaScript合并两个数组的方法有4种,每一种方法都大同小异,为的就是对两个数
  • let list=[ { id:11, name:'apple', num:2 }, { id:11, name:'apple', num:3 }, { id:22, name:'pig', num:2 }, { id:11, name:'apple', num:2 }, ] list = list.reduce((obj, item) =&... let f.
  • 主要介绍了JavaScript如何把两个数组对象合并过程解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
  • 1、js数组对象去重复并合并数值 <script> var arrs = [ {"id": "1","name": "张三","value": "1245"}, {"id": "1","name": "张三","value": "1360"}, {"id": "2","name": "李四","value": "1120"}, ...
  • js当中如何合并数组

    2020-02-24 20:31:56
    js中的Array对象提供了一个叫 concat() 方法,连接两个或更多的数组,并返回结果 var arr1 = [1,2,3] var arr2 = [5,6,8] var arr3 = arr1.concat(arr2) console.log(arr3)// [1,2,3,5,6,8] 这个concat方法连接两...
  • concatjs的Array对象提供了一个叫concat()方法,连接两个或更多的数组,并返回结果。var c = a.concat(b);//c=[1,2,3,4,5,6];这里有一个问题,concat方法连接a、b两个数组后,a、b两个数组的数据不变,同时会返回一...
  • 语法 参数 描述 prevValue 必需。上一个值, 或者计算结束后的返回值。 currentValue 必需。当前元素 currentIndex 可选。当前元素的索引 arr 可选。当前元素所属的数组对象。...示例:合并数组...
  • js代码-js concat 数组合并 数组连接
  • js代码-根据key相同合并对象,放进新的数组
  • 数组里某个属性相同的对象合并成一个数组数组如下 let resData = [ { "name": "住院医疗最高报销", "tagName": "医疗", "insuredAmount": "6000" }, { "name": "身故赔付", "tagName": "...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 85,163
精华内容 34,065
关键字:

js合并数组