博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
javascript继承
阅读量:4346 次
发布时间:2019-06-07

本文共 1089 字,大约阅读时间需要 3 分钟。

大家都知道JavaScript中没有类的概念,那么 怎么实现继承呢?这就是今天要实现的内容。

在实现之前,先来看一道腾讯的js面试题:

 有一只小狗,叫“花花”,它会‘汪汪’叫,它的同伴也会‘汪汪’叫,后来环境发生变化,新出生的狗狗不会‘汪汪’叫了,而是变成‘呜呜’。试通过继承来达到目的。

带着实际问题去学习,更能知道自己想要的是什么,更能抓住重点。先憋开面试题不说,先看看,js如何实现继承。

通过“原型”实现继承

JavaScript中既然没有类的概念,肯定不是通过类来实现继承的。这里先介绍第一种常见的继承方式——原型继承

1、定义一个“狗”的父类,有“叫”的方法

   function Dog(){

        this.bark = function(){alert('汪汪');};
    }

2、定义一个“猎狗”的子类

   function HuntingDog(){

        this.climb = function(){alert('我会爬树');};
    }

3、让“猎狗”也会“叫”

   HuntingDog.prototype = new Dog();  //通过关键字‘prototype’开始继承

4、测试

    var huntingDog = new HuntingDog();

    huntingDog.bark();//猎狗也会叫,调用Dog的函数

 

到此,已经实现子类“猎狗”继承父类“狗”,这种继承方式是通过关键字“prototype”来实现的,指定“猎狗”的原型是“狗”,这样“猎狗”就具有了“狗”的全部属性。其实在JavaScript中,每个对象都有一个原型对象,直至顶层的Object对象,当然Object对象的原型值为null。

输出 “猎狗”对象  console.log(huntingDog);  如图:

那么,“猎狗”对象huntingDog是如何找到bark()方法的呢?

猎狗huntingDog首先在自身对象上寻找bark()方法,寻找不到,去原型寻找,原型Dog对象上,有bark方法,调用bark方法。

 

其实这里也就涉及到了JavaScript高级中一个重要的概念——原型链

对象 -> 原型 -> 原型的原型 -> Object -> null ,这样的一条链,称为原型链

对象的属性和方法,就是沿着原型链来查找和调用的,也就是js的原型继承

 

通过原型关键字”prototype“实现js继承是最常用的方法,但是原型继承时,发生的改变会影响下游的所有子类

转载于:https://www.cnblogs.com/liyingcherish/p/4343955.html

你可能感兴趣的文章
环形菜单的实现
查看>>
【解决Chrome浏览器和IE浏览器上传附件兼容的问题 -- Chrome关闭flash后,uploadify插件不可用的解决办法】...
查看>>
34 帧动画
查看>>
二次剩余及欧拉准则
查看>>
thymeleaf 自定义标签
查看>>
关于WordCount的作业
查看>>
UIView的layoutSubviews,initWithFrame,initWithCoder方法
查看>>
STM32+IAP方案 实现网络升级应用固件
查看>>
用74HC165读8个按键状态
查看>>
jpg转bmp(使用libjpeg)
查看>>
linear-gradient常用实现效果
查看>>
sql语言的一大类 DML 数据的操纵语言
查看>>
VMware黑屏解决方法
查看>>
JAVA 基础 / 第八课:面向对象 / JAVA类的方法与实例方法
查看>>
Thrift源码分析(二)-- 协议和编解码
查看>>
考勤系统之计算工作小时数
查看>>
4.1 分解条件式
查看>>
关于C++ const成员的一些细节
查看>>
《代码大全》学习摘要(五)软件构建中的设计(下)
查看>>
C#检测驱动是否安装的问题
查看>>