【ES5】—ES5中类与继承

news2024/12/27 13:43:36

在这里插入图片描述

一、如何定义类

  1. 类的首字母要大写,用于识别出与普通函数的不同
// 类  构造函数
function People () {
	this.name = 'xiaoxiao'
	this.age = 18
}
// 实例化对象
let p1 = new People()

二、动态属性和方法

1. 动态属性再构造函数里面定义

// 类
function People (name, age) {
	console.log(this)
	this.name = name
	this.age = age
}
// 实例化对象
let p1 = new People('xiaoxiao', 18)
let p2 = new People('xiaoming', 20)
console.log(p1, p2)
// People {name: 'xiaoxiao', age: 18} People {name: 'xiaoming', age: 20}

PS:构造函数的this指向是实例化出来的对象

2.动态方法在原型上定义

PS:因为把方法放在构造函数中,每次声明一个实例化对象,就会生成一个方法,这样会造成资源的浪费

// 类
function People (name, age) {
	console.log(this)
	this.name = name
	this.age = age
}
People.prototype.ShowName = function () {
	console.log('我的名字是' + this.name)
}
// 实例化对象
let p1 = new People('xiaoxiao', 18)
let p2 = new People('xiaoming', 20)
p1.ShowName()
p2.ShowName()
// 我的名字是xiaoxiao
// 我的名字是xiaoming

三、静态属性和方法

// 类
function People (name, age) {
	this.name = name
	this.age = age
	People.count++
}
// 静态属性, 定义再类上
People.count = 0
// 静态方法
People.getCount = function () {
	console.log(this)
	console.log('当前共有' + People.count + '人')
}

People.prototype.ShowName = function () {
	console.log('我的名字是' + this.name)
}
// 实例化对象
let p1 = new People('xiaoxiao', 18)
let p2 = new People('xiaoming', 20)
People.getCount()
/*
ƒ People (name, age) {
	console.log(this)
	this.name = name
	this.age = age
	People.count++
}
*/

PS: 静态方法中this,指向的是构造函数本身

四、组合继承

1. 构造函数实现继承

// 父类
function Animal (name) {
	this.name = name
}
// 动态方法
Animal.prototype.say = function () {
	console.log('你的名字是' + this.name)
}
// 子类
function Dog (name, color) {
	// 把当前Dog构造函数中this指向传递给Animal构造函数中
	// 把name参数传递过去
	Animal.call(this, name) // 继承Animal的属性
	this.color = color
}
let dog = new Dog('金毛', 'red')
console.log(dog.name)
// 金毛
console.log(dog.say())
// dog.say is not a function

缺点:只能继承父类的属性,无法继承父类的方法

2. 原型继承

function Animal (name) {
	this.name = name
}
// 动态方法
Animal.prototype.say = function () {
	console.log('你的名字是' + this.name)
}
// 子类
function Dog (name, color) {
	// 把当前Dog构造函数中this指向传递给Animal构造函数中
	// 把name参数传递过去
	Animal.call(this, name) // 继承Animal的属性
	this.color = color
}
// 原型继承
Dog.prototype = new Animal()
Dog.prototype.constuctor = Dog

let dog = new Dog('金毛', 'red')
console.log(dog.name)
// 金毛
console.log(dog.say())

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/928569.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

<C++> 类和对象(中)-类的默认成员函数

1.类的默认成员函数 默认成员函数:用户没有显式实现,编译器会生成的成员函数称为默认成员函数。 如果一个类中什么成员都没有,简称为空类。 空类中真的什么都没有吗?并不是,任何类在什么都不写时,编译器会…

【深度学习_TensorFlow】过拟合

写在前面 过拟合与欠拟合 欠拟合: 是指在模型学习能力较弱,而数据复杂度较高的情况下,模型无法学习到数据集中的“一般规律”,因而导致泛化能力弱。此时,算法在训练集上表现一般,但在测试集上表现较差&…

【Vue3】Vuex状态管理

Vuex状态管理 附:eslin中定义了不使用会报错认识应用状态管理什么是状态管理旧模式下的状态管理 Vuex的基本使用安装Vuex单一状态树 State使用vuex的方式(Vue3)mapState辅助函数(Vue2) Mutationsmutations的使用和携带…

前向传播与反向传播涉及到的知识点

目录 引入: 一、神经网络(NN)复杂度 空间复杂度 时间复杂度 二、学习率 三、指数衰减学习率——解决lr的选择 1.总结经验 2.公式引入 四、激活函数 1.简单模型:最初的理解 2.激活函数MP模型 3.优秀的激活函数的特点 4.…

广州华锐视点:VR技术在航天教育的应用优势

VR技术在航天教育中的应用可以带来许多创新和优势,为学生和公众提供更加生动、沉浸式的航天科学学习体验。以下是VR技术在航天教育中的几个主要应用方面: 航天探索模拟:VR技术可以模拟航天探索的场景,让学生和公众身临其境地感受航…

FFmpeg<第一篇>:环境配置

1、官网地址 http://ffmpeg.org/download.html2、linux下载ffmpeg 下载: wget https://ffmpeg.org/releases/ffmpeg-snapshot.tar.bz2解压: tar xvf ffmpeg-snapshot.tar.bz23、FFmpeg ./configure编译参数汇总 解压 ffmpeg-snapshot.tar.bz2 之后&…

Vulnhub: DriftingBlues: 1靶机

kali:192.168.111.111 靶机:192.168.111.215 信息收集 端口扫描 nmap -A -sC -v -sV -T5 -p- --scripthttp-enum 192.168.111.215 80端口首页源码 访问noteforkingfish.txt,发现为Ook!加密的密文 解密后提示需要用户eric和修改hosts文件&…

【Python编程】将同一种图片分类到同一文件夹中

一、数据结构如下: 二、编程工具:Jupyter-Notebook 三、代码: import os import cv2 import shutilpath0os.getcwd()\\apple\\RGB path1os.getcwd()\\apple\\tof_confidence path2os.getcwd()\\apple\\tof_depth path3os.getcwd()\\apple\\…

教你写出高质量函数,简单又实用

在编写函数时,程序员通常需要遵循以下步骤进行: 1、确定最佳的设计逻辑是编写函数时应该考虑的重要因素。这些因素包括设计合理的数据结构、算法和逻辑封装,并且还要考虑到用户的安全因素。挑战在于确保所设计的方案既满足客户需求&#xff…

药品不良反应数据库有哪些?记住这个就够用了

药品不良反应数据库的作用是收集、记录和分析药品使用过程中可能出现的不良反应信息。这些数据库通常由医药监管机构、医药数据公司、医疗机构和科研机构等建立和维护,在监测和评估药品的安全性、发现和确认新的不良反应、支持药品监管决策、提供医学信息和警示等方…

【局部活动轮廓】使用水平集方法实现局部活动轮廓方法研究(Matlab代码实现)

💥💥💞💞欢迎来到本博客❤️❤️💥💥 🏆博主优势:🌞🌞🌞博客内容尽量做到思维缜密,逻辑清晰,为了方便读者。 ⛳️座右铭&a…

会员管理系统实战开发教程04-会员开卡

我们已经用3篇篇幅介绍了会员管理的功能,接着就要开发会员的业务。通常我们开通会员之后需要给会员开通会员卡,一个会员可以有多张会员卡。 在数据源设计的时候,像这种一个会员有多张会员卡的,我们称之为一对多的关系&#xff0c…

Sentinel流量控制与熔断降级

📝 学技术、更要掌握学习的方法,一起学习,让进步发生 👩🏻 作者:一只IT攻城狮 ,关注我,不迷路 。 💐学习建议:1、养成习惯,学习java的任何一个技术…

Levels - 场景参考:山脉景观(Landscape Mountains)

一些从前的笔记的归档,记录了一些UE4资产的相关信息; 山脉景观(Landscape Mountains): 项目的地形材质比较复杂,有几个比较重要的大效果功能,一个是沉积岩的效果: 沉积岩效果的功能…

聊聊NFC技术

目录 1.什么是NFC 2.NFC技术的原理 3.NFC技术的应用 4.NFC技术对生活的影响 1.什么是NFC NFC(Near Field Communication)是一种短距离无线通信技术,可在10厘米以内进行点对点的数据传输。它是基于RFID(Radio Frequency Identif…

基于OpenCV实战(基础知识二)

目录 简介 1.ROI区域 2.边界填充 3.数值计算 4.图像融合 简介 OpenCV是一个流行的开源计算机视觉库,由英特尔公司发起发展。它提供了超过2500个优化算法和许多工具包,可用于灰度、彩色、深度、基于特征和运动跟踪等的图像处理和计算机视觉应用。Ope…

IDEA 出现问题:.gitgnore忽略文件失效解决方案

❤️作者主页:小虚竹 ❤️作者简介:大家好,我是小虚竹。Java领域优质创作者🏆,CSDN博客专家🏆,华为云享专家🏆,掘金年度人气作者🏆 ❤️技术活,该赏 ❤️点赞…

光惯混合动作捕捉系统:开启空间定位全新时代

在当今的技术前沿,光惯混合动作捕捉系统正在崭露头角,成为定位技术的新标杆,更是一项生活中不可或缺的实用工具。它是一个集光学与惯性测量技术于一体的全新定位解决方案,巧妙地融合了光学与惯性测量的优势,以其突破性…

Mars3d的历史版本api文档下载地址

说明: 1.我们一直在进步迭代新功能升级产品打造服务,但是鉴于目前依然有很多老的项目无法升级,需要维护。现提供历史版本的api文档供大家学习参考 2.建议跟随官网同步升级新版本,新功能更多,更值得大家快速上手。 3…

【速成】蓝桥杯嵌入式省一教程:(十一)UART串口通信

与I2C、SPI一样,UART是一种通信协议,设备之间依靠Rx(Receive)与Tx(Transmit)两条线进行数据传输。一个单片机通常内置有多个UART,而这些UART通常都与单片机上的USB接口连接在一起,因此只需要将单片机通过数据线与电脑相连&#xf…