Object.assign()是什么?有什么作用?

97 阅读3分钟

如题

当面试官问你Object.assign()是什么?有什么作用?你该如何回答?

本文给出了一套涉及到Object.assign()、深拷贝、浅拷贝等一系列知识点全流程的回答 如果你按我接下来的方式进行回答,那么你会给面试官留下深刻的印象,在大厂面试中,这种回答也能让我们拖住死亡25分钟

一、首先,介绍下Object.assign的基础概念

Object.assign()是JavaScript内置对象Object的一个重要方法,主要用于实现对象的浅拷贝和属性合并。它的基本语法是:

Object.assign(target, source1, source2, ...)

该方法将一个或多个源对象(source)的可枚举属性浅拷贝到目标对象(target)上,然后返回这个修改后的目标对象。

核心特点:

  1. 浅拷贝:只复制对象的第一层属性
  2. 属性覆盖:后传入的源对象属性会覆盖前面同名属性
  3. 可枚举性:只拷贝对象自身可枚举的属性

示例:

const target = { a: 1, b: 2 };
const source = { b: 3, c: 4 };

Object.assign(target, source);
// 结果:{ a: 1, b: 3, c: 4 }

二、具体说说深拷贝浅拷贝

深拷贝与浅拷贝的区别

浅拷贝

  • 只复制对象的第一层级属性
  • 对于引用类型的属性,复制的是引用地址而非实际值
  • 修改嵌套对象会影响原对象

深拷贝

  • 递归复制对象的所有层级
  • 每个属性都是独立的副本
  • 修改任何属性都不会影响原对象

三、然后,讲讲常见的浅拷贝实现方式

  1. Object.assign()

    const copy = Object.assign({}, original);
    
  2. 展开运算符(...)

    const copy = {...original};
    
  3. 数组方法

    • Array.prototype.slice()
    • Array.prototype.concat()

四、再讲讲深拷贝的实现方式

1. JSON方法(简单但有限)

const deepCopy = JSON.parse(JSON.stringify(original));

局限性

  • 忽略undefinedfunctionSymbol类型
  • 无法处理循环引用
  • 会丢失Date对象等特殊对象的原型

2. 手写深拷贝函数(完整实现)

function deepClone(target, map = new WeakMap()) {
    // 基本数据类型直接返回
    if (typeof target !== 'object' || target === null) {
        return target;
    }
    
    // 处理循环引用
    if (map.get(target)) {
        return map.get(target);
    }
    
    // 初始化克隆对象
    let cloneTarget = Array.isArray(target) ? [] : {};
    map.set(target, cloneTarget);
    
    // 递归拷贝所有属性
    for (const key in target) {
        if (target.hasOwnProperty(key)) {
            cloneTarget[key] = deepClone(target[key], map);
        }
    }
    
    return cloneTarget;
}

3. 其他深拷贝方案

  • 使用第三方库如lodash的_.cloneDeep()
  • 针对特殊对象类型(Date, RegExp等)做特殊处理


面试回答策略建议

  1. 先回答基本概念:简明扼要说明Object.assign的作用
  2. 展开细节:讨论浅拷贝特点、属性覆盖规则等
  3. 延伸话题:自然过渡到深/浅拷贝的区别
  4. 展示深度:讨论各种拷贝方式的实现和优劣
  5. 结合实际:分享在实际项目中的应用经验

这种回答方式不仅能展示你对JavaScript对象的深入理解,还能体现你系统化的知识结构,给面试官留下专业且全面的印象。