class-使用extends实现子类继承父类

简介: class-使用extends实现子类继承父类

class-使用extends实现子类继承父类

 

一、class继承的形式给父类添加实例方法

新建文件02的打包文件文件为index,但由于02文件并未在index中被导入,故其不会被执行。


1.index文件

//导入包

import React from 'react'

import ReactDOM from react - dom'

//使用ES6import 导入需要的组件

11 import Hello from @/ components/Hello

 

//导入class继承

import@/02.class.继承

const user ={

name:zs;

age: 22,

gender: ' '

}

 

2.02.class文件

父类与子类需要有所指向,才能形成指向原型链对象的关系。

//此为父类。可直接将父类理解成原型对象[prototype]

class Person {

 constructor(name,age){      

//在父类身上统一定义实例属性

 this.name = name

 this.age = age

 

//这是子类美国人

//class类中,可以使用extends关键字,实现子类继承父类

//语法: class子类extends 父类{}

class American extends Person{

}

 

const a1 = new American('Jack', 20)

console.log(a1)

 

//这是子类中国人

class Chinese extends Person{

}

 

const a1 = new Chinese('张三', 22)

console.log(c1)

 

以上代码有部分数据进行着重复,共有的部分可以放置于原定对象之上。即建立一个父类。美国人、中国人都属于人类这一集体的概念,故可将较为抽象的整合一类称为父类。在每一个子类身上的构造定义函数十分麻烦,则将共有之处均与父类相关联。当ChineseAmerican均能访问到原型对象时,其即为共有数据。

相关文章
|
8月前
|
机器学习/深度学习 数据采集 API
|
资源调度 前端开发 JavaScript
React中classnames库使用
【10月更文挑战第7天】
|
存储 前端开发 JavaScript
React useState 和 useRef 的区别
本文介绍了 React 中 `useState` 和 `useRef` 这两个重要 Hook 的区别和使用场景。`useState` 用于管理状态并在状态变化时重新渲染组件,适用于表单输入、显示/隐藏组件、动态样式等场景。`useRef` 则用于在渲染之间保持可变值而不触发重新渲染,适用于访问 DOM 元素、存储定时器 ID 等场景。文章还提供了具体的代码示例,帮助读者更好地理解和应用这两个 Hook。
586 0
|
移动开发 资源调度 前端开发
React Router V6 useRoutes的使用
【8月更文挑战第29天】 React Router V6 useRoutes的使用
654 3
|
JSON 前端开发 JavaScript
🌟前端使用Lottie实现炫酷的开关效果🌟
🌟前端使用Lottie实现炫酷的开关效果🌟
|
NoSQL 编译器 C语言
【C 言专栏】C 语言中的调试技巧与工具
【5月更文挑战第6天】在C语言编程中,调试是必不可少的技能,涉及基本技巧如打印输出、断点调试和单步执行,以及使用GCC、GDB、Visual Studio和Eclipse CDT等工具。高级技巧包括内存检查和性能分析。通过分析问题、设置断点、逐步调试和检查逻辑来解决错误。调试时需保持耐心,合理选用工具,记录过程,并避免过度调试。熟练掌握这些技能将提升代码质量和开发效率。
439 0
【C 言专栏】C 语言中的调试技巧与工具
|
网络协议 Unix Linux
TCP 三次握手、四次断开
TCP 三次握手、四次断开
|
安全 Python
【视频】Python用GM(1,1)灰色模型预测模型对电力预测
【视频】Python用GM(1,1)灰色模型预测模型对电力预测
|
存储 缓存 前端开发
React Query 完全指南,时下最热辣的请求库!
小伙伴们,是时候开始 React Query 之旅了。你还不知道这个库吗?完美,你来对地方了
|
数据库 数据安全/隐私保护
数据库原理——图书馆管理系统
数据库原理——图书馆管理系统
数据库原理——图书馆管理系统