JavaScript之原型和原型链

📒 博客首页：✎﹏ℳ๓敬坤的博客 🎈
😊 我只是一个代码的搬运工 🎃
🎉 欢迎来访的读者关注、点赞和收藏 🤞
😉有问题可以私信交流 😆
📃 文章标题：【JavaScript之原型和原型链】 🖍

原型对象和原型链

原型对象

JavaScript 常被描述为一种基于原型的语言 (prototype-based language)——每个对象拥有一个原型对象

如何使用原型

在javascript中，函数可以有属性。每个函数都有一个特殊的属性叫作原型(prototype)，正如下面所展示的。

function fu(){}
console.log(fu.prototype)

函数原型

原型对象都有默认的属性，它在控制台上面呈现了出来. 运行这段代码之后，控制台上面应该出现了像这样的一个对象.

除了默认属性，我们也可以自己给这个原型对象添加属性，如下：

fn.prototype.num=123

这样我们fn对象就会添加到一个num的属性，控制台效果如下：

实例对象原型

通过new创建一个实例对象，在给我们的实例对象添加属性

function fn(){}
fn.prototype.num=123
var newFn = new fn()
console.log(newFn)

可以发现我们实例对象下有一个[[Prototype]]属性，打开我们[[Prototype]]属性也可以找到函数原型的属性

原型链

原型对象也可能拥有原型，并从中继承方法和属性，一层一层、以此类推。这种关系常被称为原型链 (prototype chain)

原型链之间的关系

通过实例三种类型的实例对象来表达之前的关系

var num = new Number(123)
var str = new String('123')
var obj = new Object({a:123})
console.log(num)
console.log(str)
console.log(obj)

这三个类型的实例对象关系如下：

Object类型的实例对象的[[Prototype]]属性类型是Object
Number和String的第一个[[Prototype]]属性类型是对应的数据类型，但是在[[Prototype]]下，还有一个[[Prototype]]属性，但这个[[Prototype]]属性类型是Object。
这样我们就可以发现，不管什么类型的对象，最终的[[Prototype]]属性类型都是Object类型