JS-原型对象、原型属性、原型链

1,原型对象
    每一个函数,天生都有一个 prototype 属性,称为原型对象
    是一个专门用来存储数据,函数等内容的空间

2,原型属性
    每一个对象,天生都有一个 __proto__ 属性,称为原型属性
    实例化对象的原型属性,指向的创建实例化对象的构造函数的 prototype

    函数,数组,,JavaScript中的数据类型
    实际存储的形式都是一个对象,都会有 __proto__ 属性
    在JavaScript中,可以用对象的形式存储任何数据类型

3,原型链
    所谓的原型链,就是所有相互关联的变量,使用 __proto__ 属性串联起来
    调用数据数据时,会通过 __proto__ 将所有相互关联的 变量 串联
    只要有一个变量中 有相应的属性,就会调用成功

在这里插入图片描述
在这里插入图片描述

// 字面量方式,创建字符串
let str1 = 'beijing';
console.dir(str1);   →    北京
// 构造函数方式,创建字符串
let str2 = new String();
console.dir(str2);// 有_proto_

function fun(){}
console.dir(fun);// 有_proto_



实例化对象1 ---> 通过构造函数1创建的
构造函数1是 实例化对象2 的方法 
实例化对象2 ---> 通过构造函数2创建的
构造函数2是 实例化对象3 的方法 
实例化对象3 ---> 通过构造函数3创建的

构造函数3 ---> 生成 实例化对象3 ---> 构造函数2 ---> 生成 实例化对象2 ---> 构造函数1 ---> 生成 实例化对象1
构造函数本身有 prototype  也有 __proto__
实例化对象 有 __proto__



从函数内部向外走,最终到顶级相当于父级对象

实例化对象1 __proto__ 指向 构造函数1的 prototype

构造函数1本身也有 __proto__ 指向的是 实例化对象2

实例化对象2 __proto__ 指向 构造函数2的 prototype

构造函数2本身也有 __proto__ 指向的是 实例化对象3

实例化对象3 __proto__ 指向 构造函数3的 prototype

最终,所有的构造函数,对象,数组等都会指向 JavaScript中的顶级对象 Object 

会在 单例模式中 给大家演示 

为什么 实例化对象 本身没有函数方法, 构造函数上有,为什么可以调用使用
原因就是因为原型链的存在
实例化对象的 __proto__ 指向构造函数的 prototype , 就可以调用使用 构造函数 prototype中定义的方法
发布了125 篇原创文章 · 获赞 4 · 访问量 2844

猜你喜欢

转载自blog.csdn.net/DcTbnk/article/details/105446030