为了账号安全,请及时绑定邮箱和手机立即绑定
首页 手记 【九月打卡】第14天...

【九月打卡】第14天 BAT大牛带你横扫初级前端JavaScript面试(第二版)

2022.09.18 21:37 26浏览

学习课程名称:BAT大牛带你横扫初级前端JavaScript面试(第二版)
章节名称:原型和原型链(新版)
讲师姓名:双越


课程内容:

  1. class 和继承
  2. 原型
  3. 原型链和instanceof

有过前端经验的同学,都知道JS本身基于原型继承的语言,在ES6之前,只能通过原型继承来写继承。ES6的出现,才出现了新的继承方式:Class继承(底层实现依然还是原型链)

Class 是面向对象语法的实现。

Class类似个模板,通过constructor可以去构建一些东西,可以附上一些属性和方法。

class Singer {
    constructor(name,songs) {
        this.name = name
        this.songs = songs
    }
    singMusic() {
        console.info(`歌手姓名:${this.name},喜欢唱:${this.number}`)
    }
}
 
 
通过类 new 一个对象/实例
const demo = new Singer('fans','我爱我的祖国')
console.log(demo.name). // fans
console.log(demo.songs) // 我爱我的祖国
demo.singMusic() // 歌手姓名:fans,喜欢唱:我爱我的祖国

继承(一连串的关系):

我们可以写一个父类,让子类去继承父类的属性和方法

//父类
class People {
    constructor(name) {
        this.name = name    
    }
    drink() {
        console.info(`${this.name} drink water`)    
    }
}
 
//子类
class Singer extends People {
    construtor(name,songs) {
        super(name)//一定要在this之前调用
        this.songs = songs    
    }
    singMusic() {
        console.log(`我叫${this.name},喜欢唱${this.songs}`)
    }
} 
 
通过 类 new 一个对象/实例
const demo = new Singer('fans','我爱我的祖国')
console.info(demo.name) // fans
console.info(demo.songs) // 我爱我的祖国 
demo.singMusic() // 我叫fans,喜欢唱我爱我的祖国
demo.drink() //fans drink water

特别说明:Object是所有class的父类

类型判断:大家都知道,用typeof只能判断值类型,能判断出是否为引用类型(但是不可细分)

由此instanceof闪亮登场了,instanceof可以去判断引用类型

原型

class 实际上通过typeof得到的是一个函数(function),可见是一个语法糖。

// 隐式原型 和 显式原型
console.log(demo.proto) // 隐式原型
console.log(Singer.prototype) // 显示原型
console.log(demo.proto === Student.prototype) // true

原型关系

每个class都有显示原型prototype
每个实例都有隐式原型__proto__
实例的隐式原型__proto__指向对应class的prototype
基于原型的执行规则

获取属性demo.name或执行方法demo.singMusic()时
先在自身属性和方法中查找
如果找不到,则会自动去__proto__中查找
原型链

console.log(Singer.prototype.proto)
console.log(People.prototype)
console.log(People.prototype === Singer.prototype.proto)


图片描述

点击查看更多内容
0人点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
Web前端工程师
手记
粉丝
1
获赞与收藏
2

关注TA,一起探索更多经验知识

同主题相似文章浏览排行榜

风间影月说签约讲师

50篇手记,涉及Java、MySQL、Redis、Spring等方向

进入讨论

Tony Bai 说签约讲师

145篇手记,涉及Go、C、Java、Python等方向

进入讨论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消