JavaScript原型链个人理解记录

149 阅读1分钟
前提:了解原型链基本定义; 
     了解__proto__,constructor,prototype属性; 
     了解ObjectObject.prototypeFunctionFunction.prototype内置函数和对象。

前瞻:直观看看代码执行完毕后,原型链是什么样子

代码:

var Vue = function() {
  return 0
}

var vue = new Vue()

结果(原型链就是由__proto__连接起来的链):

正文

1.看看没有写代码的时候,已经存在的东西

2.开始创建Vue函数

var Vue = function() {
  return 0
}

2-1.出现 Vue(函数)Vue.prototyp(对象) 这两个东西,并相互抱团(确定construct和prototype指向)

2-2. Vue.prototype(对象) 是由 Object(函数) 创建的实例

根据规则:实例的 __proto__ 指向 创建实例的函数的 prototype。

可得 Vue.prototype(对象) 的 __proto__ 指向:

2-3. Vue(函数) 是由 Function(函数) 创建的实例

根据规则:实例的 __proto__ 指向 创建实例的函数的 prototype。

可得 Vue(函数) 的 __proto__ 指向:

3.开始创建vue对象

var vue = new Vue()

vue(对象) 是由 Vue(函数) 创建的实例

根据规则:实例的 __proto__ 指向 创建实例的函数的 prototype。

可得 vue(对象) 的 __proto__ 指向:

总结