javascript 中__proto__和prototype详解


Posted in Javascript onNovember 25, 2014

__proto__是内部原型,prototype是构造器原型(构造器其实就是函数)

构造器的原型(prototype)是一个对象

那什么是构造器呢?
要想创建一个对象,首先要有一个对象构造器,就像php里面一样,要想创建一个对象,首先要有一个类
构造器的实质就是一个函数,下面的问题是:如何通过这个构造器来创建一个对象呢?
答案: new

构造器构造的是对象。
一、所有构造器/函数的__proto__都指向Function.prototype,它是一个空函数(Empty function)

Number.__proto__ === Function.prototype  

// true

Boolean.__proto__ === Function.prototype 

// true

String.__proto__ === Function.prototype  

// true

Object.__proto__ === Function.prototype  

// true

Function.__proto__ === Function.prototype 

// true

Array.__proto__ ===

Function.prototype   

// true

RegExp.__proto__ === Function.prototype  

// true

Error.__proto__ ===

Function.prototype   

// true

Date.__proto__ ===

Function.prototype    

// true

说明了Number等都是构造器,这些构造器其实是Function的一个对象。 也就是说相当于 var Number = new Function();

JavaScript中有内置(build-in)构造器/对象共计12个(ES5中新加了JSON),这里列举了可访问的8个构造器。剩下如Global不能直接访问,Arguments仅在函数调用时由JS引擎创建,Math,JSON是以对象形式存在的,无需new。它们的__proto__是Object.prototype。如下

Math.__proto__ === Object.prototype  

// true

JSON.__proto__ === Object.prototype  

// true

上面说的“所有构造器/函数”当然包括自定义的。如下

// 函数声明

function Person()

{}

// 函数表达式

var Man

= 

function()

{}

console.log(Person.__proto__ === Function.prototype) 

// true

console.log(Man.__proto__ ===

Function.prototype)    

// true

这说明什么呢?

所有的构造器都来自于Function.prototype,甚至包括根构造器Object及Function自身。所有构造器都继承了Function.prototype的属性及方法。如length、call、apply、bind(ES5)。

Function.prototype也是唯一一个typeof XXX.prototype为 “function”的prototype。其它的构造器的prototype都是一个对象。如下

console.log(typeof Function.prototype) 

// function

console.log(typeof Object.prototype)   

// object

console.log(typeof Number.prototype)   

// object

console.log(typeof Boolean.prototype)  

// object

console.log(typeof String.prototype)   

// object

console.log(typeof Array.prototype)    

// object

console.log(typeof RegExp.prototype)   

// object

console.log(typeof Error.prototype)    

// object

console.log(typeof Date.prototype)     

// object

console.log(typeof Object.prototype)   

// object

噢,上面还提到它是一个空的函数,alert(Function.prototype) 下看看。

知道了所有构造器(含内置及自定义)的__proto__都是Function.prototype,那Function.prototype的__proto__是谁呢?

相信都听说过JavaScript中函数也是一等公民,那从哪能体现呢?如下

console.log(Function.prototype.__proto__ ===

Object.prototype) 

// true

这说明所有的构造器也都是一个普通JS对象,可以给构造器添加/删除属性等。同时它也继承了Object.prototype上的所有方法:toString、valueOf、hasOwnProperty等。

最后Object.prototype的__proto__是谁?

Object.prototype.__proto__ === 

null  //

true

已经到顶了,为null。

大家是否对javascript 中__proto__和prototype之间的区别联系有所了解了呢,有疑问就留言,大家共同探讨吧

Javascript 相关文章推荐
jquery 简短右键菜单 多浏览器兼容
Jan 01 Javascript
利用jquery包将字符串生成二维码图片
Sep 12 Javascript
jQuery实现数字加减效果汇总
Dec 16 Javascript
修复bash漏洞的shell脚本分享
Dec 31 Javascript
javascript实现uploadify上传格式以及个数限制
Nov 23 Javascript
Jquery 自定义事件实现发布/订阅的简单实例
Jun 12 Javascript
jQuery Ajax 上传文件处理方式介绍(推荐)
Jun 30 Javascript
详解jQuery事件
Jan 13 Javascript
JS ES6中setTimeout函数的执行上下文示例
Apr 27 Javascript
jquery在vue脚手架中的使用方式示例
Aug 29 jQuery
详解vuex结合localstorage动态监听storage的变化
May 03 Javascript
使用Vue做一个简单的todo应用的三种方式的示例代码
Oct 20 Javascript
js 加密压缩出现bug解决方案
Nov 25 #Javascript
js Object2String方便查看js对象内容
Nov 24 #Javascript
js的[defer]和[async]属性
Nov 24 #Javascript
使用JavaScript 编写简单计算器
Nov 24 #Javascript
JS和JQ的event对象区别分析
Nov 24 #Javascript
JavaScript实现大数的运算
Nov 24 #Javascript
使表格的标题列可左右拉伸jquery插件封装
Nov 24 #Javascript
You might like
Windows中使用计划任务自动执行PHP程序实例
2014/05/09 PHP
php从文件夹随机读取文件的方法
2015/06/01 PHP
PHP+Mysql+jQuery查询和列表框选择操作实例讲解
2015/10/22 PHP
PHP使Laravel为JSON REST API返回自定义错误的问题
2018/10/16 PHP
数据结构之利用PHP实现二分搜索树
2020/10/25 PHP
JavaScript入门基础
2015/08/12 Javascript
javascript构造函数以及原型对象的理解
2017/01/13 Javascript
Node.js的特点详解
2017/02/03 Javascript
canvas实现动态小球重叠效果
2017/02/06 Javascript
javascript 的变量、作用域和内存问题
2017/04/19 Javascript
JavaScript实现图片无缝滚动效果
2017/07/07 Javascript
Angular4学习之Angular CLI的安装与使用教程
2018/01/04 Javascript
使用JS模拟锚点跳转的实例
2018/02/01 Javascript
vue component 中引入less文件报错 Module build failed
2019/04/17 Javascript
一文读懂ES7中的javascript修饰器
2019/05/06 Javascript
VUE安装使用教程详解
2019/06/03 Javascript
通过javascript实现扫雷游戏代码实例
2020/02/09 Javascript
JavaScript实现4位随机验证码的生成
2021/01/28 Javascript
Python中的zipfile模块使用详解
2015/06/25 Python
Python实现分割文件及合并文件的方法
2015/07/10 Python
Python 查看文件的编码格式方法
2017/12/21 Python
python编程培训 python培训靠谱吗
2018/01/17 Python
Python hashlib模块用法实例分析
2018/06/12 Python
使用Django简单编写一个XSS平台的方法步骤
2019/03/25 Python
对Python生成器、装饰器、递归的使用详解
2019/07/19 Python
django一对多模型以及如何在前端实现详解
2019/07/24 Python
浅谈在JupyterNotebook下导入自己的模块的问题
2020/04/16 Python
opencv 图像腐蚀和图像膨胀的实现
2020/07/07 Python
Under Armour安德玛中国官网:美国高端运动科技品牌
2018/03/09 全球购物
美国体育用品商店:Academy Sports + Outdoors
2020/01/04 全球购物
SQL Server里面什么样的视图才能创建索引
2015/04/17 面试题
AJAX检测用户名是否存在的方法
2021/03/24 Javascript
英语故事演讲稿
2014/04/29 职场文书
2014流动人口计划生育工作总结
2014/12/20 职场文书
测量员岗位职责
2015/02/14 职场文书
小学安全工作总结2015
2015/05/18 职场文书