首先的首先, 原型也就是 原型对象,它是一个对象
首先,先看几个关键词
prototype:指向函数的 原型对象, 只有函数拥有(非人为添加情况下)
__proto__:每个对象都有,指向 创建了该对象的构造函数的原型对象
constructor:指向原型对象的 构造函数
先创建一个函数 Cat
function Cat(name, color) {
this.name = name
this.color = color
}
在我们用 function 声明出 Cat之后,会自动创建两个东西,一个是 Cat函数的声明(暂且如此称呼,内容打印如下),另一个就是 Cat的原型对象
由此我们可以看出, Cat 的原型对象 Cat.prototype其实是包含 Cat 的声明内容的,所以,当我们用 function Cat()... 语句声明出来 Cat 之后,最重要的成果便是 Cat 的 原型对象 即 Cat.prototype
Cat 的原型对象的 contructor 属性指向Cat本身,也就是说 Cat就是 Cat的构造函数本身
接下来,我们深入讨论一下 Cat
Cat 是使用 function声明的,所以 Cat 是 Function 的实例,也就是说,它是一个对象,JS中万物皆对象,所 Cat 也是 Object 的实例也很好理解,至于 Function 和 Object 互为对方的实例,其原因在这里就不讨论了。
至此,我们可以知道,通过 function声明的 函数对象和一般的 对象 是不同的, 其不同点在于,他拥有自己的原型对象,即 prototype 属性所指向的对象
接下来, 我们继续探讨, 对 Cat 构造函数使用 new 会有哪些知识点
先看一个 new 的基本原理
// new 基本原理
// new命令的作用,就是执行一个构造函数,并且返回一个对象实例
// 执行过程如下
1. 创建一个空对象,作为将要返回的对象实例
2. 将空对象的__protype__属性指向了构造函数的 prototype 属性
3. 将空对象赋值给构造函数内部的this关键字
4. 开始执行构造函数内部的代码
这里的 构造函数 即 Cat
现在我们再次理解这句话
最后,我们再对比着看,prototype __proto__ contructor 三个属性的区别和联系
Cat.prototype 作为 Cat的原型对象而存在,也作为 cat的构造函数的原型对象 而存在, 它是一个独立存在的对象; Cat它本身 便是构造函数,也是一个由 Function构造函数所创建的函数实例对象, 参照如下
据此, 可以理解, 函数对象 是 Function 构造函数的实例, 可由 function 创建; 函数对象 与 一般对象的差别在于 函数对象, 会天然的拥有 prototype属性, 也就是天然的拥有属于它自己的 原型对象, 也就是所说的 函数的原型
至于 原型链,在 原型链继承 的内容中探讨会使其更加清晰,原型链继承的知识,明天继续学习
参考的文章有如下,但不限于如下,对作者们表示感谢
juejin.cn/post/684490… # JavaScript 中的构造函数
juejin.cn/post/693449… # 面不面试的,你都得懂原型和原型链
juejin.cn/post/684490… # js:面向对象编程,带你认识封装、继承和多态
juejin.cn/post/693985… # 终于懂了原型链!