一 手写浅拷贝函数的代码实现
1.1 浅拷⻉
浅拷⻉,指的是创建新的数据,这个数据有着原始数据属性值的⼀份精确拷⻉
如果属性是基本类型,拷⻉的就是基本类型的值。如果属性是引⽤类型,拷⻉的就是内存地址
即浅拷⻉是拷⻉⼀层,深层次的引⽤类型则共享内存地址
下⾯简单实现⼀个浅拷⻉
JS
function shallowClone(obj) {
const newObj = {};
for(let prop in obj) {
if(obj.hasOwnProperty(prop)){
newObj[prop] = obj[prop];
}
}
return newObj;
}
在 JavaScript 中,存在浅拷⻉的现象有:
- Object.assign
- Array.prototype.slice() , Array.prototype.concat()
- 使⽤拓展运算符实现的复制
1.1.1 Object.assign
JS
var obj = {
age: 18,
nature: ['smart', 'good'],
names: {
name1: 'fx',
name2: 'xka'
},
love: function () {
console.log('fx is a great girl')
}
}
var newObj = Object.assign({}, fxObj);
1.1.2 slice()
JS
const fxArr = ["One", "Two", "Three"]
const fxArrs = fxArr.slice(0)
fxArrs[1] = "love";
console.log(fxArr) // ["One", "Two", "Three"]
console.log(fxArrs) // ["One", "love", "Three"]
1.1.3 concat()
JS
const fxArr = ["One", "Two", "Three"]
const fxArrs = fxArr.concat()
fxArrs[1] = "love";
console.log(fxArr) // ["One", "Two", "Three"]
console.log(fxArrs) // ["One", "love", "Three"]
1.1.4 拓展运算符
JS
const fxArr = ["One", "Two", "Three"]
const fxArrs = [...fxArr]
fxArrs[1] = "love";
console.log(fxArr) // ["One", "Two", "Three"]
console.log(fxArrs) // ["One", "love", "Three"]