一、数据类型存储
基本类型（保存在栈内存中）
引用类型（保存在堆内存中，引用数据类型的变量是一个指向堆内存中中实际对象的引用，存在栈中）
二、浅拷贝
浅拷贝，指的是创建新的数据，这个数据有着原始数据属性值的一份精确拷贝如果属性是基本类型，拷贝的就是基本类型的值。如果属性是引用类型，拷贝的就是内存地址即浅拷贝是拷贝一层，深层次的引用类型则共享内存地址下面简单实现一个浅拷贝
functionshallowClone(obj){
const newObj = {};
for(let prop in obj) {
if(obj.hasOwnProperty(prop)){
newObj[prop] = obj[prop];
}
}
return newObj;
}
在JavaScript中，存在浅拷贝的现象有：
Object.assign
Array.prototype.slice(), Array.prototype.concat()
使用拓展运算符实现的复制
Object.assign
varobj = {
age:18,
nature: ['smart','good'],
names: {
name1:'fx',
name2:'xka'
},
love:function(){
console.log('fx is a great girl')
}
}
var newObj =Object.assign({}, fxObj);
slice()
constfxArr = ["One","Two","Three"]
constfxArrs = fxArr.slice(0)
fxArrs[1] ="love";
console.log(fxArr)// ["One", "Two", "Three"]
console.log(fxArrs)// ["One", "love", "Three"]
concat()
constfxArr = ["One","Two","Three"]
constfxArrs = fxArr.concat()
fxArrs[1] ="love";
console.log(fxArr)// ["One", "Two", "Three"]
console.log(fxArrs)// ["One", "love", "Three"]
拓展运算符
constfxArr = ["One","Two","Three"]
constfxArrs = [...fxArr]
fxArrs[1] ="love";
console.log(fxArr)// ["One", "Two", "Three"]
console.log(fxArrs)// ["One", "love", "Three"]
三、深拷贝
深拷贝开辟一个新的栈，两个对象属性完成相同，但是对应两个不同的地址，修改一个对象的属性，不会改变另一个对象的属性
常见的深拷贝方式有：
_.cloneDeep()
jQuery.extend()
JSON.stringify()
手写循环递归
_.cloneDeep()
const_ =require('lodash');
constobj1 = {
a:1,
b: {f: {g:1} },
c: [1,2,3]
};
constobj2 = _.cloneDeep(obj1);
console.log(obj1.b.f === obj2.b.f);// false
jQuery.extend()
const$ =require('jquery');
constobj1 = {
a:1,
b: {f: {g:1} },
c: [1,2,3]
};
constobj2 = $.extend(true, {}, obj1);
console.log(obj1.b.f === obj2.b.f);// false
JSON.stringify()
constobj2=JSON.parse(JSON.stringify(obj1));
但是这种方式存在弊端，会忽略undefined、symbol和函数
constobj = {
name:'A',
name1:undefined,
name3:function(){},
name4:Symbol('A')
}
constobj2 =JSON.parse(JSON.stringify(obj));
console.log(obj2);// {name: "A"}
循环递归
functiondeepClone(obj, hash = new WeakMap()){
if(obj ===null)returnobj;// 如果是null或者undefined我就不进行拷贝操作
if(objinstanceofDate)returnnewDate(obj);
if(objinstanceofRegExp)returnnewRegExp(obj);
// 可能是对象或者普通的值 如果是函数的话是不需要深拷贝
if(typeofobj !=="object")returnobj;
// 是对象的话就要进行深拷贝
if(hash.get(obj))returnhash.get(obj);
letcloneObj =newobj.constructor();
// 找到的是所属类原型上的constructor,而原型上的 constructor指向的是当前类本身
hash.set(obj, cloneObj);
for(letkeyinobj) {
if(obj.hasOwnProperty(key)) {
// 实现一个递归拷贝
cloneObj[key] = deepClone(obj[key], hash);
}
}
returncloneObj;
}
网友评论