一、定义:
1.数据类型:
数据分为基本数据类型和对象数据类型。
---- 基本数据类型:存储的是该对象的实际数据。
---- 对象类型数据:存储的是该对象在栈中引用,真实的数据存放在堆内存里。
2.复制数据:
基本数据类型存放的就是实际的数据,可直接复制。
对象数据存放的是对象在栈内存的引用,直接复制的是对象的引用。
3.浅拷贝与深拷贝
浅拷贝:原始类型为值传递,对象类型仍为引用传递。
深拷贝(对象/数组):所有元素或属性均完全复制,与原对象完全脱离,也就是说,所有对于新对象的修改都不会反映到原对象中。
显然,浅拷贝会带来一个很大的问题,就是,如果我复制的值是一个引用地址,那么我通过一个变量去修改这个对象,会导致所有该对象的引用都发生变化。
4.常用的拷贝技术:
(1)arr.concat():数组浅拷贝
(2)arr.slice():数组浅拷贝
(3)JSON.parse(JSON.stringify(arr/obj)): 数组或对象深拷贝, 但不能处理函数数据
(4)浅拷贝包含函数数据的对象/数组
(5)深拷贝包含函数数据的对象/数组
二、实例:
1.基本数据类型的浅拷贝
let a = 'abc'
let b = a
b = '123'
console.log(a)
console.log(b) // 没有对原来的数据影响
2.对象数据类型的浅拷贝
let obj = {
name: 'MsYagyang',
age: 18
}
let obj2 = obj // 保存的是obj的地址值
obj2.name = 'Li' // 本质上修改了原对象的属性值
console.log(obj)
3.函数的克隆
let fun1 = function () {
console.log('1111')
}
let fun2 = fun1
fun2 = function () {
console.log('2222')
}
fun1() // 没有对原来的对象产生影响 :函数的克隆会在堆空间单独开辟一片空间 与原来的对象互不影响
fun2()
深拷贝
// 准备工作 :如何正确判断判断数据的类型?
let obj3 = []
console.log(Object.prototype.toString.call(obj3))
// 创建一个用来判断数据类型的函数
function getObjClass(obj) {
let result = Object.prototype.toString.call(obj).slice(8, -1) //Array
if (result === 'Undefined') {
return 'Undefined'
}else if (result === 'Null') {
return 'Null'
}else {
return result
}
}
// 创建一个深度遍历对象/数组的函数
function deepClone(obj) {
let objClass = getObjClass(obj)
let result
if(objClass === 'Object') {
result = {}
}else if (objClass === 'Array') {
result = []
}else {
return obj // 如果是其他数据类型就直接返回 不进行复制
}
// 遍历目标对象
for(let key in obj) {
let value = obj[key]
if (getObjClass(value) === 'Object') {
result[key] = deepClone(value)
}else if (getObjClass(value) === 'Array') {
result[key] = deepClone(value)
}else {
result[key] = obj[key]
}
}
return result
}
let obj4 = {
name: 'haha',
age: 20,
sex: {
option1: '男',
option2: '女'
}
}
let obj5 = deepClone(obj4)
console.log(obj5, 'obj5')
obj5.sex.option1 = '不男不女'
console.log(obj4, 'obj4')
作者:Roger_CoderLife
链接:https:blog.csdn.net/Roger_CoderLife/article/details/82836718
本文为Roger_CoderLife的原创文章,著作权归作者所有,转载请注明原文出处,欢迎转载!