javascript原型深入解析2--Object和Function,先有鸡先有蛋
1.提出两个问题:
- Js 的prototype和__proto__ 是咋回事?
- 先有function 还是先有object?
2.引用《JavaScript权威指南》的一段描述:
每个JS对象一定对应一个原型对象(__proto__指向的),并从原型对象继承属性和方法。
function Person(){
this.live = true;
}
var sy = new Person();
console.info(sy.__proto__ === Person.prototype) // true
Cat = {};
console.info(Cat.__proto__ === Object.prototype) // true
Dog = new Object();
console.info(Dog.__proto__ === Object.prototype) // true
又来一个问题:
Object 是js中的最原始的对象吗?Object.prototype是什么?
3.先谈prototype
只有函数才有prototype属性。
JS不像其它面向对象的语言,它没有类(class,ES6引进了这个关键字,但更多是语法糖)的概念。JS通过函数来模拟类。

当你创建(定义)函数Person时,JS会为这个函数自动添加prototype属性,其是Object类型对象,并且包含constructor和__proto__。
而一旦你把这个函数当作构造函数(constructor)调用(即通过new关键字调用),那么JS就会帮你创建该构造函数的实例sy,实例继承构造函数prototype的所有属性和方法(实例通过设置自己的__proto__指向承构造函数的prototype来实现这种继承)。
对象的__proto__指向自己构造函数的prototype。sy.__proto__.__proto__...的原型链由此产生,包括我们的操作符instanceof正是通过探测obj.__proto__.__proto__... === Constructor.prototype来验证sy是否是Person或者Object的实例。
4.函数和对象之间的关系(重点)
创建个函数有两种方式:
(1)
var foo = new Function ([arg1[, arg2[, ...argN]],] functionBody)
(2)
function foo() {} // var foo = function(){}
深入分析函数:
函数也是对象,是一个Function实例(Function就像是python中的元类的角色),我们称函数是特殊的对象(只有函数有prototype)。
因此每个函数对象都继承Function的原型对象,Person.__proto__ 指向Function.prototype。下面两个黑框是同一个内存对象


给出两个判断:
Object instanceof Function // true
Function instanceof Object // true
Function是函数的起源,那Function本身是什么呢?
Object又是什么呢,先有Object还是先有Function
乱了。。。。。
上关系图来分析吧。

再来看个js开天劈地的伪代码
var ObjectPrototype = create( ); // 开天辟地 var FunctionPrototype = create( ObjectPrototype );
//FunctionPrototype(后被赋值给了Function.prototype)是Object类型的
//因为其原型是ObjectPrototype var Function = create( FunctionPrototype ); Function.prototype = FunctionPrototype;
// Function是Function类型的,也是Object类型的
//言外之意,Function对象 原型链上有Function.prototype和Object.prototype Object = create( FunctionPrototype ); Object.prototype = ObjectPrototype;
//Object是Function类型的,也是Object类型的
//言外之意Object对象的原型链上有Function.prototype和Object.prototype
- 先有了Object.prototype,
- 然后有Function.prototype,
- 然后有了Function,
- 然后创建了Object,
- Object的原型又指向了Object.prototype,构成了循环指向;
从而出现了鸡和蛋的问题。
所以严格来说先有Function再有Object。
但是又先有的Object原型,再有的Function原型。
Object.prototype.__proto__ === null,说明原型链到Object.prototype终止
- Person是Function创建出来的函数,Person.prototype是个Object对象,Person.proyotype.__proto__指向Object.prototype
- Function是js自带的对象,可以创建函数的函数,所以Function.prototype指向的函数根源,所有创建的函数的__proto__都指向Function.prototype。给Object原型添加方法,Function也会有该方法,因为Function.prototype 指向Object.prototype。
- Object是js自带的对象,算基类; Object本身又是通过Function定义出来的,所以会受到Function影响。
- Function只管函数,Object什么都管。

可以发现黑框的Object不是普通的Object,而是原始天尊
javascript原型深入解析2--Object和Function,先有鸡先有蛋的更多相关文章
- javascript原型深入解析1-prototype 和原型链、js面向对象
1.用prototype 封装类 创建的每个函数都有一个prototype(原型属性),他是个指针,指向的对象,这个对象的用途就是包含了这个类型所有实例共享的属性和方法. 回味这句,想想java或者C ...
- JavaScript原型链以及Object,Function之间的关系
JavaScript里任何东西都是对象,任何一个对象内部都有另一个对象叫__proto__,即原型,它可以包含任何东西让对象继承.当然__proto__本身也是一个对象,它自己也有自己的__proto ...
- 前端笔记之JavaScript面向对象(一)Object&函数上下文&构造函数&原型链
一.对象(Object) 1.1 认识对象 对象在JS中狭义对象.广义对象两种. 广义:相当于宏观概念,是狭义内容的升华,高度的提升,范围的拓展.狭义:相当于微观概念,什么是“狭”?因为内容狭隘具体, ...
- Javascript Object、Function对象
1.Object对象 原型对象 原型是对象的一个属性,也就是prototype属性,每个对象都有这个内部属性,而且他本身也是一个对象. <script type="text/javas ...
- JavaScript中你所不知道的Object(二)--Function篇
上一篇(JavaScript中你所不知道的Object(一))说到,Object对象有大量的内部属性,而其中多数和外部属性的操作有关.最后留了个悬念,就是Boolean.Date.Number.Str ...
- javascript的 Object 和 Function
一. javascript 的 内置对象: Object 和 Function javascript所有东西,包括 Function 都是对象 . Array 其实是一个 Function 类型的对 ...
- 从Object和Function说说JS的原型链
ECMAScript规定了两个特殊的内置对象:Object和Function.他们的特殊性在于,他们本身既是对象又是函数,而他们同时也是对象和函数的构造器.这种自己生自己的逻辑显然违反人性,如果还停留 ...
- 从var func=function 和 function func()区别谈Javascript的预解析机制
var func=function 和 function func()在意义上没有任何不同,但其解释优先级不同:后者会先于同一语句级的其他语句. 即: { var k = xx(); function ...
- Jascript原型链以及Object和Function之间的关系
先看一个简单的function变量 function fun1(name) { this.name = name; } console.log("fun1", fun1) 从结果可 ...
随机推荐
- XGBoost使用教程(纯xgboost方法)一
一.导入必要的工具包# 导入必要的工具包import xgboost as xgb # 计算分类正确率from sklearn.metrics import accuracy_score二.数据读取X ...
- 用session实现的用户登陆,客户端是怎样获取到cookie信息的
大家都知道cookie是存在客户端,session存在服务器端.那么客户端具体是怎样获取cookie信息的呢? 更好的阅读体验可访问 这里. 实验环境 实验环境:xampp + Thinkphp5 + ...
- 第12节-BLE协议HCI层的数据格式
学习资料: 1. 蓝牙协议core_v5.0.pdf <Vol 2: Core System Package [BR/EDR Controller volume]>的“Part E: Ho ...
- openpose开发(1)官方1.5版本源码编译
环境 WIN10系统,联想Y7000配置,8G内存 VS2019 cuda10 cudnn10 opencv4.11没有扩展库 显卡 1050TI 用到的库(提前下载好的模型,依赖库,user_cod ...
- opencv4.0.0+cmake编译(含contrib)
https://blog.csdn.net/bobo184/article/details/88749651 前言笔者环境:win10+vs2015+cmake3.8.2 介绍下4.0.0的新特性,沿 ...
- MapReduce running in uber mode (jvm重用)
原文 http://blog.csdn.net/samhacker/article/details/15692003 yarn-site.xml 主要是这几个参数 - mapreduce.job.u ...
- bootstrap基础自我总结
*今天自学了一些封装的css,看起来官网很强大,但是因为源码备注都是英文的情况下,还是感觉想深入有点力不从心,发现度娘没有中文手册,无奈,不过还好代码无国界,基本都是能看懂的,备注也影响不大(安慰自己 ...
- monkey--常用参数
前戏 参数分类:常规类参数,事件类参数,约束类参数,调试类参数 常规类参数:常规类参数包括帮助参数和日志信息参数,帮助参数用于输出monkey命令使用指导,日志信息参数将日志分为三个等级,级别越高,日 ...
- CSS居中方案
1.行内元素或者内联元素 1.垂直居中 设置行高和高度一致,如果没必要设置高度的话,可以直接利用line-height垂直性,直接设置需要的高度为line-height的高度亦可居中 .center- ...
- ZROI 暑期高端峰会 A班 Day5 计算几何
内积(点积) 很普及组,不讲了. \[(a,b)^2\le(a,a)(b,b)\] 外积(叉积) 也很普及组,不讲了. 旋转 对于矩阵 \(\begin{bmatrix}\cos\theta\\\si ...