vue实现对象的复制

7 篇文章 0 订阅
5 篇文章 0 订阅

写代码的时候发现bug
首先我是有一个数组,假设是数组:

var a = [
{id=1,name="test1",time="2020-5-18 10:20"}
,{id=2,name="test2",time="2020-5-17 10:20"}
];

然后我将数组中的一项单独拿出来

var flag = a[0];

然后进行了一些操作

flag.name = "今天的时间";

然后在调用a数组的时候发现a数组中的数组也变了,变成了

var a = [
{id=1,name="今天的时间",time="2020-5-18 10:20"}
,{id=2,name="test2",time="2020-5-17 10:20"}
];

bing查了下发现这是因为除了基础变量外,其他变量间进行= 操作都是传递的地址,俩个变量都是指向同一个地址,其中一个变了其他的页会跟着变
如果只想进行值传递,则需要进行对象数组的复制
俩种方法
1:var flag = JSON.parse(JSON.stringify(a[0])) a[0]替换为你需要复制的对象数组,但是这种方法的话会有一些限制:参考链接

转换值如果有 toJSON() 方法,该方法定义什么值将被序列化。
非数组对象的属性不能保证以特定的顺序出现在序列化后的字符串中。
布尔值、数字、字符串的包装对象在序列化过程中会自动转换成对应的原始值。
undefined、任意的函数以及 symbol 值,在序列化过程中会被忽略(出现在非数组对象的属性值中时)或者被转换成 null(出现在数组中时)。函数、undefined 被单独转换时,会返回 undefined,如JSON.stringify(function(){}) or JSON.stringify(undefined).
对包含循环引用的对象(对象之间相互引用,形成无限循环)执行此方法,会抛出错误。
所有以 symbol 为属性键的属性都会被完全忽略掉,即便 replacer 参数中强制指定包含了它们。
Date 日期调用了 toJSON() 将其转换为了 string 字符串(同Date.toISOString()),因此会被当做字符串处理。
NaN 和 Infinity 格式的数值及 null 都会被当做 null。
其他类型的对象,包括 Map/Set/WeakMap/WeakSet,仅会序列化可枚举的属性。

2:直接循环遍历进行复制:

function deepClone(data){
       var type = getType(data);
       var obj;
       if(type === 'array'){
           obj = [];
       } else if(type === 'object'){
           obj = {};
       } else {
           //不再具有下一层次
           return data;
       }
       if(type === 'array'){
           for(var i = 0, len = data.length; i < len; i++){
               obj.push(deepClone(data[i]));
           }
       } else if(type === 'object'){
           for(var key in data){
               obj[key] = deepClone(data[key]);
           }
       }
       return obj;
   }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值