当前位置：首页 > JavaScript

实现extend js

2026-02-02 08:06:53JavaScript

在 JavaScript 中实现 `extend` 功能

JavaScript 本身没有内置的 extend 方法，但可以通过多种方式实现对象或类的继承和扩展功能。以下是几种常见的方法：

使用 `Object.assign` 实现对象扩展

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

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

const extendedObj = Object.assign({}, obj1, obj2);
console.log(extendedObj); // { a: 1, b: 3, c: 4 }

使用展开运算符（Spread Operator）

ES6 的展开运算符可以更简洁地实现对象扩展。

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

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

实现类的继承

使用 extends 关键字可以实现类的继承。

class Parent {
  constructor(name) {
    this.name = name;
  }

  greet() {
    console.log(`Hello, ${this.name}`);
  }
}

class Child extends Parent {
  constructor(name, age) {
    super(name);
    this.age = age;
  }

  greet() {
    super.greet();
    console.log(`You are ${this.age} years old`);
  }
}

const child = new Child('Alice', 10);
child.greet();
// Output:
// Hello, Alice
// You are 10 years old

手动实现 `extend` 函数

如果需要手动实现一个 extend 函数，可以结合原型链实现继承。

function extend(Child, Parent) {
  Child.prototype = Object.create(Parent.prototype);
  Child.prototype.constructor = Child;
}

function Parent(name) {
  this.name = name;
}

Parent.prototype.greet = function() {
  console.log(`Hello, ${this.name}`);
};

function Child(name, age) {
  Parent.call(this, name);
  this.age = age;
}

extend(Child, Parent);

Child.prototype.greet = function() {
  Parent.prototype.greet.call(this);
  console.log(`You are ${this.age} years old`);
};

const child = new Child('Bob', 12);
child.greet();
// Output:
// Hello, Bob
// You are 12 years old

使用 Lodash 的 `_.extend` 或 `_.assign`

Lodash 提供了 _.extend 或 _.assign 方法，功能类似于 Object.assign。

const _ = require('lodash');

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

const extendedObj = _.extend({}, obj1, obj2);
console.log(extendedObj); // { a: 1, b: 3, c: 4 }