《重学前端》学习笔记Day102

70 阅读3分钟

JavaScript 对象分类

宿主对象
内置对象
固有对象
原生对象
普通对象

宿主对象

JavaScript最熟悉的宿主就是浏览器环境
在浏览器环境中,全剧对象window上的属性,一部分来自JavaScript语言,一部分来自浏览器环境。宿主对象分为固有和用户创建两种,比如document.createElement就可以创建一些DOM对象。
宿主也会提供一些构造器,比如new Image

内置对象-固有对象

固有对象由标准固定,随着JavaScript运行时创建而自动创建的对象实例。
ECMA标准为我们提供了一份固有对象表,里面含有150+个固有对象,可以通过这个链接查看,遗憾的是,这个表格并不完整
获取全部JavaScript固有对象
三个值:
Infinity、NaN、undefined。
九个函数:
eval
isFinite
isNaN
parseFloat
parseInt
decodeURI
decodeURIComponent
encodeURI
encodeURIComponent
一些构造器:
Array、Date、RegExp、Promise、Proxy、Map、WeakMap、Set、WeakSet、
Function、Boolean、String、Number、Symbol、Object、Error、EvalError、
RangeError、ReferenceError、SyntaxError、TypeError、URIError、ArrayBuffer、
SharedArrayBuffer、DataView、Typed Array、Float32Array、Float64Array、
Int8Array、Int16Array、Int32Array、UInt8Array、UInt16Array、UInt32Array、
UInt8ClampedArray。
四个用于当作命名空间的对象:
Atomics
JSON
Math
Reflect
我们使用广度优先搜索,查找这些对象所有的属性和Getter/Setter,就可以获得JavaScript中所有的固有对象。

let set = new Set();
const objects = [
  eval,
    isFinite,
      isNaN,
        parseFloat,
          parseInt,
            decodeURI,
              decodeURIComponent,
                encodeURI,
                  encodeURIComponent,
                    Array,
                      Date,
                        RegExp,
                          Promise,
                            Proxy,
                              Map,
                                WeakMap,
                                  Set,
                                    WeakSet,
                                      Function,
                                        Boolean,
                                          String,
                                            Number,
                                              Symbol,
                                                Object,
                                                  Error,
                                                    EvalError,
                                                      RangeError,
                                                        ReferenceError,
                                                          SyntaxError,
                                                            TypeError,
                                                              URIError,
                                                                ArrayBuffer,
                                                                  SharedArrayBuffer,
                                                                    DataView,
                                                                      Float32Array,
                                                                        Float64Array,
                                                                          Int8Array,
                                                                            Int16Array,
                                                                              Int32Array,
                                                                                Uint8Array,
                                                                                  Uint16Array,
                                                                                    Uint32Array,
                                                                                      Uint8ClampedArray,
                                                                                        Atomics,
                                                                                          JSON,
                                                                                            Math,
                                                                                              Reflect];
                                                                                              objects.forEach(o => set.add(o));

                                                                                          for(var i = 0; i < objects.length; i++) {
                                                                                            var o = objects[i]
                                                                                              for(var p of Object.getOwnPropertyNames(o)) {
                                                                                                  var d = Object.getOwnPropertyDescriptor(o, p)
                                                                                                      if( (d.value !== null && typeof d.value === "object") || (typeof d.value === "function"))
                                                                                                            if(!set.has(d.value))
                                                                                                                      set.add(d.value), objects.push(d.value);
                                                                                                                          if( d.get )
                                                                                                                                if(!set.has(d.get))
                                                                                                                                          set.add(d.get), objects.push(d.get);
                                                                                                                                              if( d.set )
                                                                                                                                                    if(!set.has(d.set))
                                                                                                                                                              set.add(d.set), objects.push(d.set);
                                                                                                                                                                }
                                                                                                                                                                }
                                                                                                                                                                </code></pre><h4>内置对象-原生对象</h4><p>在JavaScript中,能够通过语言本身的构造器创建的对象称作原生对象。在JavaScript标准中,提供了30多个构造器。按照不同应用场景,把原生对象分成了以下几种分类:<br></p><h4>函数对象与构造器对象</h4><p>函数对象的定义是:具有[[call]]私有字段的对象,构造器对象的定义是:具有私有字段[[construct]]的对象。<br>Javascript可以用对象模拟函数的设计代替了一般编程语言的中的函数,它们可以像其他语言的函数一样被调用、传参。<br>只要字段符合,我们在上下文提到的宿主对象和内置对象(如Symbol函数)可以模拟函数和构造器。<br>使用function关键字创建的函数必定同时是函数和构造器。不过,他们的表现出来的行为效果并不相同。<br>比如内置对象Date在作为构造器调用时产生新对象,在作为函数时产生字符串。<br>比如Image构造器,则不允许作为函数调用。<br>再比如基本类型,它们的构造器当作函数调用,则产生类型转换的效果。<br>在ES6之后 =&gt; 语法创建的函数仅仅是函数,它们无法被当作构造器使用。</p><h4>特殊行为的对象</h4><ul><li>Array:Array的length属性根据最大的下标自动发生变化。</li><li>Object.prototype:作为所有正常对象的默认原型,不能再给它设置原型了。</li><li>String:为了支持下标运算,String的正整数属性访问会去字符串里查找。</li><li>Arguments:arguments的非负整数型下标属性跟对应的变量联动。</li><li>模块的namespace对象:特殊的地方非常多,跟一般对象完全不一样,尽量只用于import吧</li><li>类型数组和数组缓冲区:跟内存块相关联,下标运算比较特殊。</li><li>bind后的function:跟原来的函数相关联。</li></ul><blockquote>此文章为7月Day5学习笔记,内容来源于极客时间《重学前端》,日拱一卒,每天进步一点点💪💪</blockquote>