当前位置：首页 > JavaScript

js实现extend

2026-04-05 23:27:46JavaScript

实现 extend 功能的几种方法

在 JavaScript 中实现类似 extend 的功能，通常指将一个对象的属性复制到另一个对象中。以下是几种常见的实现方式：

使用 Object.assign

Object.assign 是 ES6 引入的方法，用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。

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

const extended = Object.assign(target, source);
console.log(extended); // { a: 1, b: 2, c: 3 }

注意：Object.assign 执行的是浅拷贝，如果源对象的属性值是对象，拷贝的是引用。

js实现extend

使用展开运算符（Spread Operator）

ES6 的展开运算符也可以实现对象扩展。

const obj1 = { a: 1, b: 2 };
const obj2 = { c: 3, d: 4 };

const extended = { ...obj1, ...obj2 };
console.log(extended); // { a: 1, b: 2, c: 3, d: 4 }

自定义 extend 函数

可以自定义一个 extend 函数来实现更复杂的需求，比如深拷贝。

js实现extend

function extend(target, ...sources) {
  sources.forEach(source => {
    for (let key in source) {
      if (source.hasOwnProperty(key)) {
        if (typeof source[key] === 'object' && source[key] !== null) {
          target[key] = extend({}, source[key]);
        } else {
          target[key] = source[key];
        }
      }
    }
  });
  return target;
}

const obj1 = { a: 1, nested: { x: 10 } };
const obj2 = { b: 2, nested: { y: 20 } };

const result = extend({}, obj1, obj2);
console.log(result); // { a: 1, nested: { y: 20 }, b: 2 }

使用 jQuery 的 extend 方法

如果项目中使用了 jQuery，可以直接使用其 $.extend 方法。

const obj1 = { a: 1 };
const obj2 = { b: 2 };

const extended = $.extend(obj1, obj2);
console.log(extended); // { a: 1, b: 2 }

使用 Lodash 的 extend 或 merge 方法

Lodash 提供了 _.extend 和 _.merge 方法，后者支持深拷贝。

const obj1 = { a: 1, nested: { x: 10 } };
const obj2 = { b: 2, nested: { y: 20 } };

const extended = _.extend({}, obj1, obj2);
console.log(extended); // { a: 1, nested: { y: 20 }, b: 2 }

const merged = _.merge({}, obj1, obj2);
console.log(merged); // { a: 1, nested: { x: 10, y: 20 }, b: 2 }