当前位置：首页 > JavaScript

js 实现面向对象

2026-01-30 11:15:52JavaScript

基于原型的面向对象实现

JavaScript 使用原型链实现面向对象编程。每个对象都有一个隐藏属性 [[Prototype]]（可通过 __proto__ 或 Object.getPrototypeOf() 访问），当访问对象属性时，若当前对象不存在该属性，会沿原型链向上查找。

构造函数通过 new 关键字创建实例：

function Person(name) {
  this.name = name;
}
Person.prototype.sayHello = function() {
  console.log(`Hello, I'm ${this.name}`);
};
const person = new Person('Alice');
person.sayHello(); // 输出: Hello, I'm Alice

类语法（ES6）

ES6 引入 class 语法糖，本质仍是基于原型的实现：

js 实现面向对象

class Animal {
  constructor(name) {
    this.name = name;
  }
  speak() {
    console.log(`${this.name} makes a noise`);
  }
}
class Dog extends Animal {
  speak() {
    super.speak();
    console.log(`${this.name} barks`);
  }
}
const dog = new Dog('Rex');
dog.speak();

对象字面量与工厂模式

通过对象字面量直接创建对象：

const car = {
  brand: 'Toyota',
  drive() {
    console.log(`Driving ${this.brand}`);
  }
};

工厂函数模式：

js 实现面向对象

function createUser(name) {
  return {
    name,
    logName() {
      console.log(this.name);
    }
  };
}
const user = createUser('Bob');

属性描述符与对象控制

使用 Object.defineProperty 定义属性特性：

const obj = {};
Object.defineProperty(obj, 'readOnlyProp', {
  value: 42,
  writable: false,
  enumerable: true
});

混入（Mixin）模式

实现多重继承的方式：

const canEat = {
  eat() {
    console.log('Eating');
  }
};
const canWalk = {
  walk() {
    console.log('Walking');
  }
};
function Person() {}
Object.assign(Person.prototype, canEat, canWalk);