JavaScript中concat复制数组方法浅析


Posted in Javascript onJanuary 20, 2019

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

代码

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()即可。

Javascript 相关文章推荐
cookie.js 加载顺序问题怎么才有效
Jul 31 Javascript
JavaScript实现班级随机点名小应用需求的具体分析
May 12 Javascript
JS数组(Array)处理函数整理
Dec 07 Javascript
Node.js实用代码段之正确拼接Buffer
Mar 17 Javascript
JS不完全国际化&本地化手册 之 理论篇
Sep 27 Javascript
vue-cli+webpack项目 修改项目名称的方法
Feb 28 Javascript
React之PureComponent的使用作用
Jul 10 Javascript
详解微信小程序网络请求接口封装实例
May 02 Javascript
React-redux实现小案例(todolist)的过程
Sep 29 Javascript
vue 实现在同一界面实现组件的动态添加和删除功能
Jun 16 Javascript
vue同个按钮控制展开和折叠同个事件操作
Jul 29 Javascript
vue封装数字翻牌器
Apr 20 Vue.js
JavaScript中import用法总结
Jan 20 #Javascript
如何优雅的在一台vps(云主机)上面部署vue+mongodb+express项目
Jan 20 #Javascript
js序列化和反序列化的使用讲解
Jan 19 #Javascript
vue-router传参用法详解
Jan 19 #Javascript
vue-router实现嵌套路由的讲解
Jan 19 #Javascript
vue-router实现编程式导航的代码实例
Jan 19 #Javascript
vue数据操作之点击事件实现num加减功能示例
Jan 19 #Javascript
You might like
坏狼的PHP学习教程之第1天
2008/06/15 PHP
无需重新编译php加入ftp扩展的解决方法
2013/02/07 PHP
thinkPHP5.0框架应用请求生命周期分析
2017/03/25 PHP
Ajax+PHP实现的模拟进度条功能示例
2019/02/11 PHP
自己动手开发jQuery插件教程
2011/08/25 Javascript
onclick与listeners的执行先后问题详细解剖
2013/01/07 Javascript
jquery获取一组checkbox的值(实例代码)
2013/11/04 Javascript
判断及设置浏览器全屏模式
2014/04/20 Javascript
jQuery 1.9移除了$.browser可以使用$.support来替代
2014/09/03 Javascript
jQuery焦点图轮播插件KinSlideshow用法分析
2016/06/08 Javascript
Angular中使用ui router实现系统权限控制及开发遇到问题
2016/09/23 Javascript
基于vue.js中关于下拉框的值默认及绑定问题
2018/08/22 Javascript
微信小程序+腾讯地图开发实现路径规划绘制
2019/05/22 Javascript
js 判断当前时间是否处于某个一个时间段内
2019/09/19 Javascript
关于layui时间回显问题的解决方法
2019/09/24 Javascript
element form 校验数组每一项实例代码
2019/10/10 Javascript
Vue常用传值方式、父传子、子传父及非父子实例分析
2020/02/24 Javascript
微信小程序保持session会话的方法
2020/03/20 Javascript
JavaScript 中的六种循环方法
2021/01/06 Javascript
Python中isnumeric()方法的使用简介
2015/05/19 Python
bat和python批量重命名文件的实现代码
2016/05/19 Python
Python实现购物系统(示例讲解)
2017/09/13 Python
Python numpy生成矩阵、串联矩阵代码分享
2017/12/04 Python
Python实现的求解最小公倍数算法示例
2018/05/03 Python
mac安装pytorch及系统的numpy更新方法
2018/07/26 Python
用Python+OpenCV对比图像质量的几种方法
2019/07/15 Python
Django多数据库配置及逆向生成model教程
2020/03/28 Python
详解Python IO编程
2020/07/24 Python
浅谈HTML5 服务器推送事件(Server-sent Events)
2017/08/01 HTML / CSS
爱尔兰电脑、家电和家具购物网站:Buy It Direct
2019/07/09 全球购物
二年级学生评语大全
2014/04/23 职场文书
英语系毕业生求职信
2014/07/13 职场文书
财务会计实训报告
2014/11/05 职场文书
公司联欢会主持词
2015/07/04 职场文书
交通安全温馨提示语
2015/07/14 职场文书
浅谈Redis跟MySQL的双写问题解决方案
2022/02/24 Redis