当前位置: 首页 > news >正文

ES5中实现继承

  本篇文章主要说明在ES5中最通用最兼容的继承实现方式,继承作为面向对象的三大特性之一,在js中实现继承对代码的简洁性,逻辑的连贯性都有很大的帮助。

实现思路

封装创建中间联系对象的函数

  继承可以简单理解为建立子类和父类之间的联系,从而实现代码和函数的复用,建立子类和父类的联系,也就是建立两个构造函数之间的联系,我们不难想到可以通过原型,原型链来实现,让子类与父类的原型建立联系,就可以达到我们的目的。

  如果我们直接将子类的prototype属性指向父类的原型的话,就会导致继承很多我们并不需要的属性,所以我们通过下图这种方式:

  将创建中间建立联系对象的代码封装成为一个函数,传入的参数p为父类的原型对象,将p赋值给F的原型,并将其实例返回。

封装继承函数

  接下来,我们将createObj返回的实例对象赋值给子类的原型,建立父类和子类的联系,也就是继承关系,实现代码如下图:

  封装成继承函数,将子类和父类作为参数传入,将子类的prototype指向createObj函数返回的实例对象,并在子类原型中添加constructor属性,指向子类的构造函数对象,在需要继承的位置,直接调用inherit函数就能完成继承。

完整代码

function Person(name, age) {this.name = name;this.age = age;
};Person.prototype.work = function() {console.log("撸起袖子加油干")
}function Children(name, age, responsibility) {Person.call(this, name, age);this.responsibility = responsibility;
};function createObj(p) {function F() {};F.prototype = p;return new F()
}function inherit(Subtype, Supertype) {Subtype.prototype = createObj(Supertype.prototype);Object.defineProperty(Subtype.prototype, 'constructor', {enumerable: false,configurable: true,writable: true,value: Subtype})
}inherit(Children, Person);Children.prototype.study = function() {console.log("学习");
}var child = new Children("guanju", 18, "成家立业");
console.log(child);
child.study();
child.work();

相关文章:

ES5中实现继承

本篇文章主要说明在ES5中最通用最兼容的继承实现方式,继承作为面向对象的三大特性之一,在js中实现继承对代码的简洁性,逻辑的连贯性都有很大的帮助。 实现思路 封装创建中间联系对象的函数 继承可以简单理解为建立子类和父类之间的联系&…...

面试鸭 - 专注于面试刷题的网站

网上面试题有很多,但此套面试题真实、原创、高频,全网最强。 题目涵盖大中小公司,真实靠谱,有频率和难度的标记,助你成为Offer收割机。 面试鸭地址:https://mianshiya.skyofit.com/ 本套题是我原创&…...

解决小程序路由超过10层限制

新建 navroter.js // 路由判断,小程序路由超过10层限制 // 避免小程序商品重复切换导致页面到结算单页时无法跳转到收货地址页,所以这里层级限制最大数为8 const MAX_VALUE 8 export function navigateTo(url) {let pages getCurrentPages()let dlt …...

【ceph】AI时代-数据为王-ceph存储将成为未来比较看好的赛道之一,为什么不all in一把学习一个不那么卷的赛道呢?

本站以分享各种运维经验和运维所需要的技能为主 《python零基础入门》:python零基础入门学习 《python运维脚本》: python运维脚本实践 《shell》:shell学习 《terraform》持续更新中:terraform_Aws学习零基础入门到最佳实战 《k8…...

《小·意·思》特殊符号

title: 《小意思》特殊符号 date: 2023-11-17 15:27:21 updated: 2023-11-17 15:27:21 categories: 小意思 excerpt: 上下标号、标点、运算符、标号、时间相关、语言、货币、音乐、形状符号、其他符号。 comments: false tags: top_image: /images/backimg/SunsetClimbing.png …...

Web server failed to start. Port 8080 was already in use.

Windows 服务端口被占用,杀死进程命令: netstat -ano | findstr 8080taskkill -PID [xxx] -F...

蓝桥杯第三周算法竞赛D题E题

发现更多计算机知识,欢迎访问Cr不是铬的个人网站 D迷宫逃脱 拿到题目一眼应该就能看出是可以用动态规划来解决。但是怎么定义dp呢? 这个题增加难度的点就在当所在位置与下一个要去的位置互质的时候,会消耗一把钥匙。当没有钥匙的时候就不能移动了。想…...

国家大基金三期线上金融正式倒计时!11月17日,共启芯片产业新篇章

国家大基金三期线上金融正式倒计时!11月17日,共启芯片产业新篇章 新时代浪潮下,全球化进程不断推动各科技大国的核心发展,芯片作为强有力的竞争标志,是国与国之间的重要技术战争焦点。同时,国内基金发展势…...

Chrony让内网设备时间同步

Centos 搭建NTP服务器 背景:公司服务器时间不同步导致一些认证功能无法使用,网络设备时间不同步日志信息不准确,因此想要在内网搭建一个NTP服务器,作为客户端同步网络时间服务器,作为服务端为内网其他终端提供授时服务…...

在docker中部署MySQL

目录 1、拉取最新的镜像 2、创建mysql容器实例 3、启动mysql实例 4、进入mysql 交互环境 5、登录MySQL数据库 6、尽情享用mysql 1、拉取最新的镜像 docker image pull mysql 2、创建mysql容器实例 第一次执行,需要先创建容器并启动(容器名是mys…...

百家网约车平台发布“阳光五条” 多举措加强司机保障

11月17日,免佣联盟百家网约车平台发布“阳光五条”,通过加大免佣力度、实行车费保镖司机版、72小时保护期等措施,加强对网约车司机的权益保障。 近年,交通运输部推动交通运输新业态平台企业落实“阳光行动”等工作,加…...

JXLS 导出多sheet,带页眉页脚

/*** 生成多sheet Excel* 带自定义页眉页脚** param templatePath* param sheetList* return* throws IOException*/public static byte[] generateMultiSheet(String templatePath, List<JxlsHelper2.SheetContext> sheetList) throws IOException {ByteArrayOutputStre…...

docker数据卷详细讲解及数据卷常用命令

docker数据卷详细讲解及数据卷常用命令 Docker 数据卷是一种将宿主机的目录或文件直接映射到容器中的特殊目录&#xff0c;用于实现数据的持久化和共享。Docker 数据卷有以下特点&#xff1a; 数据卷可以在一个或多个容器之间共享和重用&#xff0c;不受容器的生命周期影响。…...

智能井盖传感器能不能监测井盖位移

智能井盖传感器能够精准监测井盖的位移。这些传感器运用了前沿科技对井盖状态进行实时监测。一旦井盖出现异常移动传感器会立即捕捉到信号&#xff0c;并通过与互联网相连接的智能系统发出警报或记录数据。这种智能监测仪为城市或相关部门的井盖管理提供了实时数据支持&#xf…...

.bashrc文件中环境变量配置错误,导致linux命令无法正常使用

问题描述 配置环境变量时出错&#xff0c;导致linux命令无法使用 解决方案&#xff1a; 执行下面命令 export PATH/bin:/usr/local/sbin:/usr/local/bin:/sbin:/bin:/usr/sbin:/usr/bin vim就可以使用了&#xff0c;将错误纠正 vim ~/.bashrc 环境生效 source ~/.bashrc…...

HTML易忽略的角落【目录】

目前已有文章 **** 篇 本专栏是汇集了一些HTML常常被遗忘的知识&#xff0c;这里算是温故而知新&#xff0c;往往这些零碎的知识点&#xff0c;在你开发中能起到炸惊效果。我们每个人都没有过目不忘&#xff0c;过久不忘的本事&#xff0c;就让这一点点知识慢慢渗透你的脑海。 …...

mysql8.0递归

sql举例&#xff1a; WITH recursive c1 AS( select * from course_category where id 1-1union allselect t2.* from course_category t2 INNER JOIN c1 where t2.parentidc1.id) select * from c1 ORDER BY orderby; 解释&#xff1a; WITH recursive c1 AS( //相当于创…...

处理机器学习数据集中字符串列(pandas.get_dummies)

如图&#xff0c;在数据集中week列的数据不是数值型&#xff0c;会导致我们在训练过程中难以处理。 而pandas库中有一个非常好用的函数&#xff0c;独热编码pandas.get_dummies(df) 使用此函数之后&#xff0c;会在原数据中新建各列代表Fri-Sun&#xff0c;值为0或1&#xff…...

一个UE无法注册的问题

问题场景是环境中只有一个小区&#xff0c;UE在找到这个小区&#xff0c;收到MIB SIB1后一直不发起注册。我想这大概是和S准则不满足有关系了&#xff0c;这个问题基本是又没啥好看的了&#xff0c;太简单了&#xff0c;在SIB1周围找找就解决了&#xff0c;于是我发现了以下log…...

自媒体剪辑必备,6个音效素材网站,你值得拥有。

这6个剪辑必备的音效素材网站一定要收藏好了&#xff0c;有了这几个网站能让你在剪辑的时候事半功倍&#xff0c;还不用担心版权问题。话不多说&#xff0c;直接上干货。 1、菜鸟图库 https://www.sucai999.com/audio.html?vNTYwNDUx 菜鸟图库是一个综合性素材网站&#xff…...

uniapp 对接腾讯云IM群组成员管理(增删改查)

UniApp 实战&#xff1a;腾讯云IM群组成员管理&#xff08;增删改查&#xff09; 一、前言 在社交类App开发中&#xff0c;群组成员管理是核心功能之一。本文将基于UniApp框架&#xff0c;结合腾讯云IM SDK&#xff0c;详细讲解如何实现群组成员的增删改查全流程。 权限校验…...

测试微信模版消息推送

进入“开发接口管理”--“公众平台测试账号”&#xff0c;无需申请公众账号、可在测试账号中体验并测试微信公众平台所有高级接口。 获取access_token: 自定义模版消息&#xff1a; 关注测试号&#xff1a;扫二维码关注测试号。 发送模版消息&#xff1a; import requests da…...

手游刚开服就被攻击怎么办?如何防御DDoS?

开服初期是手游最脆弱的阶段&#xff0c;极易成为DDoS攻击的目标。一旦遭遇攻击&#xff0c;可能导致服务器瘫痪、玩家流失&#xff0c;甚至造成巨大经济损失。本文为开发者提供一套简洁有效的应急与防御方案&#xff0c;帮助快速应对并构建长期防护体系。 一、遭遇攻击的紧急应…...

Java 语言特性(面试系列2)

一、SQL 基础 1. 复杂查询 &#xff08;1&#xff09;连接查询&#xff08;JOIN&#xff09; 内连接&#xff08;INNER JOIN&#xff09;&#xff1a;返回两表匹配的记录。 SELECT e.name, d.dept_name FROM employees e INNER JOIN departments d ON e.dept_id d.dept_id; 左…...

css实现圆环展示百分比,根据值动态展示所占比例

代码如下 <view class""><view class"circle-chart"><view v-if"!!num" class"pie-item" :style"{background: conic-gradient(var(--one-color) 0%,#E9E6F1 ${num}%),}"></view><view v-else …...

《Playwright:微软的自动化测试工具详解》

Playwright 简介:声明内容来自网络&#xff0c;将内容拼接整理出来的文档 Playwright 是微软开发的自动化测试工具&#xff0c;支持 Chrome、Firefox、Safari 等主流浏览器&#xff0c;提供多语言 API&#xff08;Python、JavaScript、Java、.NET&#xff09;。它的特点包括&a…...

2024年赣州旅游投资集团社会招聘笔试真

2024年赣州旅游投资集团社会招聘笔试真 题 ( 满 分 1 0 0 分 时 间 1 2 0 分 钟 ) 一、单选题(每题只有一个正确答案,答错、不答或多答均不得分) 1.纪要的特点不包括()。 A.概括重点 B.指导传达 C. 客观纪实 D.有言必录 【答案】: D 2.1864年,()预言了电磁波的存在,并指出…...

智能在线客服平台:数字化时代企业连接用户的 AI 中枢

随着互联网技术的飞速发展&#xff0c;消费者期望能够随时随地与企业进行交流。在线客服平台作为连接企业与客户的重要桥梁&#xff0c;不仅优化了客户体验&#xff0c;还提升了企业的服务效率和市场竞争力。本文将探讨在线客服平台的重要性、技术进展、实际应用&#xff0c;并…...

DIY|Mac 搭建 ESP-IDF 开发环境及编译小智 AI

前一阵子在百度 AI 开发者大会上&#xff0c;看到基于小智 AI DIY 玩具的演示&#xff0c;感觉有点意思&#xff0c;想着自己也来试试。 如果只是想烧录现成的固件&#xff0c;乐鑫官方除了提供了 Windows 版本的 Flash 下载工具 之外&#xff0c;还提供了基于网页版的 ESP LA…...

鱼香ros docker配置镜像报错:https://registry-1.docker.io/v2/

使用鱼香ros一件安装docker时的https://registry-1.docker.io/v2/问题 一键安装指令 wget http://fishros.com/install -O fishros && . fishros出现问题&#xff1a;docker pull 失败 网络不同&#xff0c;需要使用镜像源 按照如下步骤操作 sudo vi /etc/docker/dae…...