发表于: 2018-12-14 20:37:02
3 841
今天完成的事情:(一定要写非常细致的内容,比如说学会了盒子模型,了解了Margin)
今天了解了js的深度拷贝和浅度拷贝。
浅度拷贝
var obj1 = { a: 10, b: 20, c: 30 };
var obj2 = obj1;
obj2.b = 100;
console.log(obj1);
// { a: 10, b: 100, c: 30 } <-- b 被改到了
console.log(obj2);
// { a: 10, b: 100, c: 30 }
复制一份obj1叫做obj2,然后把obj2.b改成100,但却不小心改到obj1.b,因为他们根本是同一个对象,这就是所谓的浅拷贝。
var obj1 = { a: 10, b: 20, c: 30 };
var obj2 = { a: obj1.a, b: obj1.b, c: obj1.c };
obj2.b = 100;
console.log(obj1);
// { a: 10, b: 20, c: 30 } <-- b 沒被改到
console.log(obj2);
// { a: 10, b: 100, c: 30 }
这样就是深拷贝,不会改到原本的obj1。
深度拷贝不会影响到之前的数组的状态。
浅度拷贝会和之前的数组使用相同的地址的数据,之后的数据做修改会影响到之前的数据。
深度拷贝方式:
1、Object.assign()
Object.assign是ES6的新函数。Object.assign() 方法可以把任意多个的源对象自身的可枚举属性拷贝给目标对象,然后返回目标对象。但是 Object.assign() 进行的是浅拷贝,拷贝的是对象的属性的引用,而不是对象本身。
需要注意的是:
Object.assign()可以处理一层的深度拷贝
更深的则处理不了
2、另一种方法则是转成 JSON 再转回来
var obj2 = JSON.parse(JSON.stringify(obj1));
但是这种方法也有不少坏处,譬如它会抛弃对象的constructor。也就是深拷贝之后,不管这个对象原来的构造函数是什么,在深拷贝之后都会变成Object。
这种方法能正确处理的对象只有 Number, String, Boolean, Array, 扁平对象,即那些能够被 json 直接表示的数据结构。RegExp对象是无法通过这种方式深拷贝。
也就是说,只有可以转成JSON格式的对象才可以这样用,像function没办法转成JSON。
明天计划的事情:(一定要写非常细致的内容)
完成第二天的页面。
编写第二天的逻辑,以及将之前天数变为不可点击状态。
并且判断游戏逻辑。
遇到的问题:(遇到什么困难,怎么解决的)
使用深度拷贝的时候出现Object是因为我的打印数组里有字符串,会导致出现Object。
收获:(通过今天的学习,学到了什么知识)
了解了什么是深度拷贝
评论