js中的赋值 浅拷贝和深拷贝
前言
js数据类型主要分基本数据类型和引用数据类型。前者包括Number,String等,后者主要是Object,因此以下会针对不同的数据类型来分析,同时需要一点js的内存的知识,以下先简要提一下
js内存
js内存,或者说大部分语言的内存都分为栈和堆。基本数据类型的变量值分配在栈上,引用数据类型的变量值分配在堆上,栈中只是存储具体堆中对象的地址。
赋值
对于基本数据类型,赋值操作是拷贝,即新旧变量不会相互影响。
var a = 1;
var b = a;
b = 2;
console.log(b);
// 2
对于引用数据类型,赋值操作只是在栈中新增一个指向堆中对象的变量,即复制引用地址。新旧变量之间会互相影响,即在新变量上改变对象值,旧变量对应值也会改变。
var a = {
name: "mike"
};
var b = a;
b.name = "jack";
console.log(a);
// {name: "jack"}
浅拷贝
对于基本数据类型和不具有嵌套对象的数据,均是拷贝操作,新旧变量之间不会相互影响。
var a = {
name: "mike"
};
var b = {};
b.name = a.name;
b.name = "jack";
console.log(a) // {name: "mike"}
但是对于具有嵌套对象的数据,浅拷贝只拷贝第一层对象,深层次的值仍然是复制引用地址。
var a = {
name: "mike",
language: {
first: "english",
second: "chinese"
}
};
var b = {};
b.name = a.name;
b.name = "jack";
b.language = a.language;
b.language.first = "japanese"
console.log(a) // { language : {first: "japanese", second: "chinese"}}
js实现浅拷贝,思想:遍历target的每个属性,将起属性名和值赋值给新变量。
如果你明白了赋值的含义,那么在代码的第四行,当此时的target[key]的值是对象的时候,通过赋值赋予新变量,本质上是复制引用数据类型在堆中的地址,就不难理解为什么浅拷贝对于是否是嵌套对象的有不同结果了。
function shallowCopy(target) {
let result = {};
for (const key in target) {
result[key] = target[key];
}
return result;
}
深拷贝
深拷贝是完完全全的拷贝,新旧变量之间不会相互影响。
对于参数是否是对象有不同的处理方法,如果是对象,对于对象的每个属性和值赋值然后递归处理; 否则直接返回。
function clone(target) {
if (typeof target === "object") {
//判断是否是数组
let result = Array.isArray(target)? [] : {};
for (const key in target) {
result[key] = clone(target[key]);
}
returnresult;
} else {
return target;
}
}
参考
【js中的赋值 浅拷贝和深拷贝】深拷贝实现
推荐阅读
- 热闹中的孤独
- JS中的各种宽高度定义及其应用
- 由浅入深理解AOP
- 我眼中的佛系经纪人
- 《魔法科高中的劣等生》第26卷(Invasion篇)发售
- Android中的AES加密-下
- 放下心中的偶像包袱吧
- C语言字符函数中的isalnum()和iscntrl()你都知道吗
- C语言浮点函数中的modf和fmod详解
- C语言中的时间函数clock()和time()你都了解吗