当前位置：首页 > JavaScript

js实现原型

2026-04-06 03:37:20JavaScript

原型的基本概念

在JavaScript中，每个对象都有一个原型（prototype），原型是一个对象，用于共享属性和方法。通过原型链，对象可以访问其原型上的属性和方法。

创建原型的方法

使用构造函数和prototype属性
通过构造函数创建对象时，可以利用prototype属性为所有实例共享方法或属性。

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

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

const person1 = new Person("Alice");
person1.greet(); // 输出: Hello, my name is Alice

使用Object.create()
Object.create()可以直接指定新对象的原型。

const personProto = {
    greet() {
        console.log(`Hello, my name is ${this.name}`);
    }
};

const person2 = Object.create(personProto);
person2.name = "Bob";
person2.greet(); // 输出: Hello, my name is Bob

修改原型链

动态修改原型
可以通过__proto__或Object.setPrototypeOf()动态修改对象的原型（不推荐在生产环境中使用__proto__）。

const animal = {
    sound: "Generic sound",
    makeSound() {
        console.log(this.sound);
    }
};

const dog = {
    sound: "Bark"
};

Object.setPrototypeOf(dog, animal);
dog.makeSound(); // 输出: Bark

原型链的继承

实现继承
通过组合构造函数和原型链实现继承。

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

Animal.prototype.speak = function() {
    console.log(`${this.name} makes a noise.`);
};

function Dog(name) {
    Animal.call(this, name); // 调用父类构造函数
}

Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog;

const dog1 = new Dog("Rex");
dog1.speak(); // 输出: Rex makes a noise.

检查原型关系

使用instanceof和isPrototypeOf
instanceof检查对象是否在原型链上，isPrototypeOf检查某个对象是否是另一个对象的原型。

console.log(dog1 instanceof Dog); // true
console.log(Dog.prototype.isPrototypeOf(dog1)); // true

现代语法：Class语法糖

ES6的class语法简化了原型操作，但底层仍基于原型链。

js实现原型

class Animal {
    constructor(name) {
        this.name = name;
    }
    speak() {
        console.log(`${this.name} makes a noise.`);
    }
}

class Dog extends Animal {
    speak() {
        console.log(`${this.name} barks.`);
    }
}

const dog2 = new Dog("Max");
dog2.speak(); // 输出: Max barks.