重学前端
程劭非(winter)
前手机淘宝前端负责人
105347 人已学习
新⼈⾸单¥59
登录后,你可以任选4讲全文学习
课程目录
已完结/共 57 讲
开篇词+学习路线+架构图 (3讲)
重学前端
15
15
1.0x
00:00/00:00
登录|注册

JavaScript对象:你知道全部的对象分类吗?

bind后的function
类型数组和数组缓冲区
模块的namespace对象
Arguments
String
Object.prototype
Array
模拟函数和构造器
构造器对象
函数对象
特权对象
构造器能力
原生对象种类
固有对象数量
ECMA标准固有对象表
宿主对象构造器
全局对象属性
浏览器环境中的宿主对象
小实验
挑战任务
特殊行为的对象
函数对象与构造器对象
内置对象·原生对象
内置对象·固有对象
宿主对象
结语
对象分类
基础知识
JavaScript对象
JavaScript对象分类

该思维导图由 AI 生成,仅供参考

你好,我是 winter。
在前面的课程中,我已经讲解了 JavaScript 对象的一些基础知识。但是,我们所讲解的对象,只是特定的一部分,并不能涵盖全部的 JavaScript 对象。
比如说,我们不论怎样编写代码,都没法绕开 Array,实现一个跟原生的数组行为一模一样的对象,这是由于原生数组的底层实现了一个自动随着下标变化的 length 属性。
并且,在浏览器环境中,我们也无法单纯依靠 JavaScript 代码实现 div 对象,只能靠 document.createElement 来创建。这也说明了 JavaScript 的对象机制并非简单的属性集合 + 原型。
我们日常工作中,接触到的主要 API,几乎都是由今天所讲解的这些对象提供的。理解这些对象的性质,我们才能真正理解我们使用的 API 的一些特性。

JavaScript 中的对象分类

我们可以把对象分成几类。
宿主对象(host Objects):由 JavaScript 宿主环境提供的对象,它们的行为完全由宿主环境决定。
内置对象(Built-in Objects):由 JavaScript 语言提供的对象。
固有对象(Intrinsic Objects ):由标准规定,随着 JavaScript 运行时创建而自动创建的对象实例。
原生对象(Native Objects):可以由用户通过 Array、RegExp 等内置构造器或者特殊语法创建的对象。
普通对象(Ordinary Objects):由{}语法、Object 构造器或者 class 关键字定义类创建的对象,它能够被原型继承。
确认放弃笔记?
放弃后所记笔记将不保留。
新功能上线,你的历史笔记已初始化为私密笔记,是否一键批量公开?
批量公开的笔记不会为你同步至部落
公开
同步至部落
取消
完成
0/2000
荧光笔
直线
曲线
笔记
复制
AI
  • 深入了解
  • 翻译
    • 英语
    • 中文简体
    • 中文繁体
    • 法语
    • 德语
    • 日语
    • 韩语
    • 俄语
    • 西班牙语
    • 阿拉伯语
  • 解释
  • 总结

JavaScript对象包括宿主对象、内置对象、固有对象、原生对象、普通对象等几类。宿主对象由JavaScript宿主环境提供,如浏览器环境中的全局对象window及其属性。内置对象分为固有对象和原生对象,固有对象是在JavaScript运行时自动创建的对象实例,而原生对象是通过JavaScript语言提供的构造器或特殊语法创建的对象。此外,文章还介绍了JavaScript中用对象模拟函数和构造器的机制,以及特殊行为的对象,如Array的自动变化的length属性、Object.prototype的默认原型等。通过这些对象,JavaScript提供了基础的能力。读者还被鼓励挑战任务,尝试不使用new运算符获取对象的方法。文章内容涵盖了JavaScript对象的多个方面,对于理解JavaScript对象的分类及特性具有指导意义。文章还提供了一个小实验,通过广度优先搜索,查找JavaScript中所有的固有对象及其属性和Getter/Setter,以帮助读者更好地理解JavaScript对象的全貌。

仅可试看部分内容,如需阅读全部内容,请付费购买文章所属专栏
《重学前端》
新⼈⾸单¥59
立即购买
登录 后留言

全部留言(85)

  • 最新
  • 精选
  • XXX
    关于原生构造器无法用 class/extend 语法来继承的观点,能否举例说明呢?我写个demo跑了一下,发现还是可以的呐

    作者回复: 能继承方法,但是没办法跟原生的一模一样

    2019-02-26
    2
    8
  • Jaykey
    打印出来了989个对象,有很多是没有用过的,区分清楚了内置对象的差距,也知道了平时使用的一些方法是“构造器”

    作者回复: 特别棒

    2019-06-13
    3
    3
  • 有铭
    这个“原型继承方法”不能正常工作,是什么意思?我放狗搜了一下,发现,Number对象仍然可以用prototype属性来添加方法和属性啊

    作者回复: function MyNumber(){ } MyNumber.prototype = new Number; 是指这个不能工作。

    2019-02-19
    2
    1
  • LaMer
    这些构造器创建的对象多数使用了私有字段, 例如:Error: [[ErrorData]]。 [[ErrorData]]指的是什么 不明白 可以说的清楚一些吗 望老师回答下

    作者回复: 不是什么重要内容,就是标准会用这个私有字段存一些东西,但是让你访问不到,你可以理解为对象的内部状态。

    2019-10-14
  • 卡洛斯(๑Ő௰Ő๑)
    winter 你好, 对于用户使用 function 语法或者 Function 构造器创建的对象来说,[[call]] 和 [[construct]] 行为总是相似的,它们执行同一段代码。 function f(){ return 1; } // 把 f 作为函数调用 var v = f(); // 1 // 把 f 作为构造器调用 var o = new f(); // {} 代码执行的结果是不同,函数调用返回的是 1,构造器调用返回的一个对象。 这里的行为是指什么呢,为什么又总是相似的呢。 相似是指 函数调用和构造器调用,都能被调用?还是指都调用的同一个代码?

    作者回复: 它们的行为是“执行同一段代码”

    2019-08-25
  • 丁丁丁丁丁大树。
    winter老师你好,我对08节的内容有一个疑问,老师有空的话请为学生解惑 文中你有一句话“构造器对象的定义是:具有私有字段 [[construct]]” 我的理解是带有constructor的对象就是构造器对象,所以我做了下面这个实验 var obj = {constructor:function(){return {say:function(){alert('hello')}}}} var ins = new obj() 但是会报错obj不是一个construct, 我想问老师是不是我理解错了?

    作者回复: 用双括号的属性是你没法用JS代码访问的私有属性,你得用C++代码调用JS引擎才能看到这些属性。

    2019-02-27
  • Miss
    在讲到函数对象和构造器对象时[[call]]和[[construct]] 指的是?

    作者回复: 这是两个私有方法。

    2019-02-15
  • 大雄
    proxy模拟array怎样?

    作者回复: 可以模拟,但是性能不行。

    2019-02-13
  • 当然了,用户用 function 关键字创建的函数必定同时是函数和构造器。不过,它们表现出来的行为效果却并不相同。 对于用户使用 function 语法或者 Function 构造器创建的对象来说,[[call]] 和 [[construct]] 行为总是相似的,它们执行同一段代码。 请问这里的意思是,call 和 construct 它们虽然执行同一段代码,但是行为效果是不同的?感觉读起来似乎有歧义……

    作者回复: 执行的是同一段代码,但是除了执行代码,[[construct]]还做了很多别的事情,紧接着这段就讲了啊。

    2019-02-13
    2
  • William
    // 1. 利用字面量 var a = [], b = {}, c = /abc/g // 2. 利用dom api var d = document.createElement('p') // 3. 利用JavaScript内置对象的api var e = Object.create(null) var f = Object.assign({k1:3, k2:8}, {k3: 9}) var g = JSON.parse('{}') // 4.利用装箱转换 var h = Object(undefined), i = Object(null), k = Object(1), l = Object('abc'), m = Object(true)
    2019-02-05
    3
    215
收起评论
显示
设置
留言
85
收藏
沉浸
阅读
分享
手机端
快捷键
回顶部