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 相关文章推荐
在一个form用一个SUBMIT(或button)分别提交到两个处理表单页面的代码
Feb 15 Javascript
jQuery UI Autocomplete 1.8.16 中文输入修正代码
Apr 16 Javascript
jquery实现相册一下滑动两次的方法
Feb 09 Javascript
举例讲解JavaScript中将数组元素转换为字符串的方法
Oct 25 Javascript
整理Javascript数组学习笔记
Nov 29 Javascript
原生javascript实现的一个简单动画效果
Mar 30 Javascript
jquery 手势密码插件
Mar 17 Javascript
微信小程序图片轮播组件gallery slider使用方法详解
Jan 31 Javascript
小试SVG之新手小白入门教程
Jan 08 Javascript
微信小程序canvas开发水果老虎机的思路详解
Feb 07 Javascript
JavaScript 空间坐标的使用
Aug 19 Javascript
梳理一下vue中的生命周期
Dec 30 Vue.js
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
php的一些小问题
2010/07/03 PHP
Yii2.0 Basic代码中路由链接被转义的处理方法
2016/09/21 PHP
js基于qrcode.js生成二维码的方法【附demo插件源码下载】
2016/12/28 PHP
Jquery+JSon 无刷新分页实现代码
2010/04/01 Javascript
jquery下jstree简单应用 - v1.0
2011/04/14 Javascript
javascript重复绑定事件造成的后果说明
2013/03/02 Javascript
jQuery使用技巧简单汇总
2013/04/18 Javascript
JS截取字符串常用方法详细整理
2013/10/28 Javascript
深入解析JavaScript编程中的this关键字使用
2015/11/09 Javascript
AngularJS通过$http和服务器通信详解
2016/09/21 Javascript
React中jquery引用的实现方法
2017/09/12 jQuery
使用原生js+canvas实现模拟心电图的实例
2017/09/20 Javascript
Bootstrap Table中的多选框删除功能
2018/07/15 Javascript
使用Vue实现图片上传的三种方式
2018/07/17 Javascript
Node.js中Koa2在控制台输出请求日志的方法示例
2019/05/02 Javascript
layui点击数据表格添加或删除一行的例子
2019/09/12 Javascript
vue实现手机端省市区区域选择
2019/09/27 Javascript
js实现无缝轮播图
2020/03/09 Javascript
[05:20]卡尔工作室_DOTA2新手教学_DOTA2超强新手功能
2013/04/22 DOTA
[03:08]TI9战队档案 - Vici Gaming
2019/08/20 DOTA
python文件和目录操作函数小结
2014/07/11 Python
python海龟绘图实例教程
2014/07/24 Python
CentOS安装pillow报错的解决方法
2016/01/27 Python
Python字符串格式化的方法(两种)
2017/09/19 Python
Scrapy爬虫实例讲解_校花网
2017/10/23 Python
python实现比较文件内容异同
2018/06/22 Python
python实现图片上添加图片
2019/11/26 Python
numpy创建单位矩阵和对角矩阵的实例
2019/11/29 Python
python读取多层嵌套文件夹中的文件实例
2020/02/27 Python
Jmeter HTTPS接口测试证书导入过程图解
2020/07/22 Python
python中os.remove()用法及注意事项
2021/01/31 Python
美国家居装饰和豪华家具购物网站:One Kings Lane
2018/12/24 全球购物
就业协议书范本
2014/10/08 职场文书
2015学生会文艺部工作总结
2015/04/03 职场文书
python控制台打印log输出重复的解决方法
2021/05/14 Python
tensorboard 可视化之localhost:6006不显示的解决方案
2021/05/22 Python