使用prototype实现js继承以及重写方法(图解)

最新推荐文章于 2024-05-02 18:12:22 发布
VIP文章 最新推荐文章于 2024-05-02 18:12:22 发布
阅读量1.4k 收藏 4
点赞数
文章标签： javascript 多态
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/csy101/article/details/106149282
版权

原型链继承：子类的原型指向父类的实例
通过改变子类的prototype来实现

        function Animal(name) {
   
            this.name = name
            this.eat = function () {
   
                console.log(this.name + ' is eating ')
            }
        }
        
        Animal.prototype.say = function () {
   
            console.log('My name is ' + this.name)
最低0.47元/天 解锁文章
csy101
关注
  • 0
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JavaScript使用prototype属性实现继承操作示例
10-15
主要介绍了JavaScript使用prototype属性实现继承操作,结合实例形式详细分析了JavaScript使用prototype属性实现继承的相关原理、实现方法与操作注意事项,需要的朋友可以参考下
[渡一] 171111 原型链、方法重写、call&apply
simpleone_的博客
11-11 663
JS笔记
js中的继承与重写
ZhuangM
01-27 6921
rt. 用function 分别定义Person和Account类模型，其中Account从Person继承，并重写toString()方法 function go() { var acc1 = new Account('Taro', 'Shibuya1-1-2', '1001', 20000); var acc2 = new Account('Hanako', 'Akas
js继承中的方法重写
热门推荐
webnoob
11-02 1万+
1.面试中遇到的一道题，子类继承父类，父类有两个方法，重写其中一起方法。继承我是肯定是用组合方式继承，方法都是在原型上写的，重写的方法直接在子类的原型对象上写就ok了，因为对象的属性查找是按照原型链上就近原则的，先找到的方法就调用这个方法。 2.代码如下： // supcalss var parent = function(name,age){ this.name = name;
JS基础--子类型重写超类型方法原型链图解
yilia学习小园
05-06 848
首先我们创建一个父类： // 创建一个父类构造函数 function Parent () { this.parentProperty = '父类属性'; } // 为父类添加一个原型方法 Parent.prototype.getParentProperty = function () { return this.parentProperty; } 此时的原型链是这样的： 接下来创建一个子类...
Dog test1 = new Dog()的解释
weixin_30266885的博客
11-02 325
转载于:https://www.cnblogs.com/classmethond/p/9894015.html
JavaScript中重写（override）
cnds123的专栏
07-13 2332
JavaScript中重写（override）
JS 继承与重写
sky_fate的专栏
01-13 970
JS 继承与重写
重写原型对象（prototype）
BrightLD的博客
01-15 904
重写后constructor属性的变化以及处理 //创建一个Parent实例 function Parent() { this.name = "wgh"; } //重写Parent的原型对象，并为其手动添加constructor属性，注意在ECMAScript5中默认的constructor是不可枚举的，但是我们手动设置的是可以枚举的，如果要处理的话我们可以通过Object.defi
js:深入prototype（下：原型重写）
octopus的专栏
05-03 3393
//当属性和方法特别多时，编写起来不是很方便，可以通过json的格式来编写 //由于原型重写，而且没有通过Person.prototype来指定，此时的constructor不会再指向Person而是指向Object //如果constructor真的比较重要，可以在json中说明原型的指向 function Person(){    } Person.prototype = {
（JavaScript）中的类继承（extends、重写方法、重写constructor、重写类字段、[[HomeObject]]）
AnitaSun的博客
12-07 8865
"extends"关键字 class Animal { constructor(name) { this.speed = 0; this.name = name; } run(speed) { this.speed = speed; alert(`${this.name} runs with speed ${this.speed}.`); } stop() { this.speed = 0; alert(`${this.name} stan
JavaScript不使用prototype和new实现继承机制
10-24
主要介绍了JavaScript不使用prototype和new实现继承机制的相关资料,需要的朋友可以参考下
javascript基于prototype实现类似OOP继承的方法
11-23
本文实例讲述了javascript基于prototype实现类似OOP继承的方法。分享给大家供大家参考，具体如下： 这里要说明的是，公有属性（使用this.修饰符）可以被覆盖，私有属性(使用var 修饰符)不能被覆盖 子类不能访问父类...
JS伪继承prototype实现方法示例
01-21
本文实例讲述了JS伪继承prototype实现方法。分享给大家供大家参考，具体如下： 众所周知JS中没有类的概念，但是要想实现类的功能可以同过function模拟。如： 第一种继承 （属性继承） //该函数相当于是一个构造器...
报表控件Stimulsoft在JavaScript报告工具中的事件：查看器事件（上）
励志做最业余的专业博主，控件产品可以私我~
04-28 864
在本文中，我们为JS报告工具中的查看器事件提供了全面的指南，包括它们的详细描述、参数列表等一系列详细内容。
bpmn-js推荐几款常用的插件
飞云先生
04-30 117
bpmn-js整体框架库的风格是以组件的方式进行实现的，这样的结构也更加便于我们更好的对其进行功能扩展，以及客制化功能实现。其实bpmn.io已经为我们实现了较多场景的组件的实现，了解对应组件的功能更能便于我们区分是否需要自己实现，降低重复造轮子的行为，提高开发效率，本篇文章主要是介绍常见的bpmn-js中使用的组件库。
基于React实现B站评论区
最新发布
stu_kk的博客
05-02 912
使用React构建了一个仿照B站基本的前端评论系统，实现了动态加载、排序、添加和删除评论的基本功能。通过React的状态管理和事件处理机制，实现了交互式的用户体验。但是在实际应用中，还需考虑与后端接口的交互、错误处理、分页加载、以及更复杂的用户交互逻辑。
《ElementUI 基础知识》el-tabs header 监听鼠标中键滚动时左右滑动（ElementPlus同样适用）
前端技术
04-29 978
监听 el-tabs 头在鼠标 hover 时。滑动鼠标中键，可左右滑动！
表格隔行变色
weixin_54339833的博客
05-02 376
2.$(document).ready() 是 jQuery 中的一个函数，它确保在文档结构（DOM）加载完成后执行指定的代码。与原生 JavaScript 的 window.onload 不同，$(document).ready() 会在 HTML 文档结构被加载和解析完成后立即执行，而无需等待样式表、图片和子框架的完成加载。if (index % 2 === 0) { // 偶数行。if (i % 2 === 0) { // 偶数行。// 可以省略，因为默认背景色通常是白色。
在javaScript中实现继承方法
06-02
在 JavaScript 中，实现继承方法有以下几种方式： 1. 原型继承：利用原型链实现继承。通过将父类的实例作为子类的原型，子类就可以访问到父类的属性和方法。例如： ```javascript function Parent() { this.name = 'parent'; } Parent.prototype.sayName = function() { console.log(this.name); } function Child() {} Child.prototype = new Parent(); var child = new Child(); child.sayName(); // 输出：parent ``` 2. 构造函数继承：利用 call 或 apply 方法将父类构造函数的作用域赋给子类。这种方式可以实现多继承。例如： ```javascript function Parent(name) { this.name = name; } function Child(name) { Parent.call(this, name); } var child = new Child('child'); console.log(child.name); // 输出：child ``` 3. 组合继承：结合原型继承和构造函数继承，既可以继承父类的属性和方法，又可以实现子类实例的独立。例如： ```javascript function Parent(name) { this.name = name; } Parent.prototype.sayName = function() { console.log(this.name); } function Child(name, age) { Parent.call(this, name); this.age = age; } Child.prototype = new Parent(); Child.prototype.constructor = Child; var child = new Child('child', 18); console.log(child.name); // 输出：child console.log(child.age); // 输出：18 child.sayName(); // 输出：child ``` 4. 原型式继承：利用 Object.create() 方法创建一个新对象，以某个对象为原型，然后再对新对象进行修改。例如： ```javascript var parent = { name: 'parent', sayName: function() { console.log(this.name); } }; var child = Object.create(parent, { name: { value: 'child' } }); child.sayName(); // 输出：child ``` 5. 寄生式继承：与原型式继承类似，但是在增强对象的方法时使用了一个函数封装。例如： ```javascript var parent = { name: 'parent', sayName: function() { console.log(this.name); } }; function createChild(original) { var child = Object.create(original); child.sayName = function() { console.log('hello, ' + this.name); } return child; } var child = createChild(parent); child.sayName(); // 输出：hello, parent ``` 需要注意的是，在实现继承时应该注意避免出现属性和方法的重复定义，以及避免在父类的原型上修改引用类型的属性。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值