一椎侠、js數(shù)據(jù)類型
js的數(shù)據(jù)類型可以簡(jiǎn)單的概括為兩大類:原始類型和引用類型。原始類型包括:Undefined措拇、Null肺蔚、Boolean、Number 和 String儡羔。引用類型通常包括:數(shù)組和對(duì)象。如下圖:
二璧诵、各種類型的復(fù)制效果
首先看看原始類型的復(fù)制:
var a=12;
var b=a;
b=34;
console.log(a) //12
console.log(b) //34
可以看出整數(shù)b從整數(shù)a復(fù)制而來(lái)汰蜘,并且修改b并不會(huì)對(duì)a產(chǎn)生影響。
實(shí)際上之宿,系統(tǒng)新申請(qǐng)了一塊內(nèi)存供b使用族操。如果把變量比作房子,b房子就是按照a房子的樣子新蓋的比被,你裝修b房子并不會(huì)影響a房子
再看引用類型的拷貝
var a=[1,2,3]
var b=a
b[1]=4
console.log(a) //[1,4,3]
console.log(b) //[1,4,3]
可以看出同樣數(shù)組b從數(shù)組a復(fù)制而來(lái)色难,修改了b導(dǎo)致a的內(nèi)容也改變了。實(shí)際上a和b引用了同一塊內(nèi)存等缀。如果也把變量比作房子枷莉,a和b實(shí)際上是同一座房子的鑰匙,你裝修了房子尺迂,如果裝修的不好笤妙,別人可能會(huì)打你。
以上情形就是淺拷貝噪裕,多數(shù)情況下蹲盘,這并不是我們想要的結(jié)果。
三膳音、深拷貝的解決方案
對(duì)于比較簡(jiǎn)單的數(shù)組召衔,比如[1,2,3,4],可以使用slice,concat進(jìn)行復(fù)制:
var a=[1,2,3]
var b=a.slice(0)
b[1]=4
var c=[2,3,4]
var d=[].concat(c);
d[1]=5
console.log(a) //[1,2,3]
console.log(b) //[1,4,3]
console.log(c) //[2,3,4]
console.log(d) //[2,5,4]
但是對(duì)于比較復(fù)雜的數(shù)據(jù)結(jié)構(gòu)就不那么管用了:
var a=[1,{k1:2,k2:3,k3:4,children:[]},5]
var b=a.slice(0)
b[1].children[0]={a:1,b:2,c:3}
console.log(a) //[1,{k1:2,k2:3,k3:4,children:[a:1,b:2,c:3]},5]
console.log(b) //[1,{k1:2,k2:3,k3:4,children:[a:1,b:2,c:3]},5]
網(wǎng)絡(luò)上有人給出如下方法,其實(shí)并沒(méi)有用
function copyArr(arr){
return arr.map((e)=>{
if(typeof e === 'object'){
return Object.assign({},e)
}else{
return e
}
})
}
當(dāng)然了還可以找到能用的方法祭陷,但是都比較復(fù)雜苍凛,我這里提供一個(gè)比較簡(jiǎn)單不需要循環(huán)的方法,原理就是將對(duì)象或數(shù)組序列化成字符串,然后再解析成對(duì)象或數(shù)組:
function copyArr(arr){
return JSON.parse(JSON.stringify(arr))
}
完