筆記-你不知道的JS-對象

senntyou 發布于2019-08-23 17:56 / 1455人閱讀

摘要：內置對象，在中，它們實際上只是一些內置函數。這些內置函數可以當作構造函數，使用調用，產生新對象。在必要時語言會自動把字符串字面量轉換成一個對象，也就是說你并不需要顯式創建一個對象。屬性操作符要求屬性名滿足標識符的命名規范。

1 如何定義

// 聲明形式，大部分情況下使用聲明形式
let obj ={
  a:2,
  b:3
};
// 構造形式
let obj= = new Object();
obj.a=2;
obj.b=3;

2 類型

7種類型：string、boolean、number、null 、 undefined、object、symbol

typeof null === object，原理是這樣的，不同的對象在底層都表示為二進制，在 JavaScript 中二進制前三位都為 0 的話會被判斷為 object 類型，null 的二進制表示是全 0，自然前三位也是 0，所以執行 typeof 時會返回“object”。

內置對象：String, Number, Object, Date, Boolean, Array, Function, RegExp, Error，在 JavaScript 中，它們實際上只是一些內置函數。這些內置函數可以當作構造函數，使用 new 調用，產生新對象。

在必要時語言會自動把字符串字面量轉換成一個 String 對象，也就是說你并不需要顯式創建一個對象。

var strPrimitive = "I am a string"; 
console.log( strPrimitive.length ); // 13 
console.log( strPrimitive.charAt( 3 ) ); // "m"

我們都可以直接在字符串字面量上訪問屬性或者方法，之所以可以這樣做，是因為引擎自動把字面量轉換成 String 對象，所以可以訪問屬性和方法。同樣引擎會自動把數字字面量轉換為Number對象，如使用3.1415.toFixed(2)

null 和 undefined 沒有對應的構造形式，它們只有文字形式。相反，Date 只有構造，沒有文字形式。
對于 Object、Array、Function 和 RegExp(正則表達式)來說，無論使用文字形式還是構造形式，它們都是對象，不是字面量。

Error 對象很少在代碼中顯式創建，一般是在拋出異常時被自動創建。也可以使用 newError(..) 這種構造形式來創建。

3 屬性

. 操作符要求屬性名滿足標識符的命名規范。

在對象中，屬性名永遠都是字符串。如果你使用 string(字面量)以外的其他值作為屬性名，那它首先會被轉換為一個字符串。

var myObject = { };
let arr = [2,3];
myObject[true] = "foo"; 
myObject[3] = "bar"; 
myObject[myObject] = "baz";
myObject[arr] =4;
myObject["true"]; // "foo"
myObject["3"]; // "bar"
myObject["[object Object]"]; // “baz”
myObject["2,3"]; // 4

為數組添加命名屬性，但數組的length值不會變

4 復制

對于 JSON 安全(也就是說可以被序列化為一個 JSON 字符串并且可以根據這個字符串解析出一個結構和值完全一樣的對象)的對象來說，有一種巧妙的復制方法:

var newObj = JSON.parse( JSON.stringify( someObj ) );
Object.assign(..) 方法的第一個參數是目標對象，之后還可以跟一個或多個源對象。它會遍歷一個或多個源對象的所有可枚舉(enumerable，參見下面的代碼)的自有鍵(owned key，很快會介紹)并把它們復制(使用 = 操作符賦值)到目標對象，最后返回目標對象。

5 屬性描述符

var myObject = { a:2};
Object.getOwnPropertyDescriptor( myObject, "a" );
// {
// value: 2,
// writable: true,
// enumerable: true,
// configurable: true 
// }
// writable(可寫)、 enumerable(可枚舉)和 configurable(可配置)

不管是不是處于嚴格模式，嘗試修改一個不可配置的屬性描述符都會出錯，也不可以刪除該屬性。注意:如你所見，把 configurable 修改成false 是單向操作，無法撤銷!要注意有一個小小的例外:即便屬性是 configurable:false，我們還是可以把 writable 的狀態由 true 改為 false，但是無法由 false 改為 true。

enumerable描述符控制的是屬性是否會出現在對象的屬性枚舉中，比如說for..in 循環。如果把 enumerable 設置成 false，這個屬性就不會出現在枚舉中，雖然仍然可以正常訪問它。

6 不變性

1 結合 writable:false 和 configurable:false 就可以創建一個真正的常量屬性

2 如果你想禁止一個對象添加新屬性并且保留已有屬性，可以使用 Object.preventExtensions(..)

3 Object.seal(..) 會創建一個“密封”的對象，這個方法實際上會在一個現有對象上調用Object.preventExtensions(..) 并把所有現有屬性標記為 configurable:false。所以，密封之后不僅不能添加新屬性，也不能重新配置或者刪除任何現有屬性(雖然可以修改屬性的值)。

4 Object.freeze(..) 會創建一個凍結對象，這個方法實際上會在一個現有對象上調用Object.seal(..) 并把所有“數據訪問”屬性標記為 writable:false，這樣就無法修改它們的值。你可以“深度凍結”一個對象，具體方法為，首先在這個對象上調用 Object.freeze(..)，然后遍歷它引用的所有對象并在這些對象上調用 Object.freeze(..)。但是一定要小心，因為這樣做有可能會在無意中凍結其他(共享)對象。

7 [[Get]]和[[Put]]

在語言規范中，myObject.a 在 myObject 上實際上是實現了 [[Get]] 操作(有點像函數調用:[[Get]]())。對象默認的內置 [[Get]] 操作首先在對象中查找是否有名稱相同的屬性，如果找到就會返回這個屬性的值。如果沒有找到名稱相同的屬性，會遍歷可能存在的 [[Prototype]] 鏈，也就是原型鏈。若在原型鏈上也沒有找到，那就返回undefined。

[[Put]] 被觸發時，如果已經存在這個屬性，[[Put]] 算法大致會檢查下面這些內容。

屬性是否是訪問描述符(參見3.3.9節)?如果是并且存在setter就調用setter。

屬性的數據描述符中writable是否是false?如果是，在非嚴格模式下靜默失敗，在嚴格模式下拋出 TypeError 異常。

如果都不是，將該值設置為屬性的值。

如果對象中不存在這個屬性，[[Put]] 操作會更加復雜。

8 存在性

in 操作符會檢查屬性是否在對象及其 [[Prototype]] 原型鏈中。

hasOwnProperty(..) 只會檢查屬性是否在 myObject 對象中，不會檢查 [[Prototype]] 鏈。

所有的普通對象都可以通過對于 Object.prototype 的委托來訪問hasOwnProperty(..)，但是有的對象可能沒有連接到 Object.prototype( 通過Object.create(null) 來創建)。在這種情況下，形如 myObejct.hasOwnProperty(..)就會失敗。這時可以使用Object.prototype.hasOwnProperty.
call(myObject,"a")。

9 遍歷

for..in 循環可以用來遍歷對象的可枚舉屬性列表(包括 [[Prototype]] 鏈)。

對于數值索引的數組來說，可以使用標準的 for 循環來遍歷值，或者使用for...of循環，for..of 循環首先會向被訪問對象請求一個迭代器對象，然后通過調用迭代器對象的next() 方法來遍歷所有返回值。

云服務器 GPU云服務器你不知道的你不知道的javascript 你不知道的javascript上卷你不知道

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/104375.html

筆記-你不知道的JS-原型

摘要：如果存在于原型鏈上層，賦值語句的行為就會有些不同。中包含的屬性會屏蔽原型鏈上層的所有屬性，因為總是會選擇原型鏈中最底層的屬性。如果不直接存在于中而是存在于原型鏈上層時會出現的三種情況。類構造函數原型函數，兩個函數通過屬性和屬性相關聯。 1 [[Prototype]] 對于默認的 [[Get]] 操作來說，如果無法在對象本身找到需要的屬性，就會繼續訪問對象的 [[Prototype]] ...

vincent_xyb 2019-08-26 13:59 評論0 收藏0
筆記-你不知道的JS-原型

摘要：如果存在于原型鏈上層，賦值語句的行為就會有些不同。中包含的屬性會屏蔽原型鏈上層的所有屬性，因為總是會選擇原型鏈中最底層的屬性。如果不直接存在于中而是存在于原型鏈上層時會出現的三種情況。類構造函數原型函數，兩個函數通過屬性和屬性相關聯。 1 [[Prototype]] 對于默認的 [[Get]] 操作來說，如果無法在對象本身找到需要的屬性，就會繼續訪問對象的 [[Prototype]] ...

AndroidTraveler 2019-08-23 17:56 評論0 收藏0
《你不知道的JS》讀書筆記---作用域及閉包

摘要：注此讀書筆記只記錄本人原先不太理解的內容經過閱讀你不知道的后的理解。作用域及閉包基礎，代碼運行的幕后工作者引擎及編譯器。注：此讀書筆記只記錄本人原先不太理解的內容經過閱讀《你不知道的JS》后的理解。作用域及閉包基礎，JS代碼運行的幕后工作者：引擎及編譯器。引擎負責JS程序的編譯及執行，編譯器負責詞法分析和代碼生成。那么作用域就像一個容器，引擎及編譯器都從這里提取東西。 ...

denson 2019-08-21 18:22 評論0 收藏0
筆記-你不知道的JS-this

摘要：綁定使用來調用函數，或者說發生構造函數調用時，會自動執行下面的操作。 1 this的概念 this 在任何情況下都不指向函數的詞法作用域。作用域對象無法通過 JavaScript代碼訪問，它存在于 JavaScript 引擎內部。 this 是在運行時進行綁定的，并不是在編寫時綁定，它的上下文取決于函數調用時的各種條件。this 的綁定和函數聲明的位置沒有任何關系，只取決于函數的調用方...

leanote 2019-08-23 17:56 評論0 收藏0
《你不知道的javascript》筆記_對象&原型

摘要：上一篇你不知道的筆記寫在前面這是年第一篇博客，回顧去年年初列的學習清單，發現僅有部分完成了。當然，這并不影響年是向上的一年在新的城市穩定連續堅持健身三個月早睡早起游戲時間大大縮減，學會生活。上一篇：《你不知道的javascript》筆記_this 寫在前面這是2019年第一篇博客，回顧去年年初列的學習清單，發現僅有部分完成了。當然，這并不影響2018年是向上的一年：在新的城市穩定、...

seasonley 2019-08-23 14:32 評論0 收藏0