JS继承 笔记

时间:2024-04-23 09:15:11 

JS继承
JavaScript中没有类的概念,与类相关的继承的概念更是无从谈起,但是我们可以通过特殊的语法来

模拟面向对象语言中的继承。
在JS中模拟继承有多种方式,其中寄生组合模式是一种比较容易简单的模拟继承模式,下面我们就来

介绍一下用寄生组合模式模拟继承。
JS的继承包括属性的继承和方法的继承,他们分别通过不同的方法来实现。
1属性的继承
属性的继承通过改变函数的执行环境来实现的。而改变函数的执行环境可以使用call()和apply()两种

方法来实现。
我们首先创建一个Animal“类”(因为JS中没有类的概念,这里只是一个模拟,它实际上只是一个

Function函数对象)。


function Animal(name){
this.name=name;
}


再创建一个Lion“类”,“继承”于Animal


function Lion(){
Animal.apply(this, ["狮子"]);
}


这里使用了Animal的apply方法,把Animal的执行环境改成Lion被调用时的执行环境。
这里要解释一下,我们要想使用Lion这个“类”,通常需要new一个Lion。如:
var l = new Lion();
而new关键字是十分伟大的,在上段代码中,new关键字完成了以下几项工作:
1)开辟堆空间,以准备存储Lion对象
2)修改Lion对象本身的执行环境,使得Lion函数的this指向了Lion函数对象本身。
3)调用Lion“类”的“构造函数”,创建Lion对象
4)将Lion函数对象的堆地址赋值给变量l,这个时候l就指向了这个Lion函数对象
所以经过new关键字以后Animal.apply(this, ["狮子"])中的this已经指向了Lion函数对象本身了,所

以这段代码就将Animal函数的执行环境改变成了Lion函数中,相当于以下代码:


function Lion(){
function Animal(name){
this.name=name;
}
}


而此时的this已经是Lion函数对象了所以上段代码进一步相当于:


function Lion(){
this.name=name;
}


这样就给Lion函数对象添加了name属性,也模拟了Lion函数继承于Animal函数的效果。
2方法的继承
在JS中每一个“类”(即函数,注意不是函数对象)都有一个prototype属性,prototype表示该函数

的原型,也表示一个类的成员的集合(通常是方法的集合)。我们可以通过函数的prototype属性来实现方

法的继承。
我们同样首先创建一个Animal“类”:


function Animal(name){
this.name=name;
}


给Animal的原型中加入一个eat方法:


Animal.prototype.eat=function(){
alter("我能吃!~");
}


创建一个Lion“类”,同时完成对Animal“类”的属性的继承


function Lion(){
Animal.apply(this, ["狮子"]);
}


注意下面的代码,我们马上要完成方法的继承了
Lion.prototype=new Animal();
这样就把一个Animal函数对象储存在了Lion的原型中了,Lion也就包含了Animal中的方法了(其实也

包含了属性)。这样就模拟了Lion函数对Animal的继承。

标签:JS继承
0
投稿

猜你喜欢

  • Git基本概述

    2023-12-07 14:13:28
  • python uuid生成唯一id或str的最简单案例

    2021-06-07 00:40:45
  • 如何使用python读取Excel指定范围并转为数组

    2023-06-13 15:21:10
  • python读取和保存视频文件

    2023-11-14 06:10:20
  • Python3写入文件常用方法实例分析

    2023-08-24 14:44:53
  • ASP连接MSSQL的错误: 拒绝访问

    2008-11-23 20:40:00
  • Hadoop 文件系统命令行基础详解

    2023-08-31 13:57:03
  • Python 中将秒转换为小时、分钟和秒的示例代码

    2023-06-14 12:15:06
  • PHP判断数组是否为空的常用方法(五种方法)

    2024-05-11 09:25:53
  • Python程序运行原理图文解析

    2023-08-09 03:27:31
  • python 实时调取摄像头的示例代码

    2021-10-17 06:07:52
  • Pycharm中安装wordcloud等库失败问题及终端通过pip安装的Python库如何添加到Pycharm解释器中(推荐)

    2023-06-19 17:29:49
  • 用CSS设置表格Table的细边框的比较好用的方法

    2010-09-06 14:58:00
  • Python 字符串的有关知识详解

    2022-03-14 16:54:12
  • JavaScript用Number方法实现string转int

    2024-05-11 09:33:43
  • MySQL5.7 JSON类型使用详解

    2024-01-15 23:57:04
  • python3中超级好用的日志模块-loguru模块使用详解

    2022-03-08 19:08:54
  • 大数据量,海量数据处理方法总结

    2024-01-12 21:59:38
  • 分布式系统CAP定理中的P原理解析

    2022-09-04 11:16:15
  • jupyter notebook使用argparse传入list参数

    2022-12-25 16:54:03
  • asp之家 网络编程 m.aspxhome.com