news 2026/6/7 7:56:14

深入 JavaScript 原型系统:为什么 typeof Object 是 “function”,而 typeof {} 是 “object”?

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
深入 JavaScript 原型系统:为什么 typeof Object 是 “function”,而 typeof {} 是 “object”?

在学习 JavaScript 的过程中,你是否曾被以下现象困惑过?

typeof Object; // "function" typeof {}; // "object"

明明Object是“对象”的代表,为什么它自己却是个函数?
{}才是我们日常使用的“对象”,却被识别为"object"

更令人费解的是,ObjectFunction之间还存在一种看似“循环引用”的原型关系:

Object.__proto__ === Function.prototype; // true Function.__proto__ === Function.prototype; // true

本文将带你彻底理清这两个问题背后的机制,揭开 JavaScript 原型系统的神秘面纱。


一、先回答:为什么typeof Objecttypeof {}

✅ 核心原因:它们根本不是同一类东西!

表达式实际类型说明
Object内置构造函数(函数)可调用:Object()new Object()
{}普通对象字面量不可调用,是Object的实例

根据 ECMAScript 规范,typeof可调用对象(即具有[[Call]]内部方法的对象)返回"function",否则返回"object"

所以:

  • Object是一个函数typeof Object === "function"
  • {}是一个普通对象typeof {} === "object"

💡 类比理解:

  • Object是“造车的工厂”(函数)
  • {}是“工厂生产出来的一辆车”(对象)

二、深入:ObjectFunction的原型关系

要理解上述现象,必须搞懂 JavaScript 中最核心的两个内置对象:ObjectFunction

1. 基本事实

  • 所有函数(包括ObjectArrayDate)都是Function的实例。
  • 所有普通对象(包括{}[]Function.prototype)最终都继承自Object.prototype

因此:

Object instanceof Function; // true Function instanceof Function; // true ({}).__proto__ === Object.prototype; // true

2. 它们的__proto__指向哪里?

表达式说明
Object.__proto__Function.prototypeObject是函数,由Function构造
Function.__proto__Function.prototypeFunction自身也是函数
Function.prototype.__proto__Object.prototypeFunction.prototype是普通对象
Object.prototype.__proto__null原型链终点

3. 原型关系图(文字版)

Function ──.__proto__──→ Function.prototype ──.__proto__──→ Object.prototype ──.__proto__──→ null ↑ │ (instanceof) Object ──.__proto__───────────────────────────────────────┘

🔁 这看起来像“鸡生蛋、蛋生鸡”,但实际上是 JS 引擎在初始化时预定义好的闭环结构


三、验证代码(建议在控制台运行)

// 1. typeof 差异 console.log(typeof Object); // "function" console.log(typeof {}); // "object" // 2. instanceof 验证 console.log(Object instanceof Function); // true console.log(Function instanceof Function); // true // 3. __proto__ 关系 console.log(Object.__proto__ === Function.prototype); // true console.log(Function.__proto__ === Function.prototype); // true // 4. Function.prototype 是普通对象 console.log(typeof Function.prototype); // "object" console.log(Function.prototype.__proto__ === Object.prototype); // true // 5. Object.prototype 是原型链顶端 console.log(Object.prototype.__proto__ === null); // true

四、常见误区澄清

误区1:Object是最顶层对象,所以Object.__proto__应该是null

✅ 正解:Object函数,不是普通对象。所有函数的__proto__都指向Function.prototype

误区2:Function.prototype是一个函数

✅ 正解:typeof Function.prototype返回"object",它是一个内置的普通对象,仅用于被函数实例继承。

误区3:{}Object是等价的,所以 typeof 应该一样

✅ 正解:{}Object实例,就像new Array()Array的关系一样——构造函数 vs 实例


五、延伸:如何正确判断类型?

由于typeof对对象一律返回"object"(连null也是!),我们常使用:

Object.prototype.toString.call(value).slice(8, -1)

例如:

Object.prototype.toString.call([]) // "[object Array]" Object.prototype.toString.call(new Date()) // "[object Date]" Object.prototype.toString.call(/regex/) // "[object RegExp]" Object.prototype.toString.call(null) // "[object Null]" Object.prototype.toString.call(undefined) // "[object Undefined]" Object.prototype.toString.call(123) // "[object Number]" Object.prototype.toString.call("str") // "[object String]" Object.prototype.toString.call(true) // "[object Boolean]" Object.prototype.toString.call(Symbol()) // "[object Symbol]" Object.prototype.toString.call(() => {}) // "[object Function]" Object.prototype.toString.call({}) // "[object Object]"

这正是利用了Object.prototype.toString能返回内部[[Class]]标签的特性。


六、总结

问题答案
为什么typeof Object"function"因为Object是一个可调用的构造函数
为什么typeof {}"object"因为{}是一个普通对象实例
Object.__proto__指向哪?Function.prototype
Function.__proto__指向哪?Function.prototype
原型链终点是?Object.prototype.__proto__ === null

🌟记住

  • 函数也是对象,但可调用 →typeof返回"function"
  • Object是“模具”,{}是“产品”
  • 整个原型系统由ObjectFunction共同构建

参考资料

  • ECMAScript® 2024 Language Specification
  • MDN:typeof
版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/6/6 6:43:33

iOS核心开发手册【1.1】

1.3 解决方案:添加拖动手势识别器用手势识别器也可以实现与解决方案1-1相同的交互功能,而且还不用直接编写触摸处理程序[1]。拖动手势识别器可以侦测拖曳手势。只要iOS系统检测到拖动手势,它就会触发你所指定的回调方法。解决方案1-2的代码与…

作者头像 李华
网站建设 2026/6/4 21:26:32

开源模型也能商业变现:基于TensorRT的推理API开发指南

开源模型也能商业变现:基于TensorRT的推理API开发指南 在AI应用从实验室走向生产线的过程中,一个常见的困境是:我们手握开源社区中训练得近乎完美的模型——比如YOLOv5、ResNet或BERT——但一旦部署到线上服务,却发现延迟高、吞吐…

作者头像 李华
网站建设 2026/6/5 9:45:05

模拟信号电平转换电路:新手入门必看

模拟信号电平转换实战指南:从零开始搞懂接口设计你有没有遇到过这样的情况?手里的传感器输出是5V,但主控芯片的ADC只能接受3.3V——直接连上去,轻则读数不准,重则烧毁引脚。又或者,采集音频信号时发现波形被…

作者头像 李华
网站建设 2026/5/30 20:47:06

NVIDIA官方TensorRT镜像深度解析:GPU算力优化的秘密武器

NVIDIA官方TensorRT镜像深度解析:GPU算力优化的秘密武器 在AI模型从实验室走向真实世界的过程中,一个看似不起眼却极为关键的环节常常被低估——推理部署。训练完成的模型如果跑得不够快、资源消耗太大,再先进的算法也难以落地。尤其是在视频…

作者头像 李华
网站建设 2026/6/4 23:41:18

高并发场景下的救星:TensorRT优化的大模型推理Pipeline

高并发场景下的救星:TensorRT优化的大模型推理Pipeline 在电商大促的深夜,推荐系统突然迎来百万级用户同时点击;语音助手在会议室里被十几人轮番唤醒;自动驾驶车辆在复杂城市环境中每秒处理数百帧感知数据——这些真实世界的高并…

作者头像 李华