ถ้าฉันสร้างวัตถุเช่นนี้:

var obj = {};
obj.prop1 = "Foo";
obj.prop2 = "Bar";

วัตถุที่เป็นผลลัพธ์จะมีลักษณะเช่นนี้เสมอหรือไม่

{ prop1 : "Foo", prop2 : "Bar" }

นั่นคือคุณสมบัติจะอยู่ในลำดับเดียวกันกับที่ฉันเพิ่มเข้าไปหรือไม่

การสั่งซื้อซ้ำสำหรับวัตถุดังต่อไปนี้บางชุดของกฎตั้งแต่ ES2015 แต่มันไม่ได้ (เสมอ) ปฏิบัติตามคำสั่งแทรก พูดง่ายๆคือคำสั่งวนซ้ำเป็นการรวมกันของคำสั่งแทรกสำหรับคีย์สตริงและลำดับจากน้อยไปหามากสำหรับคีย์ตัวเลข

// key order: 1, foo, bar
const obj = { "foo": "foo", "1": "1", "bar": "bar" }

การใช้อาร์เรย์หรือMapวัตถุอาจเป็นวิธีที่ดีกว่าในการบรรลุเป้าหมาย Mapแบ่งปันความคล้ายคลึงกันบางอย่างกับObjectและรับประกันกุญแจที่จะวนซ้ำตามลำดับการแทรกโดยไม่มีข้อยกเว้น:

คีย์ในแผนที่จะถูกจัดเรียงในขณะที่ปุ่มที่เพิ่มให้กับวัตถุนั้นไม่ได้จัดทำ ดังนั้นเมื่อวนซ้ำวัตถุแผนที่จะส่งคืนคีย์ตามลำดับการแทรก (โปรดทราบว่าในวัตถุข้อมูลจำเพาะ ECMAScript 2015 จะรักษาลำดับการสร้างสำหรับคีย์สตริงและสัญลักษณ์ดังนั้นการข้ามผ่านวัตถุด้วยเช่นคีย์สตริงเท่านั้นจะให้คีย์ตามลำดับการแทรก)

ในฐานะโน้ตการสั่งซื้อคุณสมบัติในวัตถุไม่ได้รับประกันเลยก่อน ES2015 คำจำกัดความของวัตถุจากECMAScript Third Edition (pdf) :

4.3.3 วัตถุ

วัตถุเป็นสมาชิกของประเภทวัตถุ มันคือชุดของคุณสมบัติที่ไม่มีการเรียงลำดับซึ่งแต่ละค่าจะมีค่าดั้งเดิมวัตถุหรือฟังก์ชั่น ฟังก์ชั่นที่เก็บไว้ในคุณสมบัติของวัตถุเรียกว่าวิธีการ

ใช่ (สำหรับคีย์ที่ไม่ใช่จำนวนเต็ม)

เบราว์เซอร์ส่วนใหญ่ย้ำคุณสมบัติของวัตถุดังนี้:

1. ปุ่มจำนวนเต็มตามลำดับจากน้อยไปมาก (และสตริงเช่น "1" ที่แยกวิเคราะห์เป็น ints)
2. คีย์สตริงในลำดับการแทรก (ES2015 รับประกันว่าสิ่งนี้และเบราว์เซอร์ทั้งหมดเป็นไปตาม)
3. ชื่อสัญลักษณ์ตามลำดับการแทรก (ES2015 รับรองว่าสิ่งนี้และเบราว์เซอร์ทั้งหมดสอดคล้อง)

เบราว์เซอร์รุ่นเก่าบางรุ่นรวมหมวดหมู่ # 1 และ # 2 ไว้แล้วทำซ้ำคีย์ทั้งหมดตามลำดับการแทรก หากคีย์ของคุณอาจแยกเป็นจำนวนเต็มวิธีที่ดีที่สุดคืออย่าพึ่งพาลำดับการทำซ้ำใด ๆ โดยเฉพาะ

ลำดับภาษาปัจจุบัน (ตั้งแต่ ES2015)ลำดับการแทรกถูกเก็บรักษาไว้ยกเว้นในกรณีของคีย์ที่แยกเป็นจำนวนเต็ม (เช่น "7" หรือ "99") ซึ่งลักษณะการทำงานแตกต่างกันไประหว่างเบราว์เซอร์ ตัวอย่างเช่น Chrome / V8 ไม่เคารพลำดับการแทรกเมื่อคีย์แยกวิเคราะห์เป็นตัวเลข

ข้อมูลจำเพาะภาษาเก่า (ก่อน ES2015) : ลำดับการทำซ้ำไม่ได้กำหนดไว้ในทางเทคนิค แต่เบราว์เซอร์หลักทั้งหมดสอดคล้องกับพฤติกรรม ES2015

โปรดทราบว่าพฤติกรรม ES2015 เป็นตัวอย่างที่ดีของข้อมูลจำเพาะภาษาที่ได้รับแรงผลักดันจากพฤติกรรมที่มีอยู่และไม่ใช่วิธีอื่น ๆ หากต้องการความเข้าใจที่ลึกซึ้งยิ่งขึ้นเกี่ยวกับความคิดด้านความเข้ากันได้แบบย้อนหลังให้ดูที่http://code.google.com/p/v8/issues/detail?id=164ข้อบกพร่องของ Chrome ที่ครอบคลุมรายละเอียดการตัดสินใจการออกแบบที่อยู่เบื้องหลังพฤติกรรมการเรียงลำดับการทำซ้ำของ Chrome . ต่อหนึ่งในความคิดเห็น (มีความเห็นค่อนข้าง) ต่อรายงานข้อผิดพลาดนั้น:

มาตรฐานมักติดตามการใช้งานซึ่งเป็นที่มาของ XHR และ Google ทำสิ่งเดียวกันโดยการใช้ Gears และจากนั้นก็ใช้ฟังก์ชั่น HTML5 ที่เทียบเท่ากัน การแก้ไขที่ถูกต้องคือการให้ ECMA อย่างเป็นทางการรวมพฤติกรรมมาตรฐาน de-พฤตินัยลงในการหมุนรอบต่อไปของข้อมูลจำเพาะ

ลำดับคุณสมบัติใน Objects ปกติเป็นเรื่องที่ซับซ้อนใน Javascript

ในขณะที่ ES5 ไม่มีการระบุคำสั่งอย่างชัดเจน ES2015 มีคำสั่งในบางกรณี รับเป็นวัตถุต่อไปนี้:

o = Object.create(null, {
  m: {value: function() {}, enumerable: true},
  "2": {value: "2", enumerable: true},
  "b": {value: "b", enumerable: true},
  0: {value: 0, enumerable: true},
  [Symbol()]: {value: "sym", enumerable: true},
  "1": {value: "1", enumerable: true},
  "a": {value: "a", enumerable: true},
});

ผลลัพธ์นี้ตามลำดับต่อไปนี้ (ในบางกรณี):

Object {
  0: 0,
  1: "1",
  2: "2",
  b: "b",
  a: "a",
  m: function() {},
  Symbol(): "sym"
}

1. คีย์ที่เหมือนจำนวนเต็มตามลำดับจากน้อยไปมาก
2. ปุ่มปกติในลำดับการแทรก
3. สัญลักษณ์ตามลำดับการแทรก

ดังนั้นจึงมีสามส่วนซึ่งอาจเปลี่ยนลำดับการแทรก (ดังที่เกิดขึ้นในตัวอย่าง) และปุ่มที่เหมือนจำนวนเต็มไม่ยึดตามคำสั่งแทรกเลย

คำถามคือสำหรับสิ่งที่วิธีการสั่งซื้อนี้รับประกันในสเป็ค ES2015?

วิธีการต่อไปนี้รับประกันลำดับที่แสดง:

• Object.assign
• Object.defineProperties
• Object.getOwnPropertyNames
• Object.getOwnPropertySymbols
• Reflect.ownKeys

วิธีการ / ลูปต่อไปนี้รับประกันไม่มีการสั่งซื้อเลย:

• Object.keys
• สำหรับใน
• JSON.parse
• JSON.stringify

สรุป: แม้ใน ES2015 คุณไม่ควรพึ่งพาลำดับคุณสมบัติของวัตถุปกติใน Javascript มันมีแนวโน้มที่จะเกิดข้อผิดพลาด ใช้Mapแทน

ในขณะที่เขียนเบราว์เซอร์ส่วนใหญ่จะส่งคืนคุณสมบัติในลำดับเดียวกับที่แทรก แต่มันไม่ได้รับประกันพฤติกรรมที่ชัดเจนดังนั้นจึงไม่ควรเชื่อถือ

ข้อกำหนด ECMAScriptใช้ในการพูดว่า:

กลไกและลำดับของการแจกแจงคุณสมบัติ ... ไม่ได้ระบุไว้

อย่างไรก็ตามใน ES2015 และคีย์ที่ไม่ใช่จำนวนเต็มในภายหลังจะถูกส่งกลับในลำดับการแทรก

คำตอบทั้งหมดนี้อยู่ในบริบทของการปฏิบัติตามข้อกำหนดไม่ใช่สิ่งที่เครื่องยนต์ทำในช่วงเวลาใดเวลาหนึ่งหรือในอดีต

โดยทั่วไปแล้วไม่มี

คำถามจริงคลุมเครือมาก

คุณสมบัติจะอยู่ในลำดับเดียวกันกับที่ฉันเพิ่มเข้าไปหรือไม่

ในบริบทใด

คำตอบคือ: มันขึ้นอยู่กับปัจจัยหลายประการ โดยทั่วไปไม่มี

บางครั้งใช่

ที่นี่คุณสามารถวางใจได้กับการสั่งซื้อคีย์ทรัพย์สินสำหรับสินค้าธรรมดาObjects:

• เครื่องยนต์ที่สอดคล้องกับ ES2015
• คุณสมบัติของตัวเอง
• Object.getOwnPropertyNames(), Reflect.ownKeys(),Object.getOwnPropertySymbols(O)

ในทุกกรณีวิธีการเหล่านี้รวมถึงคีย์คุณสมบัติที่ไม่สามารถนับได้และคีย์การสั่งซื้อตามที่ระบุโดย[[OwnPropertyKeys]](ดูด้านล่าง) พวกเขาแตกต่างกันในประเภทของค่าคีย์ที่พวกเขารวม ( Stringและ / หรือSymbol) ในบริบทนี้Stringรวมถึงค่าจำนวนเต็ม

Object.getOwnPropertyNames(O)

ส่งคืนคุณสมบัติที่เป็นคีย์OของตนเองString( ชื่อคุณสมบัติ )

Reflect.ownKeys(O)

ส่งคืนคุณสมบัติOของตัวเองStringและSymbolคีย์

Object.getOwnPropertySymbols(O)

ส่งคืนคุณสมบัติที่เป็นคีย์OของตนเองSymbol

[[OwnPropertyKeys]]

โดยพื้นฐานแล้วลำดับ: จำนวนเต็มเหมือนStringsในลำดับจากน้อยไปมากไม่ใช่จำนวนเต็มเหมือนStringsในลำดับการสร้างสัญลักษณ์ในลำดับการสร้าง ฟังก์ชันเหล่านี้บางประเภทอาจไม่รวมขึ้นอยู่กับฟังก์ชันที่เรียกใช้

ภาษาเฉพาะคือกุญแจจะถูกส่งกลับในลำดับต่อไปนี้:

2. ... แต่ละคีย์คุณสมบัติPของO[วัตถุที่ถูกทำซ้ำ] นั่นคือดัชนีจำนวนเต็มในลำดับดัชนีตัวเลขจากน้อยไปมาก

3. ... ที่สำคัญแต่ละคุณสมบัติของตัวเองPของOที่เป็นสตริง แต่ไม่ได้เป็นดัชนีจำนวนเต็มเพื่อสร้างสถานที่ให้บริการ

4. ... ที่สำคัญแต่ละคุณสมบัติของตัวเองPของOที่เป็นสัญลักษณ์ในการสั่งซื้อการสร้างสถานที่ให้บริการ

Map

หากคุณกำลังสนใจในการสั่งซื้อแผนที่ที่คุณควรพิจารณาใช้Mapชนิดที่รู้จักใน ES2015 Objectsแทนธรรมดา

ในเบราว์เซอร์สมัยใหม่คุณสามารถใช้Mapโครงสร้างข้อมูลแทนวัตถุ

Developer mozilla> แผนที่

วัตถุแผนที่สามารถวนองค์ประกอบในลำดับการแทรก ...

ใน ES2015 มันทำ แต่ไม่ใช่สิ่งที่คุณคิด

ลำดับของคีย์ในวัตถุไม่ได้รับการรับรองจนกระทั่ง ES2015 มันเป็นการนำไปปฏิบัติ

อย่างไรก็ตามใน ES2015 ในคือระบุ เช่นเดียวกับหลาย ๆ สิ่งใน JavaScript สิ่งนี้ทำขึ้นเพื่อจุดประสงค์ในการใช้งานร่วมกันได้และโดยทั่วไปแล้วจะสะท้อนมาตรฐานที่ไม่เป็นทางการที่มีอยู่แล้วในเอ็นจิ้น JS ส่วนใหญ่ (โดยที่คุณรู้จัก

คำสั่งถูกกำหนดไว้ในข้อมูลจำเพาะภายใต้การดำเนินการเชิงนามธรรมOrdinaryOwnPropertyKeysซึ่งสนับสนุนวิธีการทั้งหมดในการวนซ้ำผ่านคีย์ของวัตถุ ถอดความคำสั่งดังต่อไปนี้:

1. ทั้งหมดดัชนีจำนวนเต็มคีย์ (สิ่งที่ชอบ"1123", "55"ฯลฯ ) ในเรียงลำดับตัวเลข

2. คีย์สตริงทั้งหมดที่ไม่ใช่ดัชนีจำนวนเต็มตามลำดับการสร้าง (เก่าที่สุดก่อน)

3. ปุ่มสัญลักษณ์ทั้งหมดตามลำดับการสร้าง (เก่าไปก่อน)

เป็นเรื่องโง่ที่จะบอกว่าคำสั่งซื้อนั้นไม่น่าเชื่อถือ - มีความน่าเชื่อถือมันอาจจะไม่ใช่สิ่งที่คุณต้องการและเบราว์เซอร์สมัยใหม่จะใช้คำสั่งนี้อย่างถูกต้อง

ข้อยกเว้นบางอย่างมีวิธีการระบุคีย์ที่สืบทอดมาเช่นfor .. inลูป for .. inห่วงไม่ได้รับประกันการสั่งซื้อตามสเปค

ตั้งแต่ ES2015 คำสั่งซื้ออสังหาริมทรัพย์ได้รับการรับรองสำหรับวิธีการบางอย่างที่ทำซ้ำมากกว่าคุณสมบัติ แต่คนอื่นไม่ได้ น่าเสียดายที่วิธีการที่ไม่รับประกันว่าจะมีการสั่งซื้อมักจะใช้บ่อยที่สุด:

• Object.keys, Object.values,Object.entries
• for..in ลูป
• JSON.stringify

แต่ในขณะที่ ES2020 คำสั่งซื้ออสังหาริมทรัพย์สำหรับวิธีการที่ไม่น่าไว้วางใจเหล่านี้ก่อนหน้านี้จะได้รับการรับรองโดยข้อกำหนดที่จะทำซ้ำในลักษณะที่กำหนดเช่นเดียวกับที่อื่น ๆ เนื่องจากข้อเสนอที่เสร็จสมบูรณ์ : สำหรับกลไกในสำหรับในกลศาสตร์

เช่นเดียวกับวิธีการที่มีคำสั่งการยืนยันซ้ำ (เช่นReflect.ownKeysและObject.getOwnPropertyNames) วิธีการที่ไม่ได้ระบุไว้ก่อนหน้านี้จะทำซ้ำตามลำดับต่อไปนี้:

• ปุ่มอาร์เรย์แบบตัวเลขในลำดับตัวเลขจากน้อยไปมาก
• ปุ่มที่ไม่ใช่สัญลักษณ์อื่น ๆ ทั้งหมดตามลำดับการแทรก
• ปุ่มสัญลักษณ์ตามลำดับการแทรก

นี่คือสิ่งที่การดำเนินการทุกอย่างทำได้แล้ว (และทำมาหลายปีแล้ว) แต่ข้อเสนอใหม่ทำให้เป็นทางการ

แม้ว่าข้อมูลจำเพาะในปัจจุบันจะทิ้งให้.. ในลำดับการวนซ้ำ " เกือบทั้งหมดโดยไม่ระบุเครื่องยนต์จริงมักจะสอดคล้องกันมากขึ้น:"

การขาดความจำเพาะใน ECMA-262 ไม่ได้สะท้อนความเป็นจริง ในการอภิปรายย้อนหลังไปหลายปีผู้ดำเนินการสังเกตว่ามีข้อ จำกัด บางประการเกี่ยวกับพฤติกรรมของผู้ที่ต้องการรันโค้ดบนเว็บจำเป็นต้องปฏิบัติตาม

เนื่องจากการติดตั้งทุกครั้งจะทำซ้ำมากกว่าคุณสมบัติที่คาดการณ์จึงสามารถใส่ลงในข้อมูลจำเพาะโดยไม่ทำลายความเข้ากันได้ย้อนหลัง

มีบางกรณีแปลก ๆ ที่การใช้งานในปัจจุบันไม่เห็นด้วยและในกรณีดังกล่าวคำสั่งที่เป็นผลลัพธ์จะไม่ถูกระบุต่อไป สำหรับการสั่งซื้ออสังหาริมทรัพย์ที่จะรับประกัน :

ไม่ว่าวัตถุที่ถูกทำซ้ำหรืออะไรก็ตามในห่วงโซ่ต้นแบบของมันคือพร็อกซี, อาเรย์ที่พิมพ์, วัตถุเนมสเปซโมดูลหรือโฮสต์วัตถุแปลกใหม่

วัตถุหรือสิ่งใด ๆ ในห่วงโซ่ต้นแบบมีการเปลี่ยนแปลงต้นแบบระหว่างการทำซ้ำ

วัตถุหรือสิ่งใด ๆ ในห่วงโซ่ต้นแบบมีคุณสมบัติที่ถูกลบในระหว่างการทำซ้ำ

ไม่มีอะไรในห่วงโซ่ต้นแบบของวัตถุที่มีคุณสมบัติเพิ่มในระหว่างการทำซ้ำ

ไม่มีคุณสมบัติของวัตถุหรืออะไรในต้นแบบลูกโซ่ที่มีการเปลี่ยนแปลง enumerability ในระหว่างการทำซ้ำ

ไม่มีคุณสมบัติที่ไม่นับเงาหนึ่งอันนับไม่ได้

ตามที่คนอื่นได้ระบุไว้คุณไม่รับประกันว่าจะสั่งซื้อเมื่อคุณวนซ้ำคุณสมบัติของวัตถุ หากคุณต้องการรายการสั่งซื้อของหลายเขตข้อมูลผมแนะนำให้สร้างอาร์เรย์ของวัตถุ

var myarr = [{somfield1: 'x', somefield2: 'y'},
{somfield1: 'a', somefield2: 'b'},
{somfield1: 'i', somefield2: 'j'}];

วิธีนี้คุณสามารถใช้ลูปปกติสำหรับลูปและมีคำสั่งแทรก จากนั้นคุณสามารถใช้วิธีการจัดเรียง Array เพื่อจัดเรียงสิ่งนี้ลงในอาร์เรย์ใหม่หากจำเป็น

เพิ่งพบสิ่งนี้ออกมาอย่างยากลำบาก

ใช้ React with Redux ซึ่งเป็นตู้คอนเทนเนอร์ของคีย์ที่ฉันต้องการสำรวจเพื่อสร้างลูก ๆ จะรีเฟรชทุกครั้งที่มีการเปลี่ยนแปลงร้านค้า (ตามแนวคิดของการเปลี่ยนไม่ได้ของ Redux)

ดังนั้นเพื่อที่จะใช้Object.keys(valueFromStore)ฉันObject.keys(valueFromStore).sort()จึงอย่างน้อยตอนนี้ฉันมีลำดับตัวอักษรสำหรับกุญแจ

จากมาตรฐาน JSON :

วัตถุคือชุดสะสมที่ไม่มีการเรียงลำดับของคู่ชื่อ / ค่าศูนย์หรือมากกว่าโดยที่ชื่อคือสตริงและค่าคือสตริง, หมายเลข, บูลีน, null, วัตถุหรืออาร์เรย์

(เน้นที่เหมือง)

ดังนั้นไม่คุณไม่สามารถรับประกันการสั่งซื้อ