位置: 编程技术 - 正文

阿里巴巴技术文章分享 Javascript继承机制的实现(阿里巴巴技术文档翻译工资)

编辑:rootadmin

推荐整理分享阿里巴巴技术文章分享 Javascript继承机制的实现(阿里巴巴技术文档翻译工资),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:阿里巴巴技术文档好进吗,阿里巴巴技术文档,阿里巴巴最新技术,阿里巴巴 技术,阿里巴巴技术文员好做吗,阿里巴巴技术文档,阿里巴巴技术文档,阿里巴巴技术文档翻译工资,内容如对您有帮助,希望把文章链接给更多的朋友!

Javascript作为一门脚本语言,在设计之初并没有考虑到面向对象的特性。即便到了当今这个遍布现代浏览器的年代,各种Javascript 框架/库如雨后春笋般地疯狂生长,Javascript中连个 class 关键字都没有。如果你要编写一个类,你还得借助于function,至于继承、重载什么的,就别奢望了。

可是,没有继承,日子怎么过啊?难道把所有的共有逻辑都拷贝一遍,实现最低级的代码复用?

答案当然是——NO,所以,我们要自己实现继承!

目标

最关键的目标当然是继承——子类自动拥有父类的所有公共属性和方法。

支持instanceof,例如c是子类的实例,而P是父类,c instanceof P应该返回true。

其次应该能够重写(Override)父类的方法,并且在子类的方法中,能够方便地调用到父类的同名方法。

至于说重载(Overload),由于Javascript的语言特性(不可以有同名方法,即便它们参数列表不一样),无法实现。

设计与实现

Javascript的对象有一个很重要的属性——__proto__,也就是原型。原型实质上也是一个对象,所有它也可以有自己的原型,这样就形成一个原型链。当你调用某个对象的某个方法,或者读取该对象的某个属性,Javascript执行器是这样做的:

1、首先到该对象中找对应的方法或属性,如果找不到,2、到该对象的原型中找,如果还找不到,3、到原型的原型里面找4、...5、直到最后找到Object的原型为止,如果还没有则返回undefined如下图所示:

原型链的这个特性,和继承很相似,所以自然而然,我们可以利用它来实现继承机制。而原型链对instanceof的支持,使得它成为很好的选择。

我们定义extend函数,这个函数接受两个参数,第一个是父类,第二个是子类,如下所示:

这个函数对子类进行处理,并返回子类。处理的逻辑如下:

建立原型链

阿里巴巴技术文章分享 Javascript继承机制的实现(阿里巴巴技术文档翻译工资)

通过将子类的原型链与父类的原型链连接起来,子类可以自动拥有父类的方法和属性:

为了连接原型链,需要创建一个父类的实例,并将其赋给子类的原型属性。但我们不希望在extend方法里面就实例化父类,所以引入了一个中间类T,以解决这个问题。

实现重写

原型链建立之后,原来子类原型上的方法和属性我们也需要保留下来:

方法

如果父类有同名方法,我们使用一个闭包,来保留对父类方法和子类方法的引用。然后,修改新的原型中该方法的引用,将其指向一个新的 function。在这个function里面,我们创建一个临时属性super,将其指向父类方法,并调用子类方法,这样在子类方法中,通过 this.super可以调用该父类方法:

属性

对于属性,不存在重写的问题,所以直接将子类原来的原型中的属性加到新的原型中即可:

构造器

为了让子类能够访问到父类的构造器,我们将父类赋给子类的super属性:

如何使用

假设我们要设计一个管理系统,里面涉及到客户、工人和经理等。将客户和员工的共性抽象出来,我们得到人(People);然后将工人和经理的共性抽象得到员工(Employee)。这样我们得到三级类结构:

实现这个设计的代码如下:

我们希望对每个人都有一个描述,People是姓+名;员工在姓+名之后,还包括公司名称;而经理在员工的描述之后,还包括职位。代码如下:

在所有的成员方法都已经定义好之后,声明类的继承(必须先定义方法,再声明类的继承,否则无法在方法中使用this.super调用父类方法!):

使用这些类就比较简单,直接new就好了:

这篇文章不错吧,那就给个赞吧!

JavaScript对象参数的引用传递 今天碰到一个问题,怎样把参数变更影响到函数外部,如:scriptvarmyname="wood";A(myname);document.write(myname);functionA(n){n="Yao";}/script输出结果还是wood,说明当myn

JavaScript基本语法学习教程 Javascript的基本概念i.javascript语言是网页中广泛使用的一种脚本语言。ii.Javascript语言的特点:1.由Netscape公司开发,基于对象和事件驱动并具有一定安全

javascript检测flash插件是否被禁用的方法 本文实例讲述了javascript检测flash插件是否被禁用的方法。分享给大家供大家参考,具体如下:!doctypehtmlhtmllang="en"headmetacharset="UTF-8"metaname="Generator"content="

标签: 阿里巴巴技术文档翻译工资

本文链接地址:https://www.jiuchutong.com/biancheng/383803.html 转载请保留说明!

上一篇:基于javascript实现随机颜色变化效果(javascript运用)

下一篇:JavaScript对象参数的引用传递(js对象的constructor)

  • 自行申报是什么征收方式
  • 预缴增值税附加税需要计提吗
  • 什么是税务学
  • 营业收入是不是利润
  • 不动产租赁属于经营租赁吗
  • 所得税季报填错了已经申报了
  • 接受的捐赠收入要交税吗
  • 土地出让金返还政策文件
  • 外企当年利润能赚多少
  • 租赁设备出口怎么处理?
  • 项目清算组
  • 交汇算清缴所得吗
  • 工程公司收入成本入账
  • 金融企业发放贷款时发生的交易费用
  • 养老金余额退休能取吗
  • 小规模纳税人与注册资金有关系吗
  • 流转税通俗举例
  • 政府部门纳税人识别号查询
  • 清算时未分配利润为负数的处理方法是什么呢?
  • 公司的班车费用怎么入账
  • 没有金税盘怎么勾选发票
  • 电子银行承兑汇票到期选择线上清算
  • 一般纳税人附加税费减免政策
  • 个体工商户核定征收标准2023
  • 代理进口货物账务怎么处理
  • js图片放大代码
  • 系统托盘图标禁用
  • Win11怎么设置屏幕熄灭时间
  • win11怎么清理电脑垃圾
  • Linux中stat命令显示文件的基本使用教程
  • 应交税金 应交税费
  • 税务稽查补税
  • 应付帐款借方余额怎么算
  • 金蝶利润表主营业务成本公式
  • 计算机视觉姿势评估英语
  • PHP用mysql_insert_id()函数获得刚插入数据或当前发布文章的ID
  • vue的路由守卫有哪些钩子函数
  • vue子组件监听父组件
  • 如何使用axios直接发送GET请求
  • 企业的研发费用如何进行账务处理
  • 增值税申报流程大全(附图文详解)
  • sqlserver2008触发器语法
  • 小企业会计准则和一般企业会计准则的区别
  • 固定资产处置需要交税吗?
  • 实收资本会计处理方法
  • 企业固定资产可以不提折旧吗
  • 什么是增值税的销项税额
  • 公司员工机票可以抵扣多少呢
  • 可抵扣的税票
  • 投标保证金以现金形式转为履约保证金
  • 企业所得税汇算清缴时间
  • 如何查看员工社保
  • 应交税金借方余额在报表列示
  • 单独设置停工损失科目
  • python的底层语言
  • linux中vi编辑器怎么使用
  • winxp无法删除文件
  • mac如何重装系统win10
  • 安装怎么弄
  • 在Linux上优化Mysql运行环境让你对Mysql更多了解
  • linux curl命令使用
  • windows10打开此电脑
  • unity自动攻击
  • cocos2dx引擎优化
  • excel自定义样式
  • node.js deno
  • android observer
  • domReady的实现案例
  • jquery 刷新div
  • android百分比布局
  • python制作简单图形
  • jquery mobile教程
  • 面向对象设计六大原则
  • 山东省国家税务局总局官网
  • 从国外进口到国内销售的商品
  • 新吉高铁开工典礼
  • 新疆都有哪些地貌
  • 地税管理员是干什么的
  • 企业的财务是什么
  • 普惠性税收优惠政策例子
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设