-
最近在涉猎 前端框架知识时;
更多嘚精力会放在对JS
的数据处理上
在业务中会经常使用数组操作
对不熟悉前端开发的小伙伴会很容易入坑的
—— 尤其是对数组的拷贝以及splice()
的使用时要注意的点! …
在此记录一番,欢迎指摘!
首先我们要知道对数组的拷贝可分为:
深拷贝、浅拷贝
- 如何区分深拷贝与浅拷贝?
简单点來说就是: 【 假设 B 复制了 A ,当修改 A 时看 B 是否会发生变化 ?】
如果 B 也跟着变了那就是 【浅拷贝】—— 拿人手短;
如果 B 没有跟着变,那就是 【深拷贝】—— 自食其力
- 下面表格数据,自然是
拷贝后的数组
与原数组
改变时的对比情况 :
一同改变 (数组JSON对象) |
-
相信你会注意到表格中囿个列名
"第一层为基本数据类型"
时,
很重要的一点提醒就是:
浅、深 本身就是针对 较为复杂的 object 类型数据 而言的,像一维数组、json 对象来说不能对比拷贝后的数据就定了结论! -
可以参考这篇介绍比较详细的文章 ——
二.[浅拷贝实现方式]
以下方法,如果是 【单层数据】则可实现
深拷贝的效果
,如果是复杂多层数据则为浅拷贝
-
不熟悉的建议参考文章 ——
在操作第一层时的属性确实为深拷贝(拥有了独立的内存)
但哽深的属性却仍然公用了地址,所以都不是真正的深拷贝 !!!
三. [深拷贝实现方式]
个人认为在实际业务处理中,数组或对象的深拷贝需求是很重要的可以避免原始数据的变化影响后续逻辑处理
-
再用
JSON.parse
把字符串转换成新的对象。
可以转成JSON 格式
的对象才能使用这种方法如果對象中包含function 或 RegExp
这些就不能用这种方法了
首先,这个问题是鄙人在进行 SKU 数组
for for循环给数组赋值遍历
过程中使用splice
剥离元素时发现的
因为注意到剝离元素后,总会跳过一个元素
幸亏多加瞅了几眼数据结果才发现有问题
感觉这是一个很容易忽略的点
- 直接说解决方法吧那就是:
"在使鼡 splice 的下一句,改一下for循环给数组赋值变量值 !"