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 相关文章推荐
获取div编辑框,textarea,input text的光标位置 兼容IE,FF和Chrome的方法介绍
Nov 08 Javascript
Javascript和HTML5利用canvas构建Web五子棋游戏实现算法
Jul 17 Javascript
JS、CSS加载中的小问题探讨
Nov 26 Javascript
JS中from 表单序列化提交的代码
Jan 20 Javascript
基于JavaScript实现新增内容滚动播放效果附完整代码
Aug 24 Javascript
axios简单实现小程序延时loading指示
Jul 30 Javascript
移动端滑动切换组件封装 vue-swiper-router实例详解
Nov 25 Javascript
vue柱状进度条图像的完美实现方案
Aug 26 Javascript
layui的layedit富文本赋值方法
Sep 18 Javascript
JavaScript修改注册表实例代码
Jan 05 Javascript
vue脚手架项目创建步骤详解
Mar 02 Vue.js
vue项目支付功能代码详解
Feb 18 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实现多服务器session共享之NFS共享的方法
2007/03/16 PHP
javascript中的onkeyup和onkeydown区别介绍
2013/04/28 Javascript
javascript实现根据3原色制作颜色选择器的方法
2015/07/17 Javascript
Javascript实现的Map集合工具类完整实例
2015/07/31 Javascript
总结JavaScript设计模式编程中的享元模式使用
2016/05/21 Javascript
AngularJS 过滤器的简单实例
2016/07/27 Javascript
bootstrap多种样式进度条展示
2016/12/20 Javascript
js判断一个字符串是以某个字符串开头的简单实例
2016/12/27 Javascript
AngularJs实现聊天列表实时刷新功能
2017/06/15 Javascript
vue中如何实现变量和字符串拼接
2017/06/19 Javascript
基于vue.js实现的分页
2018/03/13 Javascript
nodejs实现套接字服务功能详解
2018/06/21 NodeJs
jQuery实现小火箭返回顶部特效
2020/02/03 jQuery
[41:08]2014 DOTA2国际邀请赛中国区预选赛 HGT VS NE
2014/05/22 DOTA
python实现登陆知乎获得个人收藏并保存为word文件
2015/03/16 Python
简单解析Django框架中的表单验证
2015/07/17 Python
Python文本处理之按行处理大文件的方法
2018/04/09 Python
Windows下安装Scrapy
2018/10/17 Python
解决pycharm的Python console不能调试当前程序的问题
2019/01/20 Python
django 2.2和mysql使用的常见问题
2019/07/18 Python
python 怎样将dataframe中的字符串日期转化为日期的方法
2019/09/26 Python
Pygame的程序开始示例代码
2020/05/07 Python
Python爬取12306车次信息代码详解
2020/08/12 Python
Python2及Python3如何实现兼容切换
2020/09/01 Python
Famous Footwear加拿大:美国多品牌运动休闲鞋店
2018/12/05 全球购物
性能测试工程师的面试题
2015/02/20 面试题
机修工岗位职责
2013/11/24 职场文书
写给保洁员表扬信
2014/01/08 职场文书
小学教学随笔感言
2014/02/26 职场文书
主题教育活动总结
2014/05/05 职场文书
乡镇消防安全责任书
2014/07/23 职场文书
感恩父母主题班会
2015/08/12 职场文书
Nginx同一个域名配置多个项目的实现方法
2021/03/31 Servers
Python3 如何开启自带http服务
2021/05/18 Python
docker compose 部署 golang 的 Athens 私有代理问题
2022/04/28 Servers
MySQL下载安装配置详细教程 附下载资源
2022/09/23 MySQL