Javascript前端开发:阿里JS面试题让你深入了解原型与继承

简介: 题目如下:var F = function(){}Object.prototype.a = function(){console.log('a()')}Function.prototype.b = function(){console.log('b()')}var f = new F()F.a()F.b()f.a()f.b()主要考查的技术点:1.、原型与原型链2、实例对象、构造函数、Object、 Function的关系分析:F是个构造函数,而f是构造函数F的一个实例。

题目如下:

var F = function(){}
Object.prototype.a = function(){
console.log('a()')
}
Function.prototype.b = function(){
console.log('b()')
}
var f = new F()
F.a()
F.b()
f.a()
f.b()

主要考查的技术点:

1.、原型与原型链

2、实例对象、构造函数、Object、 Function的关系

分析:

F是个构造函数,而f是构造函数F的一个实例。

因为F instanceof Object == true、F instanceof Function == true

由此我们可以得出结论:F是Object 和 Function两个的实例,即F既能访问到a,也能访问到b。

所以F.a() 输出 a() F.b() 输出 b()

对于f,我们先来看下下面的结果:

f并不是Function的实例,因为它本来就不是构造函数,所以就调用Function原型链上的相关属性和方法了,只能访问Object原型链。

所以f.a() 输出 a() 而f.b()就报错了。

接下来,我们具体分析下,它们是如何按路径查找的:

f.a的查找路径: f自身: 没有 ---> f.__proto__(Object.prototype): 输出a()

f.b的查找路径: f自身: 没有 ---> f.__proto__(Object.prototype): 没有 ---> f.__proto__.__proto__ (Object.prototype.__proto__): 因为找不到,所以报错

F.a的查找路径: F自身: 没有 ---> F.__proto__(Function.prototype): 没有 ---> F.__proto__.__proto__(Object.prototype): 输出 a()

F.b的查找路径: F自身: 没有 ---> F.__proto__(Function.prototype): b()

相关文章
|
17天前
|
自然语言处理 JavaScript 前端开发
一文梳理JavaScript中常见的七大继承方案
该文章系统地概述了JavaScript中七种常见的继承模式,包括原型链继承、构造函数继承、组合继承、原型式继承、寄生式继承、寄生组合继承等,并探讨了每种模式的实现方式及其优缺点。
一文梳理JavaScript中常见的七大继承方案
|
17天前
|
Web App开发 前端开发 Linux
「offer来了」浅谈前端面试中开发环境常考知识点
该文章归纳了前端开发环境中常见的面试知识点,特别是围绕Git的使用进行了详细介绍,包括Git的基本概念、常用命令以及在团队协作中的最佳实践,同时还涉及了Chrome调试工具和Linux命令行的基础操作。
「offer来了」浅谈前端面试中开发环境常考知识点
|
2天前
|
人工智能 JavaScript 前端开发
使用Node.js模拟执行JavaScript
使用Node.js模拟执行JavaScript
11 2
|
3天前
|
消息中间件 JavaScript 前端开发
用于全栈数据流的 JavaScript、Node.js 和 Apache Kafka
用于全栈数据流的 JavaScript、Node.js 和 Apache Kafka
15 1
|
3天前
|
JavaScript 前端开发
电话号码正则表达式 代码 javascript+html,JS正则表达式判断11位手机号码
电话号码正则表达式 代码 javascript+html,JS正则表达式判断11位手机号码
22 1
|
19天前
|
JavaScript 前端开发
js之class继承|27
js之class继承|27
|
19天前
|
JSON JavaScript 前端开发
js原型继承|26
js原型继承|26
|
19天前
|
JavaScript 前端开发 开发者
JavaScript 类继承
JavaScript 类继承
15 1
|
3天前
|
移动开发 JavaScript 前端开发
【JavaScript】JS执行机制--同步与异步
【JavaScript】JS执行机制--同步与异步
10 0
|
6天前
|
数据采集 JavaScript 前端开发
JavaScript中通过array.filter()实现数组的数据筛选、数据清洗和链式调用,JS中数组过滤器的使用详解(附实际应用代码)
JavaScript中通过array.filter()实现数组的数据筛选、数据清洗和链式调用,JS中数组过滤器的使用详解(附实际应用代码)