javascript中数组的深拷贝的方法
一、什么是浅拷贝
在js当中,我们常常遇到数组复制的的情况,许多人一般都会使用“=”来直接把一个数组赋值给一个变量,如
var a=[1,2,3];
var b=a;
console.log(b); //输出的是1,2,3
a[2]=0;
console.log(b); //输出的是1,2,0
把数组a用等号“=”的形式复制给变量b,这种就是js数组的浅拷贝。然而,正如上面代码所示,一旦对数组a做出修改,实际上会影响拷贝出来的其他数组,这并不是我们所想要的结果,因此就必须用到数组的深拷贝来解决这个问题。
二、实现数组的深拷贝的方法
(1)for循环实现数组的深拷贝
var arr1 = [1, 2, 3];
var arr2 = [];
for (var i = 0; i < arr1.length; i++) {
arr2.push(arr1[i]);
}
arr1[0] = 4;
console.log(arr1); //4, 2, 3
console.log(arr2); //1, 2, 3
(2)concat 方法实现数组的深拷贝
concat() 方法用于连接两个或多个数组。
该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。
var arr1 = [1, 2, 3];
var arr2 = arr1.concat();
arr1[0] = 4;
console.log(arr1); //4, 2, 3
console.log(arr2); //1, 2, 3
(3)slice 方法实现数组的深拷贝
slice() 方法可从已有的数组中返回选定的元素。
arrayObject.slice(start,end)
该方法返回一个新的数组,包含从 start 到 end (不包括该元素)的 arrayObject 中的元素。
var arr1 = [1, 2, 3];
var arr2 = arr1.slice(0);
arr1[0] = 4;
console.log(arr1); //4, 2, 3
console.log(arr2); //1, 2, 3
(4)ES6扩展运算符实现数组的深拷贝
...扩展运算符是ES6的语法,使用起来非常的方便简洁,相信在写ES6的时候也是备受欢迎的。
var arr1 = [1, 2, 3];
var [...arr2] = arr1;
arr1[0] = 4;
console.log(arr1); //4, 2, 3
console.log(arr2); //1, 2, 3
javascript中数组的深拷贝的方法的更多相关文章
- 总结Javascript中数组各种去重的方法
相信大家都知道网上关于Javascript中数组去重的方法很多,这篇文章给大家总结Javascript中数组各种去重的方法,相信本文对大家学习和使用Javascript具有一定的参考借鉴价值,有需要的 ...
- JavaScript中数组Array.sort()排序方法详解
JavaScript中数组的sort()方法主要用于对数组的元素进行排序.其中,sort()方法有一个可选参数.但是,此参数必须是函数. 数组在调用sort()方法时,如果没有传参将按字母顺序(字符编 ...
- javascript中数组的22种方法
× 目录 [1]对象继承 [2]数组转换 [3]栈和队列[4]数组排序[5]数组拼接[6]创建数组[7]数组删改[8]数组位置[9]数组归并[10]数组迭代[11]总结 前面的话 数组总共有22种方法 ...
- javascript中数组的22种方法 (转载)
前面的话 数组总共有22种方法,本文将其分为对象继承方法.数组转换方法.栈和队列方法.数组排序方法.数组拼接方法.创建子数组方法.数组删改方法.数组位置方法.数组归并方法和数组迭代方法共10类来进行详 ...
- javascript中数组和字符串的方法比较
× 目录 [1]可索引 [2]转换 [3]拼接[4]创建[5]位置 前面的话 字符串和数组有很多的相同之处,它们的方法众多,且相似度很高:但它们又有不同之处,字符串是不可变值,于是可以把其看作只读的数 ...
- JavaScript中数组相关的属性方法
下面的这些方法会改变调用它们的对象自身的值: Array.prototype.copyWithin() 在数组内部,将一段元素序列拷贝到另一段元素序列上,覆盖原有的值. Array.prototype ...
- Javascript中数组查重的方法总结大全
数组查重:简单点说,就是找出数组中重复的元素然后去除,最后得到一个没有重复元素的数组. // 方法一思路: 1.构建一个新的数组,用于存放结果. 2.for循环中每次从数组取出一个 ...
- JavaScript中数组Array方法详解
ECMAScript 3在Array.prototype中定义了一些很有用的操作数组的函数,这意味着这些函数作为任何数组的方法都是可用的. 1.Array.join()方法 Array.join()方 ...
- JavaScript中数组常用方法的总结
JavaScript中数组Array常用的方法总结 标签(空格分隔): JavaScript ECMAScript数组给我们提供了许多常用的方法,便于我们对数组进行操作,下面,就来总结一下这些方法. ...
随机推荐
- linux升级python3.6相关命令
sudo apt-get install python3.6 sudo update-alternatives --install /usr/bin/python python /usr/bin/py ...
- 智能合约语言 Solidity 教程系列8 - Solidity API
这是Solidity教程系列文章第8篇介绍Solidity API,它们主要表现为内置的特殊的变量及函数,存在于全局命名空间里. 写在前面 Solidity 是以太坊智能合约编程语言,阅读本文前,你应 ...
- C++学习-11
虚函数表,调试下断点,指针的自动变量 含有虚函数的类,它的内部含有虚指针指向虚函数表,此时的空类占有4个字节,不管有多少个虚函数,只需要一个虚函数指针指向虚函数表就可以了 构造函数不可以是虚函数,如果 ...
- 【解高次同余方程】51nod1038 X^A Mod P
1038 X^A Mod P 基准时间限制:1 秒 空间限制:131072 KB 分值: 320 X^A mod P = B,其中P为质数.给出P和A B,求< P的所有X. 例如:P = 11 ...
- CSS备战春招の二
CSS:层叠样式表 CSS注释形式:/* */ class 选择器有别于id选择器,class可以在多个元素中使用 id属性不要以数字开头,以数字开头在特定浏览器中不起作用 类名的第一个字符不要使用 ...
- openstack中的环境准备
openstack中环境准备基于Ubuntu系统 author:headsen chen 2017-10-13 11:51:50 个人原创,转载请注明作者,出处. 6 apt-get insta ...
- openstack安装系列问题:window7 64位安装的virtualBox 只能选择32位的系统安装不能选择64位的系统安装
个人原创,转载请注明作者,出处,否则依法追究法律责任 2017-10-03-12:22:22 现象:window7 64位安装的virtualBox 只能选择32位的系统安装不能选择64位的系统安装 ...
- linux性能调试之vmstat
linux性能监控调优工具vmstat: vmstat:用于监控.显示系统运行过程中的虚拟内存/CPU/磁盘状态. 简单示例(时间间隔2s,监控2次): 重要字段解释: r 表示运行队列(等待运行的进 ...
- vue技术解析六之生命周期函数
- 学习java第一章
本人是一名5年工作的人了,出来社会也比较早,工作经验比起刚刚出社会的大学生要和很多了,知道社会的现实与无奈,我为什么选择想学java昵,肯定受到了朋友的影响的,接下来就讲讲我学习java的过程. 1. ...