数据类型
基本数据类型
数据直接存储在栈(stack)里面
- String
- Number
- Boolean
- Null
- Undefined
- Symbol
对象数据类型
变量保存在栈里面 数据保存在堆里面
深拷贝和浅拷贝是只针对Object和Array这样的引用数据类型的。
基本数据类型
// 为video分配一个内存地址 并且值存储为 100
let video1 = 100
let video2 = 'Hello'
let video3 = false
// 把video的内容拷贝给了videoCopy 指向同一个内存地址
let videoCopy1 = video1
let videoCopy2 = video2
let videoCopy3 = video3
// 为videoCopy重新赋值 会开辟出一个新的内存地址 并且存储为 1000
videoCopy1 = 1000
videoCopy2 = 'Hello World'
videoCopy3 = true
console.log('video:1'+video1) // 100
console.log('videoCopy1:'+videoCopy1) // 1000
console.log('video2:'+video2) // Hello
console.log('videoCopy2:'+videoCopy2) // Hello World
console.log('video3:'+video3) // false
console.log('videoCopy3:'+videoCopy3) // true
.......
// 省略了一些其他的类型
深拷贝
数据互不影响
- JSON方法
- 可以实现数组或对象深拷贝,但不能处理函数。
- JSON数据格式
{ ' 键 ' : ' 值 '}
- 键值都需要引号
- JSON.stringify
- 将 JavaScript 对象转换为字符串 (JSON数据)
{ 键 : ' 值 '}
===>{ ' 键 ' : ' 值 '}
- JSON.parse
- 将JSON数据转换为 JavaScript 对象
{ ' 键 ' : ' 值 '}
===>{ 键 : ' 值 '}
- 对象
var list = { name:'zwj', age:22 } var listCopy = JSON.parse(JSON.stringify(list)) console.log('list:'+list.name) // list : zwj console.log('list:'+list.age) // list : 22 console.log('listCopy:'+listCopy.name) // listCopy : zwj console.log('listCopy:'+listCopy.age) // listCopy : 22 // 修改拷贝之后的数据 listCopy.name="修改name" listCopy.age="修改age" // 打印原始数据 console.log('list:'+list.name) // list : zwj console.log('list:'+list.age) // list : 22 // 打印修改之后的拷贝的数据 console.log('listCopy:'+listCopy.name) // listCopy:修改name console.log('listCopy:'+listCopy.age) // listCopy:修改age
- 数组
var list = [1,2,3,4,5] var listCopy = JSON.parse(JSON.stringify(list)) console.log('list:'+list) // list:1,2,3,4,5 console.log('listCopy:'+listCopy) // listCopy:1,2,3,4,5 // 修改拷贝之后的数据 listCopy[0] = 100 console.log('list:'+list) // list:1,2,3,4,5 console.log('listCopy:'+listCopy) // listCopy:100,2,3,4,5
- Object.assign
需要结合JSON方法 实现深拷贝
将所有可枚举属性的值从一个或多个源对象复制到目标对象
如果目标对象中的属性具有相同的键,则属性将被源对象中的属性覆盖
- Object.assign ( target , …sources )
- target:目标对象
- souce:源对象(可多个)
var person = { name:"zwj", age:22, hobbies:{ one:'sleep', two:'movie', three:'food' } } var copyPerson = Object.assign({},person) var copyPeople = JSON.parse(JSON.stringify(copyPerson)) console.log('修改拷贝数据之前') console.log(person.hobbies) console.log(copyPeople.hobbies) console.log('====================================') // 修改拷贝之后的数据 copyPeople.hobbies.three="money" copyPeople.hobbies.three = 'Money' console.log('修改拷贝数据之后') console.log(person.hobbies) console.log(copyPeople.hobbies)
浅拷贝
只复制某个对象的指针 并不复制对象本身 二者共用内存 拷贝之后的对象修改数据会影响原始对象下的数据
- slice方法
不带参数 代表全部复制
将数组的一部分的浅拷贝返回到一个新的数组对象中
不会修改原始数组
var list = ['one','two'] var listCopy = list.slice() console.log('listCopy:'+listCopy) // listCopy:one,two listCopy = ['three','four'] console.log('list:'+list) // list:one,two console.log('listCopy:'+listCopy) // listCopy:three,four
- concat方法
用于合并两个或多个数组。此方法不会更改现有数组,而是返回一个新数组
var list = ['one','two'] var listCopy = [].concat(list) console.log('listCopy:'+listCopy) // listCopy:one,two listCopy = ['three','four'] console.log('list:'+list) // list:one,two console.log('listCopy:'+listCopy) // listCopy:three,four
- Araay.from( )
从一个类似数组或可迭代对象创建一个新的,浅拷贝的数组实例
var list = ['one','two'] var listCopy = Array.from(list) listCopy.push = ['three','four'] // 打印原始数据和拷贝数据 console.log('list:'+list) // list:one,two console.log('listCopy:'+listCopy) // listCopy:one,two // 修改拷贝之后的数据 listCopy[1] = 'five' // 打印修改拷贝数据之后的数据 console.log('list:'+list) // list:one,two console.log('listCopy:'+listCopy) // listCopy:one,five
- 展开运算符
var list = ['one','two'] var listCopy = [...list] // 打印原始数据和拷贝数据 console.log('list:'+list) // list:one,two console.log('listCopy:'+listCopy) // listCopy:one,two // 修改拷贝之后的数据 listCopy[1] = 'five' // 打印修改拷贝数据之后的数据 console.log('list:'+list) // list:one,two console.log('listCopy:'+listCopy) // listCopy:one,five
- Object.assign
将所有可枚举属性的值从一个或多个源对象复制到目标对象
如果目标对象中的属性具有相同的键,则属性将被源对象中的属性覆盖
- Object.assign ( target , …sources )
- target:目标对象
- souce:源对象(可多个)
var person = { name:"zwj", age:22, hobbies:{ one:'sleep', two:'movie', three:'food' } } var copyPerson = Object.assign({},person) console.log('修改拷贝数据之前') console.log(person.hobbies) console.log(copyPerson.hobbies) console.log('===================================') // 修改拷贝之后的数据 copyPerson.hobbies.three = 'Money' console.log('修改拷贝数据之后') console.log(person.hobbies) console.log(copyPerson.hobbies)
补充有关slice和concat的知识点
var list = ['one','two',{name:'zwj',age:10}] var listCopy = list.slice() // var listCopy = [].concat(list) // 修改拷贝之后的基本数据类型 不会影响原数组中的数据 listCopy[0] = '修改one' // 修改拷贝之后的对象数据类型 会影响原数组中的数据 listCopy[2].age = 22 console.log('list:'+list) // list:one,two console.log('listCopy:'+listCopy) // listCopy:three,four console.log(list[0]) // one console.log(listCopy[0]) // 修改one console.log(list[2]) // {name: "zwj", age: 22} console.log(listCopy[2]) // {name: "zwj", age: 22}