前言:用了这么久js,对于它的原型链一直有种模糊的不确切感,很不爽,隧解析之。

本文主要解决的问题有以下三个:

(1)constructor 和 prototype 以及实例之间啥关系?

(2)prototype是啥,__proto__又是啥,他们之间啥关系?

(3)如果改变一个 constructor 的 prototype,他的实例会发生什么改变?

ok,下面一个一个解决。

(1)constructor 和 prototype 以及实例对象三者之间啥关系?

举例:

  如上,当我们创建一个函数,系统就会为这个函数自动分配一个prototype指针,指向它的原型对象。并且可以发现,这个原型对象包含两个部分(constructor 和 __proto__)其中constructor指向函数自身。(这里形成了一个小闭环)

  当我们将该函数作为模版创建实例(new方法)的时候,我们发现创建出的实例是一个与构造函数同名的object,这个object是独立的,他只包含了一个__proto__指针(实例没有prototype,强行访问则会输出undefined),这个指针指向上面提到的构造函数的prototype原型对象。

  这时候我们发现三者形成了一个大"闭环"。之所以加上引号,因为构造函数和实例之间无法直接访问,需要通过__proto__指针间接读取。

这个"大闭环"画出来就是下面这个样子啦:

到此第一个问题已经解决。

(2)prototype是啥,__proto__又是啥,他们之间啥关系?

在上一个问题中,我们用到了实例对象的__proto__指针,实际上在JavaScript中大部分类型的值都拥有__proto__属性,例如:

当然object和function对象也有:

不过也有不存在__proto___属性的类型,比如:

等等。

然而。只有function对象才有prototype属性,其他任何类型的值都没有。即使是使用new方法从function构造出的实例对象也没有prototype属性。

(object类型的值的prototype输出undefined)

(我们改变了test的prototype的值,将其链接到一个函数名为test的函数,接着,函数类型的值的prototype输出了一个原型对象)

so,do you understand?

(3)如果改变一个 constructor 的 prototype,他的实例会发生什么改变?

我们来做一个尝试:

我们可以发现,改变了prototype之后创建的实例指向了新的prototype对象,而之前的依然指向老的prototype对象。

下面是个应用这个方法拓展实例的小例子:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
var shape = function () {
};
var p = {
    a: function () {
        console.log('aaa');
    }
};
shape.prototype = p;
 
var circle = new shape();
 
circle.a();
 
//输出'aaa'

 

好啦,到这里就讲完啦~~撒花哈哈哈哈~~~

5.Javascript 原型链之原型对象、实例和构造函数三者之间的关系的更多相关文章

  1. Javascript 原型链之原型对象、实例和构造函数三者之间的关系

    前言:用了这么久js,对于它的原型链一直有种模糊的不确切感,很不爽,隧解析之. 本文主要解决的问题有以下三个: (1)constructor 和 prototype 以及实例之间啥关系? (2)pro ...

  2. 【面向对象】----【prototype&&__proto__&&实例化对象三者之间的关系】(四)-----【巷子】

    1.构造函数 a.什么是构造函数? 解释:通过关键字new 创建的函数叫做构造函数 作用:用来创建一个对象 废话少说直接上代码,首先我们还是创建一个构造函数人类 然后我们在创建两个实例,一个凡尘 一个 ...

  3. 【面向对象】【prototype&&__proto__&&实例化对象三者之间的关系】

    1.构造函数 a.什么是构造函数? 解释:通过关键字new 创建的函数叫做构造函数 作用:用来创建一个对象 废话少说直接上代码,首先我们还是创建一个构造函数人类 然后我们在创建两个实例,一个凡尘 一个 ...

  4. 面向对象---prototype、__proto__、实例化对象三者之间的关系

    1.构造函数 a.什么是构造函数? 解释:通过关键字new 创建的函数叫做构造函数 作用:用来创建一个对象 废话少说直接上代码,首先我们还是创建一个构造函数人类 然后我们在创建两个实例,一个凡尘 一个 ...

  5. 创建Oracle数据库、数据库名与实例名与SID之间的关系(图文详解)

    分类: Oracle(9) 版权声明:转载请注明出处 JmilkFan_范桂飓:http://blog.csdn.net/jmilk 目录(?)[+] 目录 目录 软件环境 前言 安装Oracle监听 ...

  6. 做筛选遍历时遇到的json字符串、json对象、json数组 三者之间的转换问题

    这个是后台对登录用户以及筛选条件的操作 @Override public List<SdSdPer> listResults(String sidx, String sord) { try ...

  7. 吴裕雄--天生自然 JAVASCRIPT开发学习:对象 实例(2)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  8. 吴裕雄--天生自然 JAVASCRIPT开发学习:对象 实例(3)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  9. 浅谈Javascript中的原型、原型链、继承

    构造函数,原型,实例三者的关系 构造函数: 构造函数是创建对象的一种常用方式, 其他创建对象的方式还包括工厂模式, 原型模式, 对象字面量等.我们来看一个简单的构造函数: function Produ ...

随机推荐

  1. 在 Linux 下使用mdadm创建 RAID 5

    在 RAID 5 中,数据条带化后存储在分布式奇偶校验的多个磁盘上.分布式奇偶校验的条带化意味着它将奇偶校验信息和条带化数据分布在多个磁盘上,这样会有很好的数据冗余. 在 Linux 中配置 RAID ...

  2. linux read 系统调用剖析

    https://www.ibm.com/developerworks/cn/linux/l-cn-read/ MT注:原文图1与Understanding the Linux Kernel, 3rd ...

  3. OpenCL 存储器次序的验证

    ▶ <OpenCL异构并行编程实战>P224 的代码,先放上来,坐等新设备到了再执行 //kernel.cl __global ); // 全局原子对象 __kernel void mem ...

  4. linux7系统开机报错failed to start login service

    1.开机报错failed to start login service 参考网站:https://unix.stackexchange.com/questions/264994/kali-sudden ...

  5. windows的类似shell 命令操作

    一,类似linux的grep命令 参考网站:https://www.cnblogs.com/zxy1992/p/4372717.html windows执行cmd命令查找sql进程: C:\Users ...

  6. 多媒体基础知识之PCM数据

    1.什么是PCM音频数据 PCM(Pulse Code Modulation)也被称为脉冲编码调制.PCM音频数据是未经压缩的音频采样数据裸流,它是由模拟信号经过采样.量化.编码转换成的标准的数字音频 ...

  7. EF时间模糊查询

    public List<Vote> SelectVoteByTime(string time) { return db.Vote.ToList().Where(x => x.V_Be ...

  8. python之类的相关知识

    面向对象技术简介 类: 用来描述具有相同的属性和方法的对象的集合.它定义了该集合中每个对象所共有的属性和方法.对象是类的实例. 类变量:类变量在整个实例化的对象中是公用的.类变量定义在类中且在函数体之 ...

  9. java是如何编码解码的

    在上篇博客中LZ阐述了java各个渠道转码的过程,阐述了java在运行过程中那些步骤在进行转码,在这些转码过程中如果一处出现问题就很有可能会产生乱码!下面LZ就讲述java在转码过程中是如何来进行编码 ...

  10. linux系统安装中文支持,解决中文乱码问题

    怎么设置Linux系统中文语言,这是很多小伙伴在开始使用Linux的时候,都会遇到一个问题,就是终端输入命令回显的时候中文显示乱码.出现这个情况一般是由于没有安装中文语言包,或者设置的默认语言有问题导 ...