对象都是通过函数创建的

 function Fn() {
this.name = '王福朋';
this.year = 1988;
}
var fn1 = new Fn();

fn1是个对象,它是由函数Fn创建的,但是我要说都大家可能会反驳,不信你往下看

var obj = { a: 10, b: 20 };
var arr = [5, 'x', true];

但是不好意思,这个——真的——是一种——“快捷方式”,在编程语言中,一般叫做“语法糖”。

做“语法糖”做的最好的可谓是微软大哥,它把他们家C#那小子弄的不男不女从的,本想图个人见人爱,谁承想还得到处跟人解释——其实它是个男孩!

话归正传——其实以上代码的本质是:

//var obj = { a: 10, b: 20 };
//var arr = [5, 'x', true]; var obj = new Object();
obj.a = 10;
obj.b = 20; var arr = new Array();
arr[0] = 5;
arr[1] = 'x';
arr[2] = true;

而其中的 Object 和 Array 都是函数:

console.log(typeof (Object));  // function
console.log(typeof (Array)); // function

可以很负责任的说——对象都是通过函数来创建的。

可以很负责任的说——对象都是通过函数来创建的。

每个对象都有一个__proto__属性,指向创建该对象的函数的prototype。

var obj = { }
console.log(obj._proto_)
obj这个对象本质上是被Object函数创建的,因此obj.__proto__=== Object.prototype

如图所示

即,每个对象都有一个__proto__属性,指向创建该对象的函数的prototype。

那么上图中的“Object prototype”也是一个对象,它的__proto__指向哪里?

好问题!

在说明“Object prototype”之前,先说一下自定义函数的prototype。自定义函数的prototype本质上就是和 var obj = {} 是一样的,都是被Object创建,所以它的__proto__指向的就是Object.prototype。

但是Object.prototype确实一个特例——它的__proto__指向的是null,切记切记!

还有——函数也是一种对象,函数也有__proto__吗?

又一个好问题!——当然有。

函数也不是从石头缝里蹦出来的,函数也是被创建出来的。谁创建了函数呢?——Function——注意这个大写的“F”。

且看如下代码。

以上代码中,第一种方式是比较传统的函数创建方式,第二种是用new Functoin创建。

首先根本不推荐用第二种方式。

这里只是向大家演示,函数是被Function创建的。

好了,根据上面说的一句话——对象的__proto__指向的是创建它的函数的prototype,就会出现:Object.__proto__ === Function.prototype。用一个图来表示。

上图中,很明显的标出了:自定义函数Foo.__proto__指向Function.prototype,Object.__proto__指向Function.prototype,唉,怎么还有一个……Function.__proto__指向Function.prototype?这不成了循环引用了?

对!是一个环形结构。

其实稍微想一下就明白了。Function也是一个函数,函数是一种对象,也有__proto__属性。既然是函数,那么它一定是被Function创建。所以——Function是被自身创建的。所以它的__proto__指向了自身的Prototype。

参考博客

JS一切皆对象理解的更多相关文章

  1. JS中的对象和方法简单剖析

    众所周知,在js中对象就是精髓,不理解对象就是不理解js. 那么什么事js中的对象呢? 在js中,几乎一切皆对象: Boolean ,String,Number可以是对象(或者说原生数据被认作对象): ...

  2. JS类、对象、方法、prototype、_proto_

    案例代码: function People(name) { //对象属性 this.name = name; //对象方法 this.Introduce = function() { alert(&q ...

  3. 深入理解JS中的对象(一)

    目录 一切皆是对象吗? 对象 原型与原型链 构造函数 参考 1.一切皆是对象吗? 首先,"在 JavaScript 中,一切皆是对象"这种表述是不完全正确的. JavaScript ...

  4. 深入理解JS中的对象(二):new 的工作原理

    目录 序言 不同返回值的构造函数 深入 new 调用函数原理 总结 参考 1.序言 在 深入理解JS中的对象(一):原型.原型链和构造函数 中,我们分析了JS中是否一切皆对象以及对象的原型.原型链和构 ...

  5. 大话JS面向对象之开篇万物皆对象------(ATM取款机引发的深思)

    一,总体概要 OO(面向对象)概念的提出是软件开发工程发展的一次革命,多年来我们借助它使得很多大型应用程序得以顺利实现.如果您还没有掌握并使用OO进行程序设计和开发,那么您无疑还停留在软件开发的石器时 ...

  6. 对Java“一切皆对象”的理念的理解

    在从HelloWorld到面向对象中,我们将int, float, double, boolean等称为基本类型(primitive type),也就是特殊的类.我们可以将一个整数理解称为一个int类 ...

  7. python 进阶读书笔记1 -- 理解python一切皆对象

    理解python一切皆对象: 1.所有的类都是由type创建的 2.所有的类的基类都是object 3.type是类,也是实例,type的基类是object,type对象是由type创建的 4.obj ...

  8. 深入理解JS中的对象(三):class 的工作原理

    目录 序言 class 是一个特殊的函数 class 的工作原理 class 继承的原型链关系 参考 1.序言 ECMAScript 2015(ES6) 中引入的 JavaScript 类实质上是 J ...

  9. python中一切皆对象的理解

    一切皆对象? 学过Java都知道,Java中有8个基本类型,其余的都是继承自Object类的引用类型.方法内的基本类型变量会在栈上分配,而引用类型会通过逃逸分析来决定在栈上分配或堆上分配.Java中关 ...

  10. JS核心系列:理解 new 的运行机制

    和其他高级语言一样 javascript 中也有 new 运算符,我们知道 new 运算符是用来实例化一个类,从而在内存中分配一个实例对象. 但在 javascript 中,万物皆对象,为什么还要通过 ...

随机推荐

  1. plsql链接oracle

    安装两个oracle文件夹在一个database中,安装plsql 要先配置两个都要修改,不然会找不到服务器 管理员运行  监听服务/监听位置和数据库服务都要修改 ass文件---监听程序配置 和本场 ...

  2. Word技巧:ALT+X快捷键

    Word技巧:ALT+X快捷键 在Word中输入数字,然后使用键盘快捷键「ALT + X」,即可快速生成一个文字图形. 部分数字的对比参照: 2564 ╤ 2582 ▂ 2600 2618 ☘ 256 ...

  3. 了解windows下的npm

    之前一直使用Ubuntu系统,对于需要的软件.安装包,都可以使用apt或者apt-get进行安装,本人也是用过python,对于python库的安装,也可以通过pip或者conda来实现,那么,在wi ...

  4. dotnet 项目生成自签名证书

    解决dotnet 项目浏览器不安全提示 dotnet dev-certs - 生成自签名证书,以便在开发中使用 HTTPS. dotnet dev-certs https --clean dotnet ...

  5. ajax json php post 方法

    1.前端 <script type="text/javascript"> function LoadData(arg){ arg.dept=$("#DeptS ...

  6. 如何找到并使用makecert.exe

    如果安装visual studio 后,visual studio command  仍然无法识别 makecert.exe 命令. 则需要手动安装 Windows Software Developm ...

  7. eclipse静态资源保存不重启(热部署静态资源/html)

    简单的来说就是windows->Prefrence->搜索 build automatically 并勾选就可以 不同的版本设置选项可能略微不同,其实比较简单但是新手可能不好找,所以帮到的 ...

  8. vue移动端购物商场首页制作

    1.搭建项目框架 新建首页主组件及其子组件并将子组件展示出来 2.封装所需接口 3.编写轮播图组件 <template> <div id="swipercom"& ...

  9. jmeter 变量的使用

    jmeter添加变量 一.添加用户自定义变量 添加用户自定义变量 作用:常用数据参数化.当变量发生变化时,不需要逐个脚本修改,只需要修改用户自定义中的变量就可以了. 变量使用如下图 二.函数助手定义变 ...

  10. jquery 时间戳转化为日期时间格式,年月日 时分秒

    <script type="text/javascript"> var strDate = ''; $(function(){ // 获取时间戳 时间戳为10位需*10 ...