浅拷贝的幕后功臣：Object.assign原理及实现

引子

上篇文章中，我们了解了赋值、浅拷贝和深拷贝的概念，以及它们之间的区别。同时，我们也介绍了一种常用的深拷贝方案。今天，我们就来深入研究浅拷贝的幕后功臣——Object.assign。我们将从它的实现原理讲起，然后一步一步地带你手动实现一个浅拷贝函数。最后，我们还会留下一道面试题，期待你的精彩评论！

Object.assign的实现原理

Object.assign()方法用于将一个或多个源对象的属性复制到目标对象。它的语法如下：

Object.assign(target, ...sources)

其中，target是目标对象，sources是源对象。

Object.assign()方法的实现原理并不复杂。它首先检查目标对象是否为null或undefined。如果是，则抛出一个TypeError异常。然后，它将源对象中的所有可枚举属性复制到目标对象中。如果源对象中存在与目标对象中同名的属性，则目标对象中的该属性将被源对象中的属性覆盖。

手动实现浅拷贝

现在，我们来手动实现一个浅拷贝函数。这个函数将接受两个参数：目标对象和源对象。然后，它将源对象中的所有可枚举属性复制到目标对象中。如果源对象中存在与目标对象中同名的属性，则目标对象中的该属性将被源对象中的属性覆盖。

以下是浅拷贝函数的实现代码：

function shallowCopy(target, source) {
  for (let key in source) {
    if (source.hasOwnProperty(key)) {
      target[key] = source[key];
    }
  }
  return target;
}

面试题

现在，我们来一道面试题。假设我们有一个对象：

const obj = {
  name: 'John Doe',
  age: 30,
  address: {
    street: '123 Main Street',
    city: 'Anytown',
    state: 'CA',
    zip: '12345'
  }
};

如果我们使用浅拷贝函数将obj对象复制到一个新的对象newObj中，那么newObj对象的address属性指向的地址和obj对象的address属性指向的地址是否相同？

答案：

是

解释：

浅拷贝函数只复制对象的可枚举属性。address属性是一个对象，它也是一个可枚举属性。因此，浅拷贝函数会将obj对象的address属性复制到newObj对象中。但是，浅拷贝函数不会复制address对象本身。因此，newObj对象的address属性指向的地址和obj对象的address属性指向的地址是相同的。

结语

通过这篇文章，我们深入了解了Object.assign的实现原理，并手把手地实现了浅拷贝函数。我们还解决了一道面试题，巩固了对浅拷贝的理解。希望这篇文章对你有所帮助！