日韩无码专区无码一级三级片|91人人爱网站中日韩无码电影|厨房大战丰满熟妇|AV高清无码在线免费观看|另类AV日韩少妇熟女|中文日本大黄一级黄色片|色情在线视频免费|亚洲成人特黄a片|黄片wwwav色图欧美|欧亚乱色一区二区三区

RELATEED CONSULTING
相關(guān)咨詢
選擇下列產(chǎn)品馬上在線溝通
服務(wù)時間:8:30-17:00
你可能遇到了下面的問題
關(guān)閉右側(cè)工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
聊聊JS中Object的Keys是無序的嗎?

「But,Object 的鍵值對真的是無序的嗎?」實際上在 ES2015 以后,Object.keys 的規(guī)則變了:

在一些現(xiàn)代的瀏覽器中,keys 輸出順序是可以預(yù)測的!

Key 都為自然數(shù):

注意這里的自然數(shù)是指正整數(shù)或 0,如果是其他類的 Number —— 浮點數(shù)或者負數(shù) —— 都會走到下一組類型里,像NaN或者Infinity這種也自然歸到下一個類型里,但是像科學(xué)記數(shù)法這個會稍微特殊一點,感興趣的同學(xué)可以自己試一下。

總結(jié)來說,就是當(dāng)前的 key 如果是自然數(shù)就按照自然數(shù)的大小進行升序排序。

const objWithIndices = {
23: 23,
'1': 1,
1000: 1000
};

console.log(Reflect.ownKeys(objWithIndices)); // ["1", "23", "1000"]
console.log(Object.keys(objWithIndices)); // ["1", "23", "1000"]
console.log(Object.getOwnPropertyNames(objWithIndices)); // ["1", "23", "1000"]

包括在 for-in 循環(huán)的遍歷中,keys 也是按照這個順序執(zhí)行的。

Key 都為 String:

如果 key 是不為自然數(shù)的 String(Number 也會轉(zhuǎn)為 String)處理,則按照加入的時間順序進行排序。

const objWithStrings = {
"002": "002",
c: 'c',
b: "b",
"001": "001",
}

console.log(Reflect.ownKeys(objWithStrings)); // ["002", "c", "b", "001"]
console.log(Object.keys(objWithStrings));// ["002", "c", "b", "001"]
console.log(Object.getOwnPropertyNames(objWithStrings));// ["002", "c", "b", "001"]

Key 都為symbol

const objWithSymbols = {
[Symbol("first")]: "first",
[Symbol("second")]: "second",
[Symbol("last")]: "last",
}

console.log(Reflect.ownKeys(objWithSymbols));// [Symbol(first), Symbol(second), Symbol(last)]
console.log(Object.keys(objWithSymbols));// [Symbol(first), Symbol(second), Symbol(last)]
console.log(Object.getOwnPropertyNames(objWithSymbols));// [Symbol(first), Symbol(second), Symbol(last)]

如果 Key 都為 Symbol,順序和 String 一樣,也是按照添加的順序進行排序的。

如果是以上類型的相互結(jié)合

const objWithStrings = {
"002": "002",
[Symbol("first")]: "first",
c: "c",
b: "b",
"100": "100",
"001": "001",
[Symbol("second")]: "second",
}

console.log(Reflect.ownKeys(objWithStrings));
// ["100", "002", "c", "b", "001", Symbol(first), Symbol(second)]

結(jié)果是先按照自然數(shù)升序進行排序,然后按照非數(shù)字的 String 的加入時間排序,然后按照 Symbol 的時間順序進行排序,也就是說他們會先按照上述的分類進行拆分,先按照自然數(shù)、非自然數(shù)、Symbol 的順序進行排序,然后根據(jù)上述三種類型下內(nèi)部的順序進行排序。

Recap

  • 在 ES6 之前 Object 的鍵值對是無序的;
  • 在 ES6 之后 Object 的鍵值對按照自然數(shù)、非自然數(shù)和 Symbol 進行排序,自然數(shù)是按照大小升序進行排序,其他兩種都是按照插入的時間順序進行排序。

References:

「Property order is predictable in JavaScript objects since ES2015」: https://www.stefanjudis.com/today-i-learned/property-order-is-predictable-in-javascript-objects-since-es2015

「The traversal order of object properties in ES6」: http://2ality.com/2015/10/property-traversal-order-es6.html#traversing-the-own-keys-of-an-object


當(dāng)前文章:聊聊JS中Object的Keys是無序的嗎?
網(wǎng)址分享:http://m.5511xx.com/article/cdjodhe.html