最近在准备面试,感觉好些东西了解,但是了解的深度有限。自己就总结了几个模块,打算强化一下。如果你感觉我的文章对你有帮助,请点赞。如果感觉有哪些不足之处,可以留言。让我们一同进步,学习!!!
最后在说明一下,这个系列我会一直写下去。如果,你有什么好的方向,也可以提出来。
说一下原型,原型链的题目
- 简单说明一下自己对原型,原型链的理解
- 创建对象有几种方法
- instanceof 的原理
- new 运算符的过程
- 继承
- 原型链的最终指向为什么是null
在介绍之前。我们应该民百几个名词。构造函数,实例(实例对象),原型对象,隐私原型,显示原型
JS本身是基于原型继承的语言。ES5之前是基于原型继承
原型
每一个对象好像都有 toString(),valueof()方法。可是我们根本没有写这些方法啊。我们肯定会说,这是js帮我们写好的,我们直接用就可以。这么说,也是没有毛病的。但是,我们自己创造的对象(new 出来的对象)是如何与那些东西挂钩起来的呢?
答案是 原型
function People(name) {
this.name = name
}
let people = new People("小明")
我们在创建一个对象的时候,有很多默认的方法就已经初始化的挂在到了_proto_上面。这个内置的_proto_方法默认指向上一层的构造函数的实例对象上。正是有了这种方式为基础,JS才可以实现继承。
people._proto_ === Object.prototype // true
构造函数
我们已经知道_proto_是指向原型对象的指针。那么原型对象是谁创建的呢,也就是说那些默认方法是这么来的呢。
我们打开刚刚的例子,会发现里面还有一个constructor的方法。打开会发现,它里面正好指向People。原型对象是在构造函数初始化初始化的时候,一同被创建的。其中默认会有constructor方法,方法中保存这创建他的原型对象。(这也是hasOwnProperty的原理)。
构造函数的本质其实就是一个函数。但是我们为了区分,在写构造函数的时候,首字母大写。
上面这幅图,我们在很懂地方都见过。
总结出来就是
实例对象的隐式原型(proto) === 构造函数的显示原型(protatype)
如果想知道原型对象的构造函数,可以查看(constructor)
原型链
如果理解了原型机制,原型链就很好解释了。其实上面一张图上,那条被 proto 链接起来的链式关系,就称为原型链。当我们一个实例对象使用一个自己没有的对象的时候,就会顺着_proto_寻找他的原型,如果他的原型也没有就继续顺着_proto_寻找。知到Object.prototype (因为他的原型是null)
为什么原型对象的尽头是null
1、原型链上的所有节点都对象,不能是其他值
typeof null // Object
2、原型链既要是有限长度的,又不能是闭环的。所以一定会有一个终点。
2、观看原型链的图,我们就会发现每一个原型都有_proto_,为了保持这种一致。Object.prototype一定也会有
创建对象的几种方法
// 方法1
let O = { o : 'oo' }
let o1 = new Object()
// 方法 2
let T = function() {}
let t = new T()
// 方法 3
let p = { p: 'pp' }
let p1 = Object.create(p)
new 运算符的过程
1、先创建一个空对象,同时继承与构造函数的原型对象
2、构造函数被执行。执行的过程中,相应的传参会被传入,同时上下文文会被指向这个 新实例。
new foo = new foo(),只能用在不传递任何参数的情况
var new2= function(func) {
vae o = Object.crete(func.prototype)
var k = func.call(o)
if(typeof k = "object") {
return k } else { return 0 }
}
3、如果构造函数返回一个 对象,那么这个对象会取代整个new出来的结果。如果构造函数没有返回对象,那么new出来的结果未步骤1创建的对象
原型链继承
就像之前说的。原型链继承就是让将对象通过原型链串联起来。
function Father() {
}
Father.prototype.say = function() {
console.log("我是爸爸父类")
}
function Son() {
}
Son.prototype = new Father()
Son.prototype.constructor = Son
如果上面那个不好理解,我们看Class的方式
class Father {
constructor() {
this.name = name
}
say() {
console.log("我是爸爸父类")
}
}
class Son extends Father {
constructor(name,age) {
super(name)
this.age = age
}
speak() {
console.log("我是个宝宝")
}
}
let son = new Son("儿子",19)
son.say() // 我是爸爸父类
son.speak() // 我是个宝宝
感觉好多东西没写清楚。病了,缓缓再写。