图解js原型

最近梳理了一下js原型

图例一

图例二

图例三

配有代码块和实操

/**
    * 两个概念
    * 构造函数和原型对象
    * 补充：普通对象和函数对象的概念
    */
    // 1.1构造函数
    function A () {}
    // 原型对象：在声明了一个函数之后，浏览器会自动按照一定的规则创建一个对象，这个对象就叫做原型对象。这个原型对象其实是储存在了内存当中
    console.log(A.prototype)
    console.log(A.prototype.constructor === A) // true
    // 1.2 实例与构造函数
    let stu = new A() // stu就是A构造函数的实例，实例也是对象，但是没有prototype属性
    console.log(typeof stu)
    console.log(stu.prototype) // undefined
    console.log(stu.__proto__) // 实例有内部的__proto__ 指向原型对象
    console.log(stu.__proto__ === A.prototype)
    // 1.3 实例有constructor属性
    console.log(stu.constructor === A)