JS中面向对象中的继承(常用写法)---核心部分
1、基本概念
接下来介绍,面向对象中继承的两种常用写法。即混合继承(构造函数+原型)和class继承。推荐class继承
需要用到的知识点,构造函数、原型与原型链。
2、混合继承
2.1构造函数:apply/call实现
function Person(name, age, sex) {//构造函数
this.name = name;
this.age = age;
this.sex = sex;
}
Person.prototype.singing = function () {//原型上的方法
console.log('人都唱歌');
}
function Student(name, age, sex, pro) {
//this:实例对象,即Student类实例
//******继承构造函数里面的属性和方法*******。
//构造函数的继承。arguments:父类函数的参数。
Person.apply(this, arguments);
//Person.call(this, name, age, sex);
this.pro = pro;
}
2.2原型prototype:
(1)原型链继承---最优
//******继承原型下面的方法(原型链继承)*******。
//父类的实例给子类的原型。
//弊端:子类的构造函数被父类覆盖了。
Student.prototype = new Person();
Student.prototype.constructor = Student;//将子类的构造函数恢复
(2)拷贝继承
第一种
for (let i in Person.prototype) { //浅拷贝,for...in...是成立的
Student.prototype[i] = Person.prototype[i];
}
第二种
Object.assign(Student.prototype, Person.prototype);//浅拷贝
这样就实现了继承类里面的构造函数和原型上的方法属性,并且保留了自身的属性方法。
3、class继承
核心关键字:extends、super
super:
class Person {
constructor(name, age, sex) {//constructor:构造函数。
this.name = name;
this.age = age;
this.sex = sex;
}
showinfo() {
return `你的姓名是:${this.name},你今年${this.age}岁,你是${this.sex}的`;
}
}
class Student extends Person {
constructor(name, age, sex, pro) {
//继承,包括父类属性和方法 这里super当函数使用的。
super(name, age, sex);
this.pro = pro;
}
showinfo() {//重写showinfo方法
console.log(super.showinfo() + `,我的专业是${this.pro}`);//这里super当对象使用,调用父类的方法
}
}
let s1 = new Student('lisi', 200, '女', 'web开发');
console.log(s1.name);//lisi
s1.showinfo();//输出:你的姓名是:lisi,你今年200岁,你是女的,我的专业是web开发
最后
大自然不需要代码,但人类需要。---作者留
JS中面向对象中的继承(常用写法)---核心部分的更多相关文章
- 探讨 JS 的面向对象中继承的那些事
最近学了 JS 的面向对象,这篇文章主要是探讨 JS 的面向对象中继承的那些事. JS中继承的特点: 1.子类继承父类: 2.子类可以用父类的方法和属性 3.子类的改变可以不影响父类 下面用一个例子来 ...
- 实用JS系列——面向对象中的类和继承
背景: 在最开始学习JavaScript时,我们就知道,它是一种脚本语言,也有面向对象机制.但它的面向对象继承机制是基于原型的,即Prototype.今天,我们就来找一下JS中OO的影子. 创建类 1 ...
- JS高级 - 面向对象5(继承,引用)
<script type="text/javascript"> //------------------Person类 //(Person)的构造函数 function ...
- 关于js中原生构造函数的继承
前言 在如今快节奏的工作当中,很多基础的东西会渐渐地被丢掉.就如继承这个话题,写React的同学应该都是class xxx extends React.Component,然而这可以理解为es5的一个 ...
- Python3 与 C# 面向对象之~继承与多态 Python3 与 C# 面向对象之~封装 Python3 与 NetCore 基础语法对比(Function专栏) [C#]C#时间日期操作 [C#]C#中字符串的操作 [ASP.NET]NTKO插件使用常见问题 我对C#的认知。
Python3 与 C# 面向对象之-继承与多态 文章汇总:https://www.cnblogs.com/dotnetcrazy/p/9160514.html 目录: 2.继承 ¶ 2.1.单继 ...
- js中的几种继承方法
JS作为面向对象的弱类型语言,继承也是其非常强大的特性之一. 继承:子承父业:一个原本没有某些方法或属性的对象,统一写方法,拿到了另外一个对象的属性和方法 下面是js中的几种继承方式 1.改变this ...
- js中的原型、继承的一些想法
最近看到一个别人写的js类库,突然对js中的原型及继承产生了一些想法,之前也看过其中的一些内容,但是总不是很清晰,这几天利用空闲时间,对这块理解了一下,感觉还是有不通之处,思路上没那么条理,仅作为分享 ...
- PHP面向对象中常用的关键字和魔术方法
PHP面向对象中常用的关键字 final 1.final不能修饰成员属性(类中常量不是用这个关键字) 2.final只能修饰类和方法 作用: 使用fi ...
- js中面向对象编程
一.理解对象: 第一种:基于Object对象 var person = new Object(); person.name = 'My Name'; person.age = 18; person.g ...
随机推荐
- Horizon公司环境
- 在virtualenv中安装NumPy、 SciPy、 scikit-learn、 matplotlib
首先要进入对应的虚拟环境 然后安装包 这里把安装源改成使用豆瓣的源进行下载 这样的话 下载速度会快很多 安装numpy包 pip install numpy -i https://pypi ...
- OpenCV Laplace 算子
#include "opencv2/imgproc/imgproc.hpp" #include "opencv2/highgui/highgui.hpp" #i ...
- 10X genomics|cell base|in-vivo based|model organisms|SBI|
生命组学-药物基因组学 精准医学的内容有个人全基因组测序,移动可穿戴设备,它可以实时监测,深度学习模型预测疾病,对疾病预测做到有效.安全和可控. 药物基因组学就是研究疾病.化合物和靶点之间的关系,关键 ...
- 吴裕雄--天生自然 R语言开发学习:聚类分析
#-------------------------------------------------------# # R in Action (2nd ed): Chapter 16 # # Clu ...
- 吴裕雄--天生自然 R语言开发学习:基本图形(续三)
#---------------------------------------------------------------# # R in Action (2nd ed): Chapter 6 ...
- LoraLU
一.定义动画过程中形成的状态用transform transform 分为2D 和 3D,主要包含以下几种变换:旋转rotate.扭曲skew.缩放scale和移动 translate以及矩阵变形ma ...
- 如何安装与配置MySQL
关键词:MySQL,安装,配置 这一节,我们讨论一下MySQL的安装配置与卸载 下载 网址:https://dev.mysql.com/downloads/mysql/ 选择社区版,找到对应的电脑,开 ...
- MDEV入门
------------- MDEV入门------------- 对于我们这些人知道如何使用的mdev ,底漆可能似乎跛.为其他人的mdev是一个神秘的黑匣子,他们听到的是真棒,但不能似乎得到他们的 ...
- 金矿还是大坑 VR创业真有那么美好?
VR创业真有那么美好?"> 近段时间,一个段子在疯狂流传:彩票中奖的1000万,其实是存放在银行里,而彩民每次花两块钱买彩票,其实就是去输一次密码,只要够坚持,总会取出那1000万-- ...