JavaScript中concat复制数组方法浅析

我们在需要进行数组复制的时候可能会想到以下的方法

代码

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

var arr2 = [];

arr2 = arr1;

console.log(arr1);

console.log(arr2);

执行结果如下：

[1, 2, 3, 4, 5]

[1, 2, 3, 4, 5]

在这个例子中，将数组arr1赋值给了另一个数组arr2。

查看执行结果，似乎复制了数组的内容并创建了相同的数组。

但是，由于数组是“引用类型”的数据，因此它不会复制该值，而只是共享存储该值的内存的位置。

因此，我们编写以下代码

arr2.push(6);

console.log(arr1);

console.log(arr2);

执行结果如下

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

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

根据以上结果可以发现即使我们只给arr2添加新值6，但是数组arr1中也会添加一个6，这就是因为两个

数组都只引用存储值的位置，如果更改任一数组中的数据，两者都会改变。

所以下面我们就来使用concat方法复制数组

我们来看具体示例

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

var arr2 = [];

arr2 = arr1.concat();

arr2.push(6);

console.log(arr1);

console.log(arr2);

执行结果如下

[1, 2, 3, 4, 5]

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

要将另一个数组复制到数组arr2，只需要在复制源arr1中执行concat()即可。

赞 (0)

相关推荐

  • 浅谈JavaScript的push(),pop(),concat()方法

    push 方法 将新元素添加到一个数组中,并返回数组的新长度值. arrayObj.push([item1 [item2 [. . . [itemN ]]]]) 参数 arrayObj 必选项.一个 Array 对象. item, item2,. . . itemN 可选项.该 Array 的新元素. 说明 push 方法将以新元素出现的顺序添加这些元素.如果参数之一为数组,那么该数组将作为单个元素添加到数组中.如果要合并两个或多个数组中的元素,需要使用 concat 方法. 版本要求在:5.5

  • JS Array创建及concat()split()slice()的使用方法

    JS Array创建及concat()split()slice()的使用方法 1 var a = new Array(); 2 var b=new Array(20); 3 var c= new Array("red","green","white"); alert(b.length) //20 数组可以根据需要增大或减小.因此, c[3] = "purple"; alert(c.length) //4 如果 c[25]=&q

  • js采用concat和sort将N个数组拼接起来的方法

    js采用concat和sort将N个数组拼接起来的方法

    本文实例分析了js采用concat和sort将N个数组拼接起来的方法.分享给大家供大家参考,具体如下: 这是某个大型企业的面试题扩展得来的,只是一种解法,但是无法确定是否高效,不过效果确实是实现了! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htm

  • javascript使用 concat 方法对数组进行合并的方法

    javascript使用 concat 方法对数组进行合并的方法

    在介绍前,抛出一个问题:如何将多个数组合并为一个数组? 以下的分享会分为如下小节: 1.concat方法的基础介绍 2.从实例中感受concat方法 1.concat方法的基础介绍 concat方法用于多个数组的合并.它将新数组的成员,添加到原数组的尾部,然后返回一个新数组,原数组不变. console.log([].concat([1],[2],[3])); // [1, 2, 3] console.log([].concat([[1],[2],[3]])); // [[1], [2], [3

  • 深入理解javascript中concat方法

    深入理解javascript中concat方法

    最近在恶补js知识的时候,总是会因为js强大的语法而感到震撼.因为以前对前端方面的疏忽,导致了一些理解的错误.因此痛改前非,下定决心,不管做什么事情,都要有专研的精神. 在介绍前,抛出一个问题:如何将多个数组合并为一个数组? 以下的分享会分为如下小节: 1.concat方法的基础介绍 2.从实例中感受concat方法 1.concat方法的基础介绍 concat方法用于多个数组的合并.它将新数组的成员,添加到原数组的尾部,然后返回一个新数组,原数组不变. console.log([].conca

  • JavaScript模拟数组合并concat

    定义和用法 concat() 方法用于连接两个或多个数组. 该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本. 语法 arrayObject.concat(arrayX,arrayX,......,arrayX) 参数 描述 arrayX 必需.该参数可以是具体的值,也可以是数组对象.可以是任意多个. 返回值 返回一个新的数组.该数组是通过把所有 arrayX 参数添加到 arrayObject 中生成的.如果要进行 concat() 操作的参数是数组,那么添加的是数组中的元素,而不是

  • js嵌套的数组扁平化:将多维数组变成一维数组以及push()与concat()区别的讲解

    js嵌套的数组扁平化:将多维数组变成一维数组以及push()与concat()区别的讲解

    数组的扁平化:将多维数组变成一维数组 对于一个像这样的嵌套数组:a=[1,[2,[3,4]],5,6]我们想要把它变成一个一维数组,有下面几种方法: 方法一:递归一 function parseArr(arr,res){ var i=0; for(i=0;i<arr.length;i++){ if(arr[i] instanceof Array){ parseArr(arr[i],res); }else{ res.push(arr[i]); } } } var a=[1,[2,[3,4]],5,

  • JavaScript中concat复制数组方法浅析

    我们在需要进行数组复制的时候可能会想到以下的方法 代码 var arr1 = [1,2,3,4,5]; var arr2 = []; arr2 = arr1; console.log(arr1); console.log(arr2); 执行结果如下: [1, 2, 3, 4, 5] [1, 2, 3, 4, 5] 在这个例子中,将数组arr1赋值给了另一个数组arr2. 查看执行结果,似乎复制了数组的内容并创建了相同的数组. 但是,由于数组是"引用类型"的数据,因此它不会复制该值,而只

  • Javascript中的Callback方法浅析

    什么是callback 复制代码 代码如下: 回调函数就是一个通过函数指针调用的函数.如果你把函数的指针(地址)作为参数传递给另一个函数,当这个指针被用为调用它所指向的函数时,我们就说这是回调函数.回调函数不是由该函数的实现方直接调用,而是在特定的事件或条件发生时由另外的一方调用的,用于对该事件或条件进行响应. 这个解释看上去很复杂,于是找到了知乎上一个更好的解释 复制代码 代码如下: 你到一个商店买东西,刚好你要的东西没有货,于是你在店员那里留下了你的电话,过了几天店里有货了,店员就打了你的电

  • Javascript中的apply()方法浅析

    之前我们说过 Javascript Call方法,这次我们就说说和Call方法类似的apply方法. apply vs call 两者间的不同在于:传递的是参数,还是参数数组 这个是call的用法 复制代码 代码如下: theFunction.call(valueForThis, arg1, arg2, ...) 而这个则是apply 复制代码 代码如下: theFunction.apply(valueForThis, arrayOfArgs) 故而 复制代码 代码如下: arrayOfArgs

  • JavaScript中的 attribute 和 jQuery中的 attr 方法浅析

    根据大体上的意思我感觉js setAttribute与jquery中attr工作是完全一样的,只是jquery中简写了并且工能更强大了,下面我来分别介绍一下他们的用法. attribute 是原生js dom 对象上的一个属性,这个属性有很多子属性,比如 isId(判断属性是否是Id) , name (获取属性名称) , value (获取属性值),attributes 用来获取dom元素 的所有属性集合. 话不多说,上例子了: <input type="text" name=&

  • JavaScript中数组reduce()方法使用详情

    JavaScript中数组reduce()方法使用详情

    语法: reduce()对数组中的每个元素进行累加,返回一个新的值,可以传入初始值简单的讲就是返回数组中所有元素的和数  不会改变原始组的值  不会对空数组执行回调函数 arr.reduce(function(tmp, value, [index]) { // dosomething... }, [startValue]) // 提供初始值通常更安全 tmp:上一次的累加值,初始值为外部传进去的初始值 startValue,若没传默认是数组第一个值 value:数组元素:若累加值tmp为数组第一

  • javascript中一些util方法汇总

    javascript中一些util方法汇总 /***************原生对象工类方法****************/ /** * 判断非空 * @param obj * @returns {boolean} */ function isEmpty(obj) { if (obj == undefined || obj == null || new String(obj).trim() == '') { return true; } else { return false; } } /**

  • javascript中checkbox使用方法简单实例演示

    javascript中checkbox使用方法简单实例演示

    演示一个小小的例子:在购物车里面,我们能够勾选自己所选的商品,然后能够显示出相应的价格. 1.首先显示出相应的界面:   相关代码: <body> 商品列表:<br/> 笔记本电脑<input type="checkbox" name="mm" value="3000" onclick="chose(this)" />3000 台式机<input type="checkbox

  • Javascript中的call()方法介绍

    在Mozilla的官网中对于call()的介绍是: 复制代码 代码如下: call() 方法在使用一个指定的this值和若干个指定的参数值的前提下调用某个函数或方法. Call() 语法 复制代码 代码如下: fun.call(thisArg[, arg1[, arg2[, ...]]]) Call() 参数 thisArg 复制代码 代码如下: 在fun函数运行时指定的this值.需要注意的是,指定的this值并不一定是该函数执行时真正的this值,如果这个函数处于非严格模式下,则指定为nul

  • JavaScript 中调用 Kotlin 方法实例详解

    JavaScript 中调用 Kotlin 方法实例详解 Kotlin 编译器生成正常的 JavaScript 类,可以在 JavaScript 代码中自由地使用的函数和属性 .不过,你应该记住一些微妙的事情. 用独立的 JavaScript 隔离声明 为了防止损坏全局对象,Kotlin 创建一个包含当前模块中所有 Kotlin 声明的对象 .所以如果你把模块命名为 myModule,那么所有的声明都可以通过 myModule 对象在 JavaScript 中可用.例如: fun foo() =

  • JavaScript中的splice方法用法详解

    JavaScript中的splice主要用来对js中的数组进行操作,包括删除,添加,替换等. 注意:这种方法会改变原始数组!. 1.删除-用于删除元素,两个参数,第一个参数(要删除第一项的位置),第二个参数(要删除的项数) 2.插入-向数组指定位置插入任意项元素.三个参数,第一个参数(插入位置),第二个参数(0),第三个参数(插入的项) 3.替换-向数组指定位置插入任意项元素,同时删除任意数量的项,三个参数.第一个参数(起始位置),第二个参数(删除的项数),第三个参数(插入任意数量的项) 示例:

随机推荐