JavaScript的面向对象基于原型而非类，ES6的class是语法糖，底层仍用原型链实现继承。对象通过__proto__指向原型，查找属性时沿原型链向上追溯。函数的prototype属性被实例继承，new操作生成的对象原型指向构造函数的prototype。继承通过Object.create(父类.prototype)实现，子类原型链连接到父类，同时需修正constructor指向。class语法更简洁，但extends本质仍是原型链继承，掌握原型机制才能深入理解JavaScript对象模型。
JavaScript的面向对象机制和其他语言如Java或C++不同，它基于原型（prototype）而非类（class）来实现对象的继承与扩展。虽然ES6引入了class关键字，但这只是语法糖，底层依然是原型系统。理解原型是掌握JavaScript面向对象编程的关键。
原型与原型链：对象如何共享属性和方法
每个JavaScript对象都有一个内部链接指向另一个对象，这个对象就是它的原型。当访问一个对象的属性时，如果该对象本身没有这个属性，引擎会自动查找其原型对象，这个过程一直持续到原型链的末端——通常是Object.prototype，最终返回null。
函数在JavaScript中是一等公民，而每个函数都有一个prototype属性，这个属性是一个对象，包含可以被实例继承的属性和方法。使用new操作符调用函数时，新创建的对象的原型就会指向该函数的prototype。
例如：
立即学习“Java免费学习笔记（深入）”；
function Person(name) { this.name = name;}Person.prototype.greet = function() { console.log("Hello, I'm " + this.name);};const john = new Person("John");john.greet(); // 输出: Hello, I'm John
这里，john本身没有greet方法，但它能调用，是因为它通过原型链找到了Person.prototype上的定义。
构造函数、实例与原型的关系
理解构造函数.prototype、实例.__proto__和Object.getPrototypeOf()之间的关系至关重要。
Person.prototype 是构造函数的原型对象，用于为所有实例提供共享方法。 john.__proto__ 指向Person.prototype，这是实例访问原型的标准方式（不推荐直接使用__proto__，应使用Object.getPrototypeOf(john)）。 Person.prototype.constructor 默认指向Person函数本身。
可以通过以下代码验证：
Veed AI Voice Generator
Veed推出的AI语音生成器
77 查看详情 
console.log(john.__proto__ === Person.prototype); // trueconsole.log(Object.getPrototypeOf(john) === Person.prototype); // trueconsole.log(Person.prototype.constructor === Person); // true
利用原型实现继承
JavaScript中的继承通常通过“原型链”实现。子类的原型设置为父类的一个实例，从而让子类实例能够访问父类的方法和属性。
基本模式如下：
function Animal(name) { this.name = name;}Animal.prototype.speak = function() { console.log(this.name + " makes a sound.");};function Dog(name, breed) { Animal.call(this, name); // 调用父类构造函数 this.breed = breed;}// 建立原型链Dog.prototype = Object.create(Animal.prototype);Dog.prototype.constructor = Dog;Dog.prototype.bark = function() { console.log(this.name + " barks!");};const dog = new Dog("Rex", "German Shepherd");dog.speak(); // Rex makes a sound.dog.bark(); // Rex barks!
关键点在于使用Object.create(Animal.prototype)来设置Dog.prototype，这样既继承了方法，又不会执行Animal的构造函数逻辑。同时要手动恢复constructor指向，避免后续出错。
现代实践：class语法与底层原型的一致性
ES6的class语法让代码更清晰，但本质不变：
class Animal { constructor(name) { this.name = name; } speak() { console.log(this.name + " makes a sound."); }}class Dog extends Animal { constructor(name, breed) { super(name); this.breed = breed; } bark() { console.log(this.name + " barks!"); }}
这段代码与前面的原型写法功能一致。extends背后仍然是通过原型链连接Dog.prototype到Animal.prototype。使用class并不会改变JavaScript的原型机制，只是提供了更直观的语法。
基本上就这些。掌握原型，你就能真正理解JavaScript的对象模型，无论是否使用class，都能写出高效、可维护的面向对象代码。
以上就是深入理解JavaScript原型_面向对象编程实践的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/863514.html
微信扫一扫 
支付宝扫一扫 
