深拷贝呀,浅拷贝,再来一次复习整理

什么是浅拷贝?

借赋值的形式拷贝引用对象,指向的是同一个地址,修改对象是原对象也会修改

什么是深拷贝?

完全拷贝一个新对象,修改对象是原对象不会更改

浅拷贝的几种方案

1)  等号赋值

let apple = { color: 'red'};
let newApple = apple;

2) Object.assign()

let apple = {
  size: {
    color: 'red'
  }
};
let newApple = Object.assign({}, apple);
newApple.size.color = 'green';
console.log(apple.size.color); // green

3) 数组concat方法

let apple = [1, {color: 'red'} ];
let newApple = apple.concat();
newApple[1].color = 'green';
console.log(apple[1].color) // green

4) 数组的slice方法

let apple = [1, {color: 'red'} ];
let newApple = apple.slice();
newApple[1].color = 'green';
console.log(apple[1].color) // green

深拷贝的几种方案

1) 对象只有一层时, 可用Object.assign()实现

let apple = { color: 'red' };
let newApple = Object.assign({},apple);
newApple.color = 'green';
console.log(apple); //{color: 'red'}

2) JSON.parse(JSON.stringify())

  • 用JSON.stringify将对象转成JSON字符串,再用JSON.parse()把字符串解析成对象
  • 可以实现数组或对象深拷贝,但不能处理函数
let apple = [1, {color: 'red'} ];
let newApple = JSON.parse(JSON.stringify(apple));
newApple[1].color = "green";
console.log(apple) // 原对象未改变

 3) 递归实现一个深拷贝

  • 遍历数组,对象直到最里层为基本数据类型,再进行复制
// 在JavaScript中,想要判断某个对象值属于哪种内置类型,最靠谱的做法就是通过Object.prototype.toString方法.
function dataType(value) {
  return Object.prototype.toString.call(value).slice(8, -1);
}
function clone(value) {
  let result, currentType  = dataType(value);
  if (currentType === 'Object') {
    result = {}
  } else if (currentType === 'Array') {
    result = []
  } else {
    return value
  }
  for (let i in value) {
    if (dataType(value[i]) === 'Object' || dataType(value[i]) === 'Array') {
      result[i] = clone(value[i])
    } else {
      result[i] = value[i]
    }
   }
   return result
 }
 var apple = {
   name: 'yang',
   list: {
     id: [1, 2, 4],
     color: 'red'
   }
 }
 var newApple = clone(apple)
posted @ 2020-02-16 15:36  Tiboo  阅读(164)  评论(0编辑  收藏  举报