【javascript】js面试题原型和原型链
1.javascript继承
js使用class实现继承，本质是使用原型来完成
//人的类
class Person{constructor(name) {this.name = name}//走路的方法handleWalk(){console.log("走路");}
}
// 学生类
class Student extends Person{constructor(name,age) {//通过super执行父类的构造函数super(name)this.age = age}//介绍handleJob(){console.log(this.name+",今年"+this.age+"岁"+"，爱读书")}
}
let std = new Student("沉默小管",18)
std.handleJob()
std.handleWalk()// 老师类
class Teacher extends Person{constructor(name,age) {super(name)this.age = age}//介绍handleJob(){console.log(this.name+",今年"+this.age+"岁"+",教学生")}
}
let teacher = new Teacher("沉默小管",18)
teacher.handleJob()
teacher.handleWalk()
执行结果:
通俗解释:
创建一个Person类，类里的所有方法可以看做为显示原型。
创建Student类和Teacher类就会有显示原型和隐示原型，因为这两个类都继承了Person类，这两个类的隐示原型就是Person的显示原型。new出来的teacher和std的实例对象的显示原型就是自己的参数，隐示原型指向Teacher和Student类上的显示原型。因为Student和Teacher类继承了Person，所以自己的隐私原型上没有方法和公共的成员变量，就会往上一级找，直到对象类型为止(顶层)
2.原型
原型有:
Student.prototype显示原型
student.__proto__隐示原型
每个对象都有一个prototype属性，这个属性指向对象的原型
student实例对象上有__proto__属性，这个属性指向Student.prototype对象上的方法
Student类上也有prototype上的属性，这个属性也指向Student.prototype对象上的方法
Student.prototype和student.__proto__都是指向同一个对象
所以
Student.prototype === student.proto
3.原型链
原型链就是类继承
//人的类
class Person{constructor(name) {this.name = name}//走路的方法handleWalk(){console.log("走路");}
}// 老师类
class Teacher extends Person{constructor(name,age) {super(name)this.age = age}//介绍handleJob(){console.log(this.name+",今年"+this.age+"岁"+",教学生")}
}
let teacher = new Teacher("沉默小管",18)
teacher.handleJob()
teacher.handleWalk()
teacher.__proto__隐示原型上指向Teacher.prototype显示原型的属性和方法上找，但是找不到对应的方法。Teacher.prototype又是对象，所以也有__proto__隐示原型，这个隐示原型会指向继承了Person类的显示原型，所以Teacher的隐示原型就会往Person显示原型上查找对应的方法和属性
完整原型链
如何判断属性和方法是否自身所拥有的？
通过.hasOwnProperty()函数判断自身原型上是否有属性和方法
teacher.hasOwnProperty("name")
结果为：true
teacher.hasOwnProperty("jobs")
结果为：false
3.instanceof使用
instanceof检测构造函数的prototype属性是否在某个实例对象的原型链上
teacher instanceof Teacher
结果为true
teacher instanceof Person
结果为true
teacher instanceof Object
结果为true
teacher instanceof Array
结果为false
Array不在原型链上，所以为false
总结:js一切都是对象
✨踩坑不易，还希望各位大佬支持一下\textcolor{gray}{踩坑不易，还希望各位大佬支持一下}踩坑不易，还希望各位大佬支持一下
【javascript】js面试题原型和原型链相关推荐
- 原型和原型链和instanceof
一.prototype 在JavaScript中,每个函数都有一个prototype属性,这个属性指向函数的原型对象. function Person(age) {this.age = age } P ...
- 前端面试题：JS中的原型和原型链
JS的原型和原型链算是前端面试题的热门题目了,也是参加了几场面试,感觉好多次都被问到对原型和原型链的理解,所以今天也是索性把他给整理出来,一方面方便自己以后复习查看,另一方面也是给大家分享一下我对原型 ...
- web前端面试高频考点——JavaScript 篇（一）【JS的三座大山 】 原型和原型链、作用域和闭包、异步
系列文章目录 JavaScript 知识梳理,收录了web前端面试 95%以上 的高频考点,满满的干货.给你做一个高效的知识梳理,为你的面试保驾护航! 内容 参考链接 HTML & CSS 篇 ...
- 【前端面试题】原型和原型链-js
[前端面试题]原型和原型链-js 原型 原型链 原型 所有引用类型都有一个__proto__ (隐式原型)属性,属性值是一个对象: 所有函数都有一个prototype (显示原型)属性,属性值是一个对 ...
- 前端经典面试题：js必懂的原型和原型链
一． 前言 原型和原型链在面试中历来备受重视,经常被提及.说难可能也不太难,但要真正完全理解,吃透它,还是要多下功夫的. 下面为大家简单阐述我对原型和原型链的理解,若是觉得有说的不对的地方,还请帮忙指 ...
- JS经典面试题：JS原型、原型链
JS是一种基于原型的语言,每一个对象都有一个原型对象,当你试图寻找某个属性时,它不仅仅在该对象上面搜索,还有搜索该对象的原型,或则是该对象原型的原型,一次向上进行搜索,直到找到一个名字匹配的属性或者到 ...
- JavaScript什么是原型和原型链JS
从事前端这么久,发现原型和原型链一直都是云里雾里,网上看了好多文章.博客也还是不怎么明朗,相信被它困扰的小伙伴,不在少数 以下是我总结的原型和原型链,个人认为是比较浅显易懂的: 原型:构造函数中的 p ...
- JS原型与原型链（面试题）
原型 原型分为两种 prototype 每一个函数都会有prototype属性,被称为显式原型. __proto__ 每一个实例对象都会有__proto__属性,其被称为隐式原型. construct ...
- “约见”面试官系列之常见面试题第四十二篇之原型和原型链（建议收藏）
原型和原型链的理解:(面试题) 原型:每个函数都有 prototype 属性,该属性指向原型对象:使用原型对象的好处是所有对象实例共享它所包含的属性和方法. 原型链:主要解决了继承的问题:每个对象都拥 ...
- JS中关于构造函数、原型链、prototype、constructor、instanceof、__proto__属性
在Javascript不存在类(Class)的概念,javascript中不是基于类的,而是通过构造函数(constructor)和原型链(prototype chains)实现的.但是在ES6中引入 ...
最新文章
- java切面不需要接口了吗_使用java语言,如何对一个类中的静态方法做切面编程?...
- day002--python编程的相关软件，变量
- python import
- 吃豆人（luogu 7472/NOI Online 2021 普及组 T2）
- php按城市显示搜索结果,搜索结果页（通过数据库搜索）
- [Leetcode][第491题][JAVA][递增子序列][回溯][RK算法]
- WPF窗体最小化到任务栏
- 高性能分布式事物中间件Sharding-Sphere介绍
- 残疾人软件开发_组织如何使残疾人更具包容性
- Bootstrap CSS编码规范之代码组织规范
- App送审，4.3问题怎样处理
- Total Commander 常用快捷键
- 静态网页—制作“人人网首页”页面
- 微服务如何拆分，能解决哪些问题？
- 属牛的男孩取名：带茂字的男孩名字有哪些
- 苹果拼图软件测试,视频照片拼图APP
- 常用手机尺寸以及分辨率
- cad怎么向下位移_CAD偏移快捷键命令（教你怎么绘制滚轮）
- 简单的python脚本-如何写一个简短（200行）的Python脚本
- .dll、.lib、.dll.a 的区别
热门文章