三分钟让你搞懂Class类

类的基本知识

注:学习该部分知识内容的前置条件是搞懂原型链的知识哦!

例:

1)首先创建一个Person类,然后创建子类来继承他

js 复制代码
	//创建一个Person类
		class Person {	//构造器方法
			constructor(name,age){
				//构造器中的this是谁?------ 类的实例对象
				this.name = name
				this.age = age
			}
			//一般方法
			speak(){
				//speak方法放在了哪里?------类的原型对象上,供实例使用
				//通过Person实例调用speak时,speak中的this就是Person实例
				console.log(`我叫${this.name},我年龄是${this.age}`);
			}
		}
 const ldh=new Person('刘德华',18) //new 一个类的实例
console.log(ldh);
ldh.speak()

2)接下来我们创建一个子类并继承父类

继承方式一:子类不再添加新的内容

由于上面的父类的构造器中已经有了name,age,如果子类想完全继承父类,那么可以直接这么写:

js 复制代码
class Student extends Person{

}
const zhangsan=new Student('张三',102)
console.log(zhangsan)

我们会发现,子类会直接把父类中的构造器搬过来,且虽然原型上没有父类的speak方法,但是通过原型链继续往上找,同样可以使用父类身上是speak方法,这就是简单继承

继承方式二:子类需要添加新的内容

如果子类中需要添加新的内容,那么子类也需要写构造器来构造内容,此时要用到super来继承父类构造器中的内容;那如果子类中也想有一个speak方法,而且说的功能更多,那怎么办呢?

那就重写从父类继承过来的方法,这样Student的原型对象上就会有speak方法了,虽然父类上也有speak方法,但是当根据原型链查找的规则,找到Student身上的方法就不再查找了

js 复制代码
//创建一个Student类,继承于Person类
		class Student extends Person {
			constructor(name,age,grade){
				super(name,age)//继承父类的构造器中内容
				this.grade = grade
				this.school = '尚硅谷'
			}
			//重写从父类继承过来的方法
			speak(){
				console.log(`我叫${this.name},我年龄是${this.age},
                                我读的是${this.grade}年级`);
				this.study()
			}
			study(){
				//study方法放在了哪里?------类的原型对象上,供实例使用
				//通过Student实例调用study时,study中的this就是Student实例
				console.log('我很努力的学习');
			}
		}

注:

1.类中的构造器不是必须要写的,要对实例进行一些初始化的操作,如添加指定属性时才写。 2.如果A类继承了B类,且A类中写了构造器,那么A类构造器中的super是必须要调用的。 3.类中所定义的方法,都放在了类的原型对象上,供实例去使用。

相关推荐
Setsuna_F_Seiei2 小时前
前端转型 Agent 开发 04 之 MCP 与 Skill(赋予 Agent 更广工作能力)
前端·agent
刘发财4 小时前
前端2秒生成500页矢量PDF,rust真的强到没朋友
前端·javascript·rust
郑州光合科技余经理4 小时前
国际版外卖系统:税率字段怎么和订单主流程解耦
android·java·开发语言·前端·后端·php·ai编程
梦想平凡5 小时前
百游棋牌源代码开发搭建教程(十):隔离部署、备份恢复与双端验收
java·前端·javascript·数据库·源代码管理
yume_sibai6 小时前
06-Rust Web 开发实战(Axum 框架 + 数据库 + JWT 认证 + 中间件 + 部署)
前端·数据库·rust
计算机魔术师7 小时前
特朗普上台打给黄仁勋:AI末日论是骗局,我们绝不让它发生
前端
troy1287 小时前
Python 基础语法(八):Web 后端开发、数据分析与可视化、网络爬虫、人工智能 / 大模型应用
前端·python·数据分析
计算机魔术师7 小时前
CEO说要慢下来,黑客说别做梦了——同一篇论文,两种命运
前端
kyriewen8 小时前
我花3天抓了一个幽灵bug,凶手藏在第4层
前端·javascript·程序员
IT_陈寒9 小时前
Java里用Stream.parallel()翻车实录,这性能还不如单线程
前端·人工智能·后端