Javascript继承的两种经典模式

比眉伴天荒 2022-06-01 11:54 201阅读 0赞

第一种：原型继承

使用原型继承来创建一个Pet对象，和一个继承它的Cat对象。Javascript教程中常常能见到这种经典的继承模式：

var Pet = function(name, legs) \{

this.name = name;

this.legs = legs;

\};

Pet.prototype.getDetails = function() \{

return this.name + ' has ' + this.legs + ' legs';

\};

var Cat = function(name) \{

Pet.call(this, name, 4);

\};

Cat.prototype = new Pet();

Cat.prototype.action = function() \{

return 'Catch a bird';

\};

var petCat = new Cat('Felix');

var details = petCat.getDetails();

var action = petCat.action();

console.log(details);//Felix has 4 legs

console.log(action);// Catch a bird

petCat.name = 'Sylvester';

petCat.legs = 7;

details = petCat.getDetails();

console.log(details);//Sylvester has 7 legs

第二种：函数继承

另一种选项无需使用prototype或new，而是利用javascript的“函数继承”特性来吸收和增强对象实例；

var pet = function(name, legs) \{

var that = \{

name: name,

getDetails: function() \{

return that.name + ' has ' + legs + ' legs';

\}

\};

return that;

\}

var cat = function(name,num) \{

var that = pet(name, num);

that.action = function() \{

return 'Catch a bird';

\}

return that;

\}

var petCat2 = cat('renlei',4);

var details = petCat2.getDetails();

var action = petCat2.action();

console.log(details);//renlei has 4 legs

console.log(action);//Catch a bird

petCat2.name = 'Sylvester';

petCat2.legs = 7;

details = petCat2.getDetails();

console.log(details);//Sylvester has 4 legs

发表评论取消回复

表情：

评论列表（有 0 条评论，201人围观）

还没有评论，来说两句吧...

相关阅读

相关 Javascript中的几种继承？如何实现继承？

在 JavaScript 内, 继承是面向对象变成中一个重要的开发思想, 核心就是让 A 对象使用 B 对象的属性和方法. 说白了, 就是为了资源整合, 让我们的代码复用性更高

末蓝、/ 2024年03月25日 06:08/ 0 赞/ 44 阅读

相关 JavaScript继承的几种方法

文章目录继承 1. 什么是继承例子: 面向对象的特性:封装,继承,多态 2. JavaScr

小咪咪/ 2023年01月13日 13:59/ 0 赞/ 134 阅读

相关 javascript 的七种继承方式（七）类的继承

前言前面我们已经介绍了javascript中6种继承方式，这6中继承方式都是基于es5的，那么接下来我们要讲的是es6中新增的一种继承方式—— 类的继承类在

╰+哭是因爲堅強的太久メ/ 2022年11月30日 15:53/ 0 赞/ 196 阅读

相关 javascript 的七种继承方式（三）组合继承

组合继承前面两篇我们了解到：原型链继承存在着引用类型问题，而借用构造函数又无法实现函数复用和原型方法继承的问题。那么能不能把两者结合一下，取其精华，弃其糟粕？答案是肯定

不念不忘少年蓝@/ 2022年11月29日 08:51/ 0 赞/ 187 阅读

相关再看javaScript伪经典继承

为什么叫伪经典继承呢，因为javaScript中真的没有类。这里是两个伪经典继承的例子，第一种看上去更容易明明白，第二种只是在第一种的

左手的ㄟ右手/ 2022年08月22日 11:23/ 0 赞/ 114 阅读

相关实现javaScript对象的"继承"的两种方法(prototype与闭包)

javaScript的prototype属性: 什么是prototype: javaScript的方法分为三类: > 类方法 > 对象方法 >

冷不防/ 2022年08月20日 12:27/ 0 赞/ 129 阅读

相关 Javascript继承的两种经典模式

第一种：原型继承使用原型继承来创建一个Pet对象，和一个继承它的Cat对象。Javascript教程中常常能见到这种经典的继承模式： var Pet = functio

比眉伴天荒/ 2022年06月01日 11:54/ 0 赞/ 202 阅读

相关 JavaScript-继承模式

继承发展史 1:传统的继承->原生链缺点:过多的继承了不用的属性。 2:借用构造函数缺点:不能基础构造函数的的原型，需要多调用一个构造函数，耗时。 3:共享原型

た入场券/ 2022年05月27日 00:45/ 0 赞/ 202 阅读

相关 JavaScript继承模式

JavaScript继承模式若需要了解原型与原型链相关内容，可参考本人的另一篇博客[JavaScript原型与原型链][JavaScript] 原型链继承一

﹏ヽ暗。殇╰゛Y/ 2022年05月19日 11:04/ 0 赞/ 167 阅读

相关【JavaScript】三种方式实现JavaScript继承

1，组合继承 function Parent(value) { this.val = value } Parent.prototype

一时失言乱红尘/ 2022年03月10日 08:46/ 0 赞/ 241 阅读