一、JavaScript中值的类型
JavaScript中的值分为2大类:基本类型和引用类型。每种类型下面又分为5种类型。
基本类型:
数字类型:Number;字符串类型:String;布尔类型:Boolean(true和false);Undefined;Null。
引用类型:
函数、数组、日期、正则、错误。
注意:所有的引用类型都是对象,也就是Object对象下的一个类,
对于基本类型,用等于号引入值的是里面的内容,修改新的值不会改变原来的值
对于引用类型,用等于号引入值的是把地址传进去,修改新建立的数组原数组也会变。
let TheList=[];
TheList=this.queryList;
//这时候若是修改TheList,queryList的值也会变化
若是不想要修改原来的值,那就可以用下面的方法
TheList= Array.from(this.queryList);
//修改TheList不会引起原数组变化
上面说到,基本数据类型和引用的类型的区别,因为基本类型都是可以直接创建一个新的地址的,所以浅拷贝和深拷贝都只是针对引用类型。
浅拷贝只复制指向某个对象的指针,而不复制对象本身,新旧对象还是共享同一块内存。但深拷贝会另外创造一个一模一样的对象,新对象跟原对象不共享内存,修改新对象不会改到原对象。
浅拷贝的方法
1、遍历对象的属性赋值给新对象
function shallowCopy(obj){
let copyObj={};
for(let key in obj){
if(obj.hasOwnProperty(key)){
copyObj[key] = obj[key];
}
}
return copyObj;
}
2、使用es6提供的Object.assign()方法,将后续的源对象的枚举属性赋值到目标对象中,第一个参数是一个目标对象,其他的都是源对象(如果属性中没有引用类型数据的话就是深拷贝了)
var shallowCopy = Object.assign(targetObj,srcObj1,srcObj2,....);
var a = {a:1,b:3}
var b = {a:10,d:30}
var c = {f:2}
var d = Object.assign(a,b,c)
console.log(a)// {a:10,b:3,d:30,f:2}
console.log(d)// {a:10,b:3,d:30,f:2}
// 引用类型
var a = {a:1,b:3}
var b = {a:10,c:a}
var c = {a:120,d:120}
var d = Object.assign(b,c)
console.log(b)// {a:120,c:{a:1,b:3},d:120}
console.log(d)// {a:120,c:{a:1,b:3},d:120}
深拷贝的方法
1、JSON.parse(JSON.stringify()):转成json字符串之后再转为对象(前提是当前的源对象可以转为json字符串,undefined,function等不能使用该方法)
let targetObj = JSON.parse(JSON.stringify(srcObj))
2、使用递归逐层拷贝
function deepCopy(srcObj){
if(typeof srcObj !== 'object'){
return srcObj
}
let result = {};
for(let key in srcObj){
if(typeof srcObj[key] === 'object'){ //当前属性是引用类型属性
if(Array.isArray(srcObj[key])){
let arr = [];
let srcObjArr = srcObj[key];
for(var i=0;i<srcObjArr.length;i++){
arr.push(deepCopy(srcObjArr[i]))
}
result[key] = arr;
}else if(srcObj[key] === null || srcObj[key].constructor === RegExp){
result[key] = srcObj[key];
}else{
result[key] = deepCopy(srcObj[key])
}
}else{
result[key] = srcObj[key];
}
}
return result;
}