วิธีแปลงวัตถุเป็นอาร์เรย์ใน es6

ใน es6 คุณสามารถใช้เมธอด from() ของอ็อบเจ็กต์ Array เพื่อแปลงอ็อบเจ็กต์ให้เป็นอาเรย์ได้ วิธีนี้สามารถแปลงอ็อบเจ็กต์ที่มีลักษณะคล้ายอาเรย์หรืออ็อบเจ็กต์แบบข้ามผ่านได้เป็นอาเรย์จริง )".

สภาพแวดล้อมการทำงานของบทช่วยสอนนี้: ระบบ Windows 7, ECMAScript เวอร์ชัน 6, คอมพิวเตอร์ Dell G3

ใน es6 คุณสามารถใช้เมธอด from() ของอ็อบเจ็กต์ Array เพื่อแปลงอ็อบเจ็กต์ให้เป็นอาร์เรย์ได้

วิธีการ Array.from() จะแปลงวัตถุที่มีลักษณะคล้ายอาร์เรย์หรือวัตถุที่ผ่านได้ให้เป็นอาร์เรย์จริง

แล้ววัตถุที่มีลักษณะคล้ายอาเรย์คืออะไร? ข้อกำหนดพื้นฐานที่สุดสำหรับสิ่งที่เรียกว่าวัตถุที่มีลักษณะคล้ายอาร์เรย์คือวัตถุที่มีแอตทริบิวต์ความยาว

1. แปลงวัตถุที่มีลักษณะคล้ายอาร์เรย์ให้เป็นอาร์เรย์จริง:

ให้ arrayLike = {
    0: 'ทอม'  
    1: '65',
    2: 'ชาย'
    3: ['เจน','จอห์น','แมรี่'],
    'ความยาว': 4
-
ให้ arr = Array.from (arrayLike)
console.log(arr) // ['tom','65','M',['jane','john','Mary']]

แล้วถ้าแอตทริบิวต์ length ในโค้ดด้านบนถูกลบออกไปล่ะ? แบบฝึกหัดได้พิสูจน์แล้วว่าคำตอบจะเป็นอาร์เรย์ว่างที่มีความยาว 0

มาเปลี่ยนโค้ดอีกครั้งนั่นคือมีแอตทริบิวต์ length แต่ชื่อแอตทริบิวต์ของวัตถุไม่ใช่ประเภทตัวเลขอีกต่อไป แต่เป็นประเภทสตริงอื่น ๆ รหัสจะเป็นดังนี้:

ให้ arrayLike = {
    'ชื่อ': 'ทอม'  
    'อายุ': '65',
    'เพศ': 'ชาย'
    'เพื่อน': ['เจน','จอห์น','แมรี่'],
    ความยาว: 4
-
ให้ arr = Array.from (arrayLike)
console.log(arr) // [ undefinition, undefinition, undefinition, undefinition ]

จะพบว่าผลลัพธ์เป็นอาร์เรย์ที่มีความยาว 4 และองค์ประกอบทั้งหมดไม่ได้กำหนดไว้

จะเห็นได้ว่า การแปลงวัตถุที่มีลักษณะคล้ายอาร์เรย์เป็น a อาร์เรย์จริงคุณต้องมีเงื่อนไขต่อไปนี้

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

• ชื่อแอททริบิวต์ของอ็อบเจ็กต์อาเรย์ประเภทนี้ต้องเป็นตัวเลขหรือหมายเลขสตริง

ps: ชื่อแอททริบิวต์ของอ็อบเจ็กต์อาเรย์ประเภทนี้สามารถใส่เครื่องหมายคำพูดได้หรือไม่

2. แปลงข้อมูลของโครงสร้าง Set ให้เป็นอาเรย์จริง:

ให้ arr = [12,45,97,9797,564,134,45642]
ให้ set = set ใหม่ (arr)
console.log(Array.from(set)) // [ 12, 45, 97, 9797, 564, 134, 45642 ]

Array.from ยังสามารถยอมรับพารามิเตอร์ตัวที่สองซึ่งทำหน้าที่เหมือนกับวิธี map ของอาร์เรย์และถูกใช้ เพื่อแมป แต่ละองค์ประกอบจะถูกประมวลผล และวางค่าที่ประมวลผลลงในอาร์เรย์ที่ส่งคืน ดังนี้

ให้ arr = [12,45,97,9797,564,134,45642]
ให้ set = set ใหม่ (arr)
console.log(Array.from(set, item => item + 1)) // [ 13, 46, 98, 9798, 565, 135, 45643 ]

3. แปลงสตริงเป็นอาร์เรย์:

ให้ str = 'hello world !';
console.log(Array.from(str)) // ["h", "e", "l", "l", "o", " ", "w", "o", "r", " l", "d", "!"]

4. พารามิเตอร์ Array.from เป็นอาร์เรย์จริง:

console.log(Array.from([12,45,47,56,213,4654,154]))

เช่นนี้ , Array .from จะส่งคืนอาร์เรย์ใหม่ที่เหมือนกัน