JS存儲方式

JS中存在基本數(shù)據(jù)類型和引用數(shù)據(jù)類型
1.基本數(shù)據(jù)類型：number，string，boolean，null，undefined，Symbol，bigInt
2.引用數(shù)據(jù)類型：對象(引用類型)([]，{}，日期，函數(shù)等等)
基本數(shù)據(jù)類型直接把數(shù)值存儲在棧內(nèi)存中。
引用數(shù)據(jù)類型把引用地址存放在棧內(nèi)存中，該地址指向的是堆內(nèi)存中存儲的實際的數(shù)據(jù)。
淺拷貝：只拷貝棧
深拷貝：對于棧中存放的引用數(shù)據(jù)類型的地址，在堆中新建內(nèi)存來拷貝這些引用數(shù)據(jù)類型
數(shù)組和對象這種引用數(shù)據(jù)類型，淺拷貝后指向的還是同一個地址

基本類型的復制

var a = 1;
var b = a;//復制
console.log(a)//1
console.log(b)//1
a = 2;//改變a的值
console.log(a)//2
console.log(b)//1

聲明簡單數(shù)據(jù)類型b時會在棧內(nèi)存中新開辟一個地址，其中存儲b的值，和a的值互相不干擾，修改也不會影響a

引用類型的復制

var a= [1,2];
var b= a;//復制
console.log(a)//[1,2]
console.log(b)//[1,2]
a.push(3);//改變a的值
console.log(a)//[1,2,3]
console.log(b)//[1,2,3]

聲明復雜數(shù)據(jù)類型b時也會在棧內(nèi)存中新開辟一個地址，其中存儲的是一個引用地址。在上述代碼中是修改a引用地址中數(shù)據(jù)的值，而b指向的是同一個地址，因此b也會受影響(b中存儲的地址無影響，地址所指向的堆內(nèi)存中存儲的數(shù)據(jù)被修改了)
因此對于引用類型的復制，簡單賦值并不能獲得我們想要的效果，這時候就需要深淺拷貝了

深淺拷貝

淺拷貝
　　淺拷貝只是拷貝基本類型的數(shù)據(jù)，如果父對象的屬性等于數(shù)組或另一個對象，那么實際上，子對象獲得的只是一個內(nèi)存地址，因此存在父對象被篡改的可能，淺拷貝只復制指向某個對象的指針，而不復制對象本身，新舊對象還是共享同一塊內(nèi)存

//詳細案例
var Person={
　　name:'張三'
}
function fadeCopy(obj){
　　var temp={};
　　for(let i in obj)
　　　　temp[i]=obj[i];
　　return temp;
}
var teacher=fadeCopy(Person);
teacher.career = '老師';
teacher.name = '李四';
console.log(teacher.career);//老師
console.log(teacher.name);//李四
console.log(Person.name);//張三
console.log(teacher.__proto_ === Person.__proto_);// true

深拷貝
　　深拷貝就是能夠?qū)崿F(xiàn)真正意義上的數(shù)組和對象的拷貝。遞歸調(diào)用"淺拷貝"。（深拷貝會另外創(chuàng)造一個一模一樣的對象，新對象跟原對象不共享內(nèi)存，修改新對象不會改到原對象）

function deepClone(obj){
    //先判斷是不是正則和日期
    if(obj instanceof RegExp)
        return new RegExp(obj);
    if(obj instanceof Date)
        return new Date(obj);

    //不直接創(chuàng)建空對象：克隆的結(jié)果和之前保持相同的所屬類
    let newObj = obj.constructor;
    //判斷是不是引用類型和null(typeof null === “object”但卻是簡單數(shù)據(jù)類型)
    if(obj && typeof obj === "object"){//判斷null
        for(let key in obj){
            //如果value是引用類型則繼續(xù)深拷貝
            if(obj[key]&&typeof obj[key]==='object')
                //值是對象則遞歸
                newObj [key] = deepClone(obj[key]);
            else
                newObj [key] = obj[key];
        }
    }
    return newObj;
}

淺拷貝常用方法：

var obj = {
    a: 1,
    b: [1, 2, 3],
    c: {x: 10},
};
//1.原型式繼承
function fadecopy(a) {
    function fn() {
        fn.prototype = a;
    }
    return new fn()
}
var obj1 = fadecopy(obj);
//2.ES5中提供的create規(guī)范化原型式繼承
var obj2 = Object.create(obj);
//3.ES6中提供的合并對象方法
var obj3 = Object.assign({}, obj);
//4....展開運算符
var obj4 = {...obj};

深拷貝常用方法
1.JSON.parse(JSON.stringfy(object))//對象轉(zhuǎn)成字符串(序列化)，然后轉(zhuǎn)成js對象(反序列化)

let deepA = {
    age: 1,
    jobs: {
        first: 'FE'
    }
};
let deepB = JSON.parse(JSON.stringify(deepA));
deepA.jobs.first = 'Ali';
console.log(deepA.jobs);//Ali
console.log(deepB.jobs);//FE

這種方法是利用JSON序列化和反序列化方法將內(nèi)容完全展開，但是它仍有局限性：
1.會忽略 undefined
2.會忽略 symbol
3.會忽略 函數(shù)
4.不能解決循環(huán)引用的對象(obj.a = obj.b obj.c.d = obj.a等)

2.使用lodash的deepClone()
lodash庫中的deepClone函數(shù)。