js understood copy depth

js understood copy depth

Speaking js shades had to bring a copy of the data type is js

• Basic data types: undfined string boolean null number
• Reference data types: array object function
  elementary data type is stored in the stack memory

variable	value
a	1 (stack memory)
b	(pointer)

var a=1；var b = a a=3;console.log(a,b)//3,1
As shown in the code:
the difference between 1 and the deep copy shallow copy
how to distinguish deep copy and shallow copy, a simple point, a copy is assumed that B A, when the modified A, B to see whether a change will occur, followed if B It changed, indicating that this is a shallow copy, to be led by the nose, if B has not changed, and that is a deep copy, self-reliance.
Reference data type is stored in the heap memory

var b={name:"张三",age:"25"}
var newobj = b;
b.name="李四"
"李四"
console.log(b,newobj)
 //{name: "李四", age: "25"} {name: "李四", age: "25"}

Why the above results will happen?
Because newobj when b = b just copied the stack memory pointer, the stack pointer is executed just a memory address, by assigning and b is equal to newobj newobj all share this memory.

Heap
(b) {name:“zhangsan”,age:“25”}

Array deep copy: tried slice concat copied but only one, and not true copies of
objects deep copy: Object.assign tried
to use Object.assign embodiment only the first layer of the copy object after the second layer or both just copy the pointer; modifying the second layer obj2, obj1 or will change with
it to realize how deep copy of it?

深拷贝
 1.递归
function deepClone(obj){
    let objClone = Array.isArray(obj)?[]:{};
    if(obj && typeof obj==="object"){
        for(key in obj){
            if(obj.hasOwnProperty(key)){
                //判断ojb子元素是否为对象，如果是，递归复制
                if(obj[key]&&typeof obj[key] ==="object"){
                    objClone[key] = deepClone(obj[key]);
                }else{
                    //如果不是，简单复制
                    objClone[key] = obj[key];
                }
            }
        }
    }
    return objClone;
} 

let a=[1,2,3,4],b=deepClone(a);
a[0]=2;
console.log(a,b);

2.JSON objects and parse stringify are deep copy of
the object that this method can only be dealt with correctly Number, String, Boolean, Array, flat objects, i.e. those data structures can be represented directly json. RegExp object is not a deep copy in this way.

var obj = {name:'zhangsan',age:23,company : { name : '阿里', address : '杭州'} };
var newobj = JSON.parse(JSON.stringify(obj));
obj.company.name = "阿里巴巴";
obj.name = "zhangsan1";
console.log(obj);//{name:'zhangsan1',age:23,company : { name : '阿里巴巴', address : '杭州'} }
console.log(newobj);// {name:'zhangsan',age:23,company : { name : '阿里', address : '杭州'} }

3.lodash library achieve deep copy
lodash very popular library, provided lodash.cloneDeep () to achieve a deep copy
4. extend achieved by the method of deep copy of jQuery
var Array = [1,2,3,4];
var newArray .extend $ = (to true, [], Array);
5. the use of the Object.create () method of
directly var newObj = Object.create (oldObj), can achieve the effect of a deep copy.

function deepClone(initalObj, finalObj) {
    var obj = finalObj || {};
    for (var i in initalObj) {
        var prop = initalObj[i];
        // 避免相互引用对象导致死循环，如initalObj.a = initalObj的情况
        if(prop === obj) {
            continue;
        }
 
        if (typeof prop === 'object') {
            obj[i] = (prop.constructor === Array) ? [] : Object.create(prop);
        } else {
            obj[i] = prop;
        }
    }
    return obj;
}