js 实现extend
实现 JavaScript 的 extend 功能
在 JavaScript 中,extend 通常用于将一个对象的属性复制到另一个对象,实现继承或混合功能。以下是几种常见的实现方式:
使用 Object.assign
Object.assign 是 ES6 引入的方法,用于将所有可枚举属性从一个或多个源对象复制到目标对象。
function extend(target, ...sources) {
return Object.assign(target, ...sources);
}
const obj1 = { a: 1 };
const obj2 = { b: 2 };
const result = extend(obj1, obj2);
console.log(result); // { a: 1, b: 2 }
手动实现浅拷贝
如果需要在非 ES6 环境中实现 extend,可以手动遍历源对象的属性并复制到目标对象。
function extend(target, source) {
for (let key in source) {
if (source.hasOwnProperty(key)) {
target[key] = source[key];
}
}
return target;
}
const obj1 = { a: 1 };
const obj2 = { b: 2 };
extend(obj1, obj2);
console.log(obj1); // { a: 1, b: 2 }
实现深拷贝
浅拷贝无法处理嵌套对象,深拷贝会递归复制所有嵌套属性。
function deepExtend(target, source) {
for (let key in source) {
if (source.hasOwnProperty(key)) {
if (typeof source[key] === 'object' && source[key] !== null) {
target[key] = target[key] || {};
deepExtend(target[key], source[key]);
} else {
target[key] = source[key];
}
}
}
return target;
}
const obj1 = { a: { b: 1 } };
const obj2 = { a: { c: 2 } };
deepExtend(obj1, obj2);
console.log(obj1); // { a: { b: 1, c: 2 } }
使用 jQuery 的 $.extend
如果项目中已引入 jQuery,可以直接使用其提供的 $.extend 方法。
const obj1 = { a: 1 };
const obj2 = { b: 2 };
const result = $.extend(obj1, obj2);
console.log(result); // { a: 1, b: 2 }
使用 Lodash 的 _.extend 或 _.assign
Lodash 提供了类似的工具函数 _.extend 或 _.assign。

const obj1 = { a: 1 };
const obj2 = { b: 2 };
const result = _.extend(obj1, obj2);
console.log(result); // { a: 1, b: 2 }
注意事项
- 浅拷贝只复制对象的顶层属性,嵌套对象会被共享。
- 深拷贝会递归复制所有嵌套对象,但可能影响性能。
- 使用现成库(如 jQuery 或 Lodash)可以避免手动实现中的潜在问题。






