Object.assign() 深拷贝浅拷贝

一、数据类型 数据分为基本数据类型(String, Number, Boolean, Null, Undefined,Symbol)和对象数据类型。

基本数据类型的特点:直接存储在栈(stack)中的数据 引用数据类型的特点:存储的是该对象在栈中引用,真实的数据存放在堆内存里

引用数据类型在栈中存储了指针,该指针指向堆中该实体的起始地址。当解释器寻找引用值时,会首先检索其在栈中的地址,取得地址后从堆中获得实体。

  // 数据处理
                    let requestData = Object.assign({}, data.form); //
                    requestData.role = requestData.role.join();  // 数组转字符串,默认以,号隔开
                    requestData.region = JSON.stringify(data.cityPickerData);  

深拷贝的实现方式

JSON.parse(JSON.stringify())

注意: 原理: 用JSON.stringify将对象转成JSON字符串,再用JSON.parse()把字符串解析成对象,一去一来,新的对象产生了,而且对象会开辟新的栈,实现深拷贝。 这种方法虽然可以实现数组或对象深拷贝,但不能处理函数

浅拷贝的实现方式

Object.assign()

Object.assign() 方法可以把任意多个的源对象自身的可枚举属性拷贝给目标对象,然后返回目标对象。但是 Object.assign()进行的是浅拷贝,拷贝的是对象的属性的引用,而不是对象本身。 注意:当object只有一层的时候,是深拷贝

let abc = {
  aa:function () {
      alert("my name is abc to aa function")
  },
  bb:'2020-01-01',
  cc:{
    cad:"lusifer",
    ccdd:{
      names:"鲁斯菲尔",
      mw:{
        haz:"hanziqiang",
        lusfi:()=>"hello"
      }
    }
  }
}
var parse = Object.assign({},abc);
var va =  parse.cc.ccdd.mw.lusfi()
console.log(va)
console.info(parse)

Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。

  • demo
const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };

const returnedTarget = Object.assign(target, source);

console.log(target);
// expected output: Object { a: 1, b: 4, c: 5 }

console.log(returnedTarget);
// expected output: Object { a: 1, b: 4, c: 5 }

  • 语法 Object.assign(target, ...sources)
  • 参数 target 目标对象。sources 源对象。
  • 返回值 目标对象

数组的处理

  • Object.assign可以用来处理数组,但是会把数组视为对象
Object.assign([1, 2, 3], [4, 5])
// [4, 5, 3]
  • 上面代码中,Object.assign把数组视为属性名为 0、1、2 的对象,因此源数组的 0 号属性4覆盖了目标数组的 0 号属性1。

Object.defineProperty()

**Object.defineProperty()** 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回此对象。

**备注:**应当直接在 Objectopen in new window 构造器对象上调用此方法,而不是在任意一个 Object 类型的实例上调用。

const object1 = {};

Object.defineProperty(object1, 'property1', {
 value: 42,
 writable: false
});

object1.property1 = 77;
// throws an error in strict mode

console.log(object1.property1);
// expected output: 42

语法

Object.defineProperty(obj, prop, descriptor)