console 命令行工具 X clear

console

var person = {
    name: '响水滩',
    hobby: ['吃饭', ['睡觉', '踢足球']],
    date: new RegExp('\\w+'),
    function () {}
}

// var person1 = person

var person1 = JSON.parse(JSON.stringify(person))

person1.name = '乌蒙山'
person1.hobby[0] = '打游戏'

console.log(person)
console.log(person1)


function shallowCopy (obj) {
    var target = {}
    for (var i in obj) {
        if (obj.hasOwnProperty(i)) {
            target[i] = obj[i]
        }
    }
    return target
}

function deepClone (obj) {
    var target = new obj.constructor()

    if (typeof obj !== 'object') return obj

    if (obj instanceof RegExp) return new RegExp(obj)

    if (obj instanceof Date) return new Date(obj) 
    
    for (var i in obj) {
        if (obj.hasOwnProperty(i)) {
            target[i] = deepClone(obj[i])
        }
    }

    return target
}

//
// 1： 浅拷贝 赋值的区别
// 赋值: 
// 当我们把一个对象赋值给一个新的变量的时候,赋值的其实是该对象在栈中的地址,而不是堆中的数据,
// 也就是两个对象指向的其实是同一个储存空间,无论哪个对象发生改变,其实都是改变的储存空间的内容,
// 因此两个对象是联动的
// 浅拷贝:
// 重新在堆中创建内存,拷贝前后的对象基础数据类型互不影响,
// 但拷贝前后的对象的引用类型应共享同一块内存,会互相影响
// 深拷贝:
// 从堆内存中重新开辟一块区域存放新对象,
// 对对象中的子对象进行递归拷贝,拷贝前后的两个对象互不影响


//浅拷贝的实现方式:
// Object.assign() 
// lodash _.clone
// ...扩展运算符
// Array.property.concat
// Array.property.slice 

// 深拷贝实现方式
// JSON.parse(JSON.stringify())
// 递归的操作
// cloneDeep 
// $.extend()

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=, initial-scale=">
	<meta http-equiv="X-UA-Compatible" content="">
	<title>JS的拷贝</title>
</head>
<body>
	
</body>
</html>