摘要:固有對象由標準規定,隨著運行時創建而自動創建的對象實例。普通對象由語法構造器或者關鍵字定義類創建的對象,它能夠被原型繼承。
筆記說明
重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以加入winter的專欄學習【原文有winter的語音】,如有侵權請聯系我,郵箱:kaimo313@foxmail.com。一、javaScript對象分類介紹 1.0、宿主對象(host Objects)
由 JavaScript 宿主環境提供的對象,它們的行為完全由宿主環境決定。1.1、內置對象(Built-in Objects)
由 JavaScript 語言提供的對象。1.1.0、固有對象(Intrinsic Objects )
由標準規定,隨著 JavaScript 運行時創建而自動創建的對象實例。1.1.1、原生對象(Native Objects)
可以由用戶通過 Array、RegExp 等內置構造器或者特殊語法創建的對象。1.1.2、普通對象(Ordinary Objects)
由 {} 語法、Object 構造器或者 class 關鍵字定義類創建的對象,它能夠被原型繼承。
下面winter主要介紹了普通對象之外的對象原型(剛好都是我不太懂的,mark一下)
二、宿主對象 2.0、window對象全局對象 window 上的屬性,一部分來自 JavaScript 語言,一部分來自瀏覽器環境
宿主也會提供一些構造器,比如使用 new Image來創建 img 元素(winter下次會講瀏覽器的API,到時再詳細的mark一下)
三、內置對象·固有對象 3.0、簡單介紹固有對象在任何 JS 代碼執行前就已經被創建出來,類似基礎庫的角色
ECMA 標準為我們提供了一份固有對象表,里面含有 150+ 個固有對象(鏈接打開比較慢,稍等一下就好)
3.1、小實驗:獲取全部 JavaScript 固有對象 3.1.0、三個值Infinity、NaN、undefined3.1.1、九個函數
eval、isFinite、isNaN、parseFloat、parseInt、decodeURI decodeURIComponent、encodeURI、encodeURIComponent3.1.2、一些構造器
Array、Date、RegExp、Promise、Proxy、Map、WeakMap、Set、WeapSet、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、UInt8ClampedArray3.1.3、四個用于當作命名空間的對象
Atomics、JSON、Math、Reflect3.1.4、處理方法
1、winter的做法:使用廣度優先搜索,查找這些對象所有的屬性和 Getter/Setter,就可以獲得 JavaScript 中所有的固有對象。
2、下面代碼可以研究一下看看,new Set()不懂的可以看看MDN關于set的介紹,(我現在還沒有看明白,我去不同網頁打開運行輸出set不一樣,感覺有點懵逼_(:3」∠)_,理解的大佬可以留言告訴我,不勝感激)
var set = new Set(); var 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); } }四、內置對象·原生對象 4.0、分類
winter按照不同應用場景,將原生對象分成了以下幾個種類4.1、注意的幾個點
可以用 new 運算創建新的對象
幾乎所有這些構造器的能力都是無法用純 JavaScript 代碼實現
也無法用 class/extend 語法來繼承
創建的對象多數使用了私有字段,比如:Error: [[ErrorData]]...這些字段使得原型繼承方法無法正常工作
所有這些原生對象都是為了特定能力或者性能,而設計出來的特權對象
五、用對象來模擬函數與構造器:函數對象與構造器對象 5.0、函數對象的定義具有 [[call]] 私有字段的對象
[[call]] 私有字段必須是一個引擎中定義的函數,需要接受 this 值和調用參數,并且會產生域的切換
5.1、構造器對象的定義具有 [[construct]] 私有字段的對象5.1.0、[[construct]] 的大致執行過程
1、以 Object.protoype 為原型創建一個新對象
2、以新對象為 this,執行函數的 [[call]]
3、如果 [[call]] 的返回值是對象,那么,否則返回第一步創建的新對象
1、內置對象 Date 在作為構造器調用時產生新的對象,作為函數時,則產生字符串,見以下代碼:
console.log(new Date); console.log(Date())
2、瀏覽器宿主環境中,提供的 Image 構造器,則根本不允許被作為函數調用。
console.log(new Image); console.log(Image()); // 拋出錯誤 Uncaught TypeError: Failed to construct "Image": Please use the "new" operator, this DOM object constructor cannot be called as a function."Image"
3、基本類型(String、Number、Boolean),它們的構造器被當作函數調用,則產生類型轉換的效果
4、在 ES6 之后 => 語法創建的函數僅僅是函數,它們無法被當作構造器使用,見以下代碼:
new (a => 0) // 報錯:Uncaught TypeError: (intermediate value) is not a constructor
5、使用 function 語法或者 Function 構造器創建的對象來說,[[call]] 和 [[construct]] 行為總是相似的,它們執行同一段代碼。
function f(){ return 1; } var v = f(); // 把 f 作為函數調用 var o = new f(); // 把 f 作為構造器調用
6、如果構造器返回了一個新的對象,那么 new 創建的新對象就變成了一個構造函數之外完全無法訪問的對象,這一定程度上可以實現私有
function cls(){ this.a = 100; return { getValue: () => this.a } } var o = new cls; o.getValue(); //100 //a 在外面永遠無法訪問到六、特殊行為的對象 6.0、行為不大一樣的對象
winter總結了常見的下標運算(就是使用中括號或者點來做屬性訪問)或者設置原型跟普通對象不同的對象,如下:
Array:Array 的 length 屬性根據最大的下標自動發生變化。
Object.prototype:作為所有正常對象的默認原型,不能再給它設置原型了。
String:為了支持下標運算,String 的正整數屬性訪問會去字符串里查找。
Arguments:arguments 的非負整數型下標屬性跟對應的變量聯動。
模塊的 namespace 對象:特殊的地方非常多,跟一般對象完全不一樣,盡量只用于 import
類型數組和數組緩沖區:跟內存塊相關聯,下標運算比較特殊
bind 后的 function:跟原來的函數相關聯
個人總結看完這篇,有點崩潰,現在已經凌晨2點48了,還沒搞懂,感覺之前學的過于皮毛,這些東西看起來一臉懵逼,哈哈哈...,有時間在好好加強一下這塊的知識
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/114583.html
摘要:固有對象由標準規定,隨著運行時創建而自動創建的對象實例。普通對象由語法構造器或者關鍵字定義類創建的對象,它能夠被原型繼承。 筆記說明 重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以加入winter的專欄學習【原文有winter的語音】,如有侵權請聯系我,郵箱:ka...
摘要:固有對象由標準規定,隨著運行時創建而自動創建的對象實例。普通對象由語法構造器或者關鍵字定義類創建的對象,它能夠被原型繼承。 筆記說明 重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以加入winter的專欄學習【原文有winter的語音】,如有侵權請聯系我,郵箱:ka...
摘要:模板語法四種詞法定義二空白符號空白符號分類或稱是,是縮進符,字符串中寫的。注意換行符會影響的兩個重要語法特性自動插入分號和規則。 筆記說明 重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以加入winter的專欄學習【原文有winter的語音】,如有侵權請聯系我,郵箱...
閱讀 1837·2023-04-25 14:49
閱讀 3117·2021-09-30 09:47
閱讀 3099·2021-09-06 15:00
閱讀 2224·2019-08-30 13:16
閱讀 1436·2019-08-30 10:48
閱讀 2668·2019-08-29 15:11
閱讀 1287·2019-08-26 14:06
閱讀 1663·2019-08-26 13:30