从虚无到Object


起初,地是空虚混沌,渊面黑暗;这时候一切还是null

神说,要有原型,于是就有了prototype

原型从凭空产生,于是需要一个指向于null的特征,人们把这种特征叫做隐式原型,即__proto__,其实也就一种指向,表达的是自己从何而来,也就是:Object.prototype.__proto__ === null

“妖孽还不现出原型”

对,原型一般不显露,显露的一般都是一个对象,所以才会有“对象的原型”一说,就好像每个妖精都有自己的原型一样。

Object与原型的关系

Object通过prototype找到原型,原型通过constructor找到Object,也就是:Object.prototype.constructor === Object

构造函数的由来


函数共有的特点

constructor的意思是构造器,而此时的Object还不能构造任何东西,因此Object需要变成能构造对象的函数,这样的函数我们称之为构造函数;而这样的函数不会凭空产生,它首先得要是个函数,才能进行构造,也就是说会有条隐式原型指向Function.prototype,表示它是个函数;

同样说明:只要是函数,就有一条__proto__指向Function.prototype,包括Function自己;也就是:Function.__proto__===Function.prototype

一切的起源Object.prototype

除了Object.prototype是从null衍生而来,那其他原型呢?要知道,在Object世界中没有人是凭空产生的,Object.prototype除开;

可以看到所有构造函数的原型都是直接或间接来着Object.prototype,而所有系统构造函数的原型都直接来着于Object.prototype;

众所周知,js在找一个对象里面的属性的时候,如果在该对象找不到,就会去该对象的__proto__里面找,如果__proto__里面找不到,就会去对象的__proto__.__proto__里面找,直到找到null为止;

所以,换句话说,这里的构造函数都直接或间接的继承了Object.prototype的属性和方法,在类中,这些都相当于Object.prototype的子孙类,所以,Object.prototype才是一切的起源;

实例化


new做了啥?

实例化通常是指用类创建对象的过程,而在js中实例化有三种常见方法:

工厂模式

    function createObj() {
let obj= new Object();
obj.name= "小米";
obj.age= 22;
return obj;
}
let obj = createObj();

构造函数

    function CreateObj(name, age) {
this.name= name;
this.age= age;
}
let obj = new CreateObj("小米", 22);

原型模式

    function CreateObj() {};
CreateObj.prototype= {
name: "小米",
age: 22
};
let obj = new CreateObj();

这些实例化的方法无疑都用到了new,那new究竟在做了什么呢?

其实new只做了三件很简单的事

  1. 创建一个空对象var obj = Object.create(null);
  2. 让这个对象继承类的原型obj.__proto__ = CreateObj.prototype;
  3. CreateObj构造函数的this指针替换成obj,然后再调用CreateObj函数CreateObj.call(obj);

现在第一步和第二是可以合并在一起的;var obj = Object.create(CreateObj);

如果第三步不是很清楚了,可以去我的另外一篇博客回顾回顾哦!通道===>>>详解js的bind、call、apply

小结


  1. 只要是函数,就有一条__proto__指向Function.prototype,包括Function构造函数;
  2. 除了Object.prototype从null而来,就没有其他对象凭空产生了,绝对会有一条__proto__表明该对象的起源;

值得收藏的js原型详解的更多相关文章

  1. js对象详解(JavaScript对象深度剖析,深度理解js对象)

    js对象详解(JavaScript对象深度剖析,深度理解js对象) 这算是酝酿很久的一篇文章了. JavaScript作为一个基于对象(没有类的概念)的语言,从入门到精通到放弃一直会被对象这个问题围绕 ...

  2. Node.js npm 详解

    一.npm简介 安装npm请阅读我之前的文章Hello Node中npm安装那一部分,不过只介绍了linux平台,如果是其它平台,有前辈写了更加详细的介绍. npm的全称:Node Package M ...

  3. Vue.js项目详解

    还是以Blog项目来讲解,最近我本人利用闲暇时间,以博客作为参考学习一些新的技术并尝试之前没有尝试过的思路来玩玩. 技术看似枯燥,但是带有一个目的来学,你会发现还是蛮有趣的. 主要实践的就是前后端分离 ...

  4. JS 面向对象详解

    面向对象详解1 OO1.html <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...

  5. 开胃小菜——impress.js代码详解

    README 友情提醒,下面有大量代码,由于网页上代码显示都是同一个颜色,所以推荐大家复制到自己的代码编辑器中看. 今天闲来无事,研究了一番impress.js的源码.由于之前研究过jQuery,看i ...

  6. jquery图片切换插件jquery.cycle.js参数详解

    转自:国人的力量 blog.163.com/xz551@126/blog/static/821257972012101541835491/ 自从使用了jquery.cycle.js,我觉得再也不用自己 ...

  7. 第三天:JS事件详解-事件流

    学习来源: F:\新建文件夹 (2)\HTML5开发\HTML5开发\04.JavaScript基础\6.JavaScript事件详解 学习内容:  1)基础概念 2)举例说明: 代码如上,如果用事件 ...

  8. 值得珍藏的HTTP协议详解

    转自:http://www.cnblogs.com/li0803/archive/2008/11/03/1324746.html 引言 HTTP是一个属于应用层的面向对象的协议,由于其简捷.快速的方式 ...

  9. 【JavaScript】js中的构造函数,和构造函数的实例中的原型详解

    1. 构造函数作为一个对象,他也有他的原型属性,即.prototype:该属性指向的原型对象是Object. 2. 而构造函数产生的实例却没有.prototype属性,但是作为一个对象,该实例却仍然拥 ...

随机推荐

  1. iview使用之怎样通过render函数在tabs组件中添加标签

    在实际项目开发中我们通常会遇到一些比较'新颖'的需求,而这时iview库里往往没有现成可用的组件示例,所以我们就需要自己动手翻阅IviewAPI进行自定义一些组件,也可以说是将iview库里的多种组件 ...

  2. python信息收集(二)

        在第二层主机发现中,除了使用arping命令外,还可以使用Kali下自带的一个工具----netdiscover.      netdiscover是一个专门用于二层主机发现的工具,它有两种扫 ...

  3. py安装教程

    https://www.runoob.com/w3cnote/pycharm-windows-install.html

  4. 今天,VS Code 五岁了。

    时光飞逝,岁月如梭.今天,VS Code 迎来了 5 岁的生日. 回想起 VS Code 发布的那一天,仿佛还在昨天. 回顾 VS Code 这五年的发展,总是能给我们开发者带了无限的惊喜. 2015 ...

  5. NC使用练习之通达OA-2017版本漏洞复现后续

    利用上一篇通达OA的漏洞环境,练习NC工具的使用. 步骤: 1.本机启动nc.exe监听端口: 确认端口是否成功监听成功: 2.用冰蝎将nc.exe上传至目标机: 3.用命令行在目标机启动nc.exe ...

  6. 2019-2020-1 20199329《Linux内核原理与分析》第二周作业

    <Linux内核原理与分析>第二周作业 一.上周问题总结: 未能及时整理笔记 Linux还需要多用 markdown格式不熟练 发布博客时间超过规定期限 二.本周学习内容: <庖丁解 ...

  7. 一些软件的 Basic Auth 行为

    一个 WBEM 在2003年的bug I'm trying to access the WBEM service of the CIMOM on the ESX Server 3i and all m ...

  8. JS实现元素的全屏、退出全屏功能

     在实际开发中,我们很可能需要实现某一元素的全屏和退出全屏功能,如canvas.所幸的是,js提供了相关api用来处理这一问题,只需简单的调用requestFullScreen.exitFullScr ...

  9. 短视频sdk:选择一个靠谱的短视频SDK 你需要了解这些

    2017 年,短视频成为了内容创业的新风口,各种短视频 App 如雨后春笋般先后上线.随着互联网内容消费升级,视频越来越像文字.图片一样,成为每一个 App 不可或缺的一部分. 为了能够更好地聚焦于业 ...

  10. codeforce 1311E. Construct the Binary Tree (构造,就是个模拟)

    ACM思维题训练集合 You are given two integers n and d. You need to construct a rooted binary tree consisting ...