ES5类式继承

最新推荐文章于 2023-07-05 09:46:17 发布

小刘今天学前端了吗

最新推荐文章于 2023-07-05 09:46:17 发布

阅读量92

点赞数

分类专栏： js基础文章标签： js

本文链接：https://blog.csdn.net/qq_43389779/article/details/115351581

版权

js基础专栏收录该内容

20 篇文章 0 订阅

订阅专栏

本文深入探讨了JavaScript中的三种继承方式：默认原型继承、借用构造函数和借用与原型结合。通过实例展示了如何创建对象、属性继承以及修改属性的影响。在默认模式下，子对象从父对象原型继承属性；借用构造函数时，子对象拥有独立的属性但无法继承原型方法；而借用与原型结合则兼顾属性独立与原型继承。

摘要由CSDN通过智能技术生成

1. 默认模式

function Parent () {
	this.name = 'p';
}
Parent.prototype.say = function () {
	console.log('hello');
}
function Child () {}
Chid.prototype = new Parent();

var p = new Parent();
var c = new Child();

p.hasOwnProperty('name');//true
c.hasOwnProperty('name');//false,子构造函数没有自己的name属性，是从Parent中继承而来

c.name = 'c';
console.log(p.name);//'c',修改子对象属性父对象属性也会一起改变

2.借用构造函数

function Parent () {
	this.name = 'p';
}
Parent.prototype.say = function () {
	console.log('hello');
}
function Child () {
	Parent.call(this);
}
var p = new Parent();
var c = new Child();

p.hasOwnProperty('name');//true
c.hasOwnProperty('name');//true,子构造函数有自己的name属性,不能继承父构造函数原型上的方法和属性

c.name = 'c';
console.log(p.name);//'p',修改子对象属性父对象属性不会一起改变

3. 借用和原型

function Parent () {
	this.name = 'p';
}
Parent.prototype.say = function () {
	console.log('hello');
}
function Child () {
	Parent.call(this);
}
Child.prototype = new Parent();

var p = new Parent();
var c = new Child();

p.hasOwnProperty('name');//true
c.hasOwnProperty('name');//true,子构造函数有自己的name属性,也能继承父构造函数原型上的方法和属性

c.name = 'c';
console.log(p.name);//'p',修改子对象属性父对象属性不会一起改变