1、基本概念

子类继承父类,但是不能影响父类。包括1.混合继承(构造函数+原型) 2.ES6新增class的继承。

接下来介绍,面向对象中继承的两种常用写法。即混合继承(构造函数+原型)class继承。推荐class继承

需要用到的知识点,构造函数、原型与原型链。

(1)构造函数:构造函数是函数、也是类。通过new调用,产生实例对象。通过实例对象访问对象下面具有的属性和方法。(构造函数内部的属性和方法都是私有的)
        属性:对象的特点,修饰对象的,私有。
        方法:对象的功能,共有的。
(2)prototype:每一个函数都有一个原型prototype对象,原型对象里面放的是对象共有属性和方法。
(3)__proto__:每一个对象都有一个__proto__属性,原型链依靠这个属性连接起来。

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继承

核心关键字:extendssuper

super:

  子类必须在constructor方法中调用super()方法,否则新建实例就会报错。以及,子类自己的this对象,必须通过父类构建,也就是说如果不调用super方法,无法使用this。
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中面向对象中的继承(常用写法)---核心部分的更多相关文章

  1. 探讨 JS 的面向对象中继承的那些事

    最近学了 JS 的面向对象,这篇文章主要是探讨 JS 的面向对象中继承的那些事. JS中继承的特点: 1.子类继承父类: 2.子类可以用父类的方法和属性 3.子类的改变可以不影响父类 下面用一个例子来 ...

  2. 实用JS系列——面向对象中的类和继承

    背景: 在最开始学习JavaScript时,我们就知道,它是一种脚本语言,也有面向对象机制.但它的面向对象继承机制是基于原型的,即Prototype.今天,我们就来找一下JS中OO的影子. 创建类 1 ...

  3. JS高级 - 面向对象5(继承,引用)

    <script type="text/javascript"> //------------------Person类 //(Person)的构造函数 function ...

  4. 关于js中原生构造函数的继承

    前言 在如今快节奏的工作当中,很多基础的东西会渐渐地被丢掉.就如继承这个话题,写React的同学应该都是class xxx extends React.Component,然而这可以理解为es5的一个 ...

  5. 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.单继 ...

  6. js中的几种继承方法

    JS作为面向对象的弱类型语言,继承也是其非常强大的特性之一. 继承:子承父业:一个原本没有某些方法或属性的对象,统一写方法,拿到了另外一个对象的属性和方法 下面是js中的几种继承方式 1.改变this ...

  7. js中的原型、继承的一些想法

    最近看到一个别人写的js类库,突然对js中的原型及继承产生了一些想法,之前也看过其中的一些内容,但是总不是很清晰,这几天利用空闲时间,对这块理解了一下,感觉还是有不通之处,思路上没那么条理,仅作为分享 ...

  8. PHP面向对象中常用的关键字和魔术方法

    PHP面向对象中常用的关键字 final        1.final不能修饰成员属性(类中常量不是用这个关键字)        2.final只能修饰类和方法 作用:            使用fi ...

  9. js中面向对象编程

    一.理解对象: 第一种:基于Object对象 var person = new Object(); person.name = 'My Name'; person.age = 18; person.g ...

随机推荐

  1. python学习笔记(18)字典和json 的区别 和转换

    字典和json 的区别 和转换 前言:字典和json非常像.接下来比较一下两者的异同 先看一下字典的写法: a = {'a':'1', 'b':'2', 'c':'3' } 再看一下json的写法: ...

  2. King of the Waves

    You are organising a king of the hill tournament, the Buenos Aires Paddleboarding Competition (BAPC) ...

  3. gpio 的配置

    1.时钟使能 B引脚RCC时钟脉冲启动.|(或)表示只要第三个为1就行. 也可以写为RCC_APB2ENR  | = 0X0008; 2.配置GPIO的输出模式以及速度 3 . 如果是 0号引脚:GP ...

  4. git的命令操作指南

    Git图形化界面我用的还可以,但是命令就不太会了,索性和大家一起学习下Git命令的用法...一般来说,日常使用只要记住下图6个命令,就可以了.但是熟练使用,恐怕要记住60-100个命令. fetch ...

  5. CentOS-SendMail服务

    title date tags layout music-id CentOS6.5 SendMail服务安装与配置 2018-09-04 Centos6.5服务器搭建 post 456272749 一 ...

  6. 导出Wireless组中的成员

    get-adgroupmember -Identity wireless  |export-csv -path C:\Group.csv -Encoding UTF8

  7. [LC] 19. Remove Nth Node From End of List

    Given a linked list, remove the n-th node from the end of list and return its head. Example: Given l ...

  8. FPGA浮点数定点数的处理

    http://blog.chinaaet.com/justlxy/p/5100053166大佬博客,讲的非常有条理的 1,基础知识 (1)定点数的基础认知: 首先例如一个16位的数表示的定点数的范围是 ...

  9. Linux下重要文件

    1:/etc/sysconfig/network-scripts/ifcfg-ens130 2:   /etc/resolv.conf   DNS配置文件 3:/etc/hosts 4:/etc/sy ...

  10. [LC] 674. Longest Continuous Increasing Subsequence

    Given an unsorted array of integers, find the length of longest continuous increasing subsequence (s ...