วิธีการใช้ Array JavaScript

พลังของ JavaScript ภายในวิธีของลิสต์

แปลงลิสต์เป็นตัวอักษร

วิธี JavaScript toString() แปลงลิสต์เป็นตัวอักษรที่มีค่าในลิสต์แยกด้วยเครื่องหมายประกาย

ตัวอย่าง

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString(); 

ผลลัพธ์

Banana,Orange,Apple,Mango

ทดลองด้วยตัวเอง

join() วิธีนี้ยังสามารถรวบรวมทุกองค์ของลิสต์เป็นตัวอักษร

เปาะบ้านเหมือน toString() แต่คุณยังสามารถกำหนดตัวแทนของการแยกอยู่

ตัวอย่าง

var fruits = ["Banana", "Orange","Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.join(" * "); 

ผลลัพธ์

Banana * Orange * Apple * Mango

ทดลองด้วยตัวเอง

Popping และ Pushing

ในการจัดการลิสต์ การลบองค์และเพิ่มองค์เป็นสิ่งที่ง่ายโดยมาก

Popping และ Pushing หมายถึง:

ดึงออกจากลิสต์ดึงออกโครงการ หรือเพิ่มเข้าสู่ลิสต์ใส่เข้าโครงการ。

Popping

pop() วิธีนี้จะลบองค์สุดท้ายของลิสต์

ตัวอย่าง

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop();              // ลบองค์สุดท้ายของ fruits คือ ("Mango")

ทดลองด้วยตัวเอง

pop() วิธีนี้จะคืนค่าขององค์ที่ถูก pop

ตัวอย่าง

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = fruits.pop();      // ค่าของ x คือ "Mango"

ทดลองด้วยตัวเอง

Pushing

push() วิธีนี้จะเพิ่มองค์ใหม่ลงในทางท้ายของลิสต์

ตัวอย่าง

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi");       // แยกองค์ใหม่เข้าสู่ fruits

ทดลองด้วยตัวเอง

push() วิธีนี้จะคืนค่าความยาวของลิสต์ใหม่

ตัวอย่าง

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = fruits.push("Kiwi");   // ค่าของ x คือ 5

ทดลองด้วยตัวเอง

ย้ายองค์

ย้ายองค์เท่ากับ pop แต่จะจัดการกับองค์แรกแทนที่องค์สุดท้าย

shift() วิธีนี้จะลบองค์ที่แรกและย้ายองค์ที่เหลือออกมายังตำแหน่งที่ต่ำกว่า

ตัวอย่าง

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift();            // ลบองค์ที่แรกของ fruits คือ "Banana"

ทดลองด้วยตัวเอง

shift() วิธีนี้กลับค่าเป็นตัวแปรที่ "ย้ายออกมา":

ตัวอย่าง

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift();             // กลับค่าเป็น "Banana"

ทดลองด้วยตัวเอง

unshift() วิธีนี้ (ในตำแหน่งเริ่มต้น) ทำให้เพิ่มองค์ประกอบใหม่ในตัวแปรแบบแถว และ "ย้าย" องค์ประกอบเก่าออกมา:

ตัวอย่าง

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");    // เพิ่มองค์ประกอบ "Lemon" ใน fruits

ทดลองด้วยตัวเอง

unshift() วิธีนี้กลับค่าเป็นความยาวของตัวแปรแบบแถวใหม่:

ตัวอย่าง

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");    // กลับค่าเป็น 5

ทดลองด้วยตัวเอง

เปลี่ยนค่าองค์ประกอบ

ด้วยการใช้หมายเลขเพื่อเข้าถึงองค์ประกอบตัวแปร:

ตัวแปรแบบแถวดัชนี (index)เริ่มต้นด้วย 0。[0] คือองค์ประกอบแรก [1] คือองค์ประกอบที่สอง [2] คือองค์ประกอบที่สาม ...

ตัวอย่าง

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[0] = "Kiwi";        // ทำให้ตัวแปรแรกใน fruits มีค่า "Kiwi"

ทดลองด้วยตัวเอง

length ตัวแปร length ได้มีความชัดเจนว่าเป็นวิธีง่ายๆ ในการเพิ่มองค์ประกอบใหม่ในตัวแปรแบบแถว:

ตัวอย่าง

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Kiwi";          // ทำให้ fruits มีค่า "Kiwi"

ทดลองด้วยตัวเอง

การลบออกองค์ประกอบ

เพราะตัวแปรแถวใน JavaScript นับเป็นวัตถุ องค์ประกอบของมันสามารถใช้ JavaScript delete ตัวอักษรเพื่อการลบออก:

ตัวอย่าง

var fruits = ["Banana", "Orange", "Apple", "Mango"];
delete fruits[0];           // ทำให้ตัวแปรแรกใน fruits มีค่า undefined

ทดลองด้วยตัวเอง

ใช้ delete จะทำให้ตัวแปรเหลือ 'ช่องว่าง' ไม่มีค่า โปรดใช้ pop() หรือ shift() แทนที่ด้วย

การต่อเนื่องตัวแปรแบบแถว

splice() วิธีนี้สามารถใช้เพื่อเพิ่มองค์ประกอบใหม่ในตัวแปรแบบแถว:

ตัวอย่าง

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi");

ทดลองด้วยตัวเอง

ตัวแปรแรก (2) กำหนดตำแหน่งที่ต้องการเพิ่มองค์ประกอบใหม่ (ทำการต่อเนื่อง)

ตัวแปรที่สอง (0) กำหนดจำนวนองค์ประกอบที่ต้องการลบออก

ตัวแปรที่เหลือ ("Lemon", "Kiwi") กำหนดองค์ประกอบที่ต้องการเพิ่มเข้ามา

splice() วิธีนี้จะกลับค่าเป็นตัวแปรแบบแถวที่มีองค์ประกอบที่ถูกลบออก:

ตัวอย่าง

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 2, "Lemon", "Kiwi");

ทดลองด้วยตัวเอง

splice() ในการลบออกองค์ประกอบ

ด้วยการตั้งค่าตัวแปรอย่างฉลาด คุณสามารถใช้ splice() ลบออกองค์ประกอบในตัวแปรแบบไม่เหลือ 'ช่องว่าง':

ตัวอย่าง

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(0, 1);        // ลบออกตัวแปรแรกใน fruits

ทดลองด้วยตัวเอง

แรกที่นิยาย (0) กำหนดว่าตัวแปรใหม่ควรถูกเพิ่มเข้าถึง

ตัวแปรที่สอง (1) กำหนดตำแหน่งที่ควรลบหลายอิเลเมนต์

ตัวแปรส่วนที่เหลือถูกระงับใช้งาน จะไม่มีส่วนใดที่ถูกเพิ่มเข้ามา

ผสมผสาน (ผสมผสาน) ตัวแปรแถว

concat() วิธีนี้จะสร้างตัวแปรแถวใหม่โดยผสมผสาน (ผสมผสาน) ตัวแปรแถวที่มีอยู่

ตัวอย่าง (ผสมผสานสองตัวแปรแถว)

var myGirls = ["Cecilie", "Lone"];
var myBoys = ["Emil", "Tobias", "Linus"];
var myChildren = myGirls.concat(myBoys);   // ผสมผสาน myGirls และ myBoys

ทดลองด้วยตัวเอง

concat() วิธีนี้จะไม่เปลี่ยนแปลงตัวแปรแถวที่มีอยู่ มันจะเสร็จสิ้นด้วยตัวแปรแถวใหม่

concat() วิธีนี้สามารถใช้ตัวแปรแถวเป็นจำนวนที่เป็นประโยชน์

ตัวอย่าง (ผสมผสานสามตัวแปรแถว)

var arr1 = ["Cecilie", "Lone"];
var arr2 = ["Emil", "Tobias", "Linus"];
var arr3 = ["Robin", "Morgan"];
var myChildren = arr1.concat(arr2, arr3);   // ผสมผสาน arr1 กับ arr2 และ arr3 กัน

ทดลองด้วยตัวเอง

concat() วิธีนี้ก็สามารถใช้ค่าเป็นตัวแปรสอง

ตัวอย่าง (ผสมผสานตัวแปรแถวกับค่า)

var arr1 = ["Cecilie", "Lone"];
var myChildren = arr1.concat(["Emil", "Tobias", "Linus"]); 

ทดลองด้วยตัวเอง

ตัดแถว

slice() วิธีนี้จะตัดออกส่วนของตัวแปรแถวแล้วสร้างตัวแปรแถวใหม่

ตัวอย่างนี้จะตัดออกส่วนที่อยู่ระหว่างตัวแปร 1 ("Orange")

ตัวอย่าง

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1); 

ทดลองด้วยตัวเอง

slice() วิธีนี้จะสร้างตัวแปรแถวใหม่ มันจะไม่ลบออกในตัวแปรแถวต้น

ตัวอย่างนี้จะตัดออกส่วนที่อยู่ระหว่างตัวแปร 3 ("Apple")

ตัวอย่าง

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(3); 

ทดลองด้วยตัวเอง

slice() สามารถรับตัวแปรสอง ตัวอย่างเช่น (1, 3)

วิธีนี้จะเลือกออกส่วนที่อยู่ระหว่างตัวแปรเริ่มต้น จนถึงตัวแปรปิดท้าย (ไม่รวม)

ตัวอย่าง

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1, 3); 

ทดลองด้วยตัวเอง

ถ้าตัวแปรปิดท้ายถูกระงับใช้งาน ตัวอย่างเช่นตัวอย่างแรก slice() จะตัดออกส่วนที่เหลือของตัวแปรแถว

ตัวอย่าง

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(2); 

ทดลองด้วยตัวเอง

auto toString()

ถ้าคุณต้องการค่าตัวเดิม จะมี JavaScript ที่จะแปลงแบบเรียงลำดับเป็นตัวอักษรอัตโนมัติ ตัวอย่างที่สองต่อไปนี้จะมีผลลัพธ์เดียวกัน

ตัวอย่าง

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString(); 

ทดลองด้วยตัวเอง

ตัวอย่าง

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits; 

ทดลองด้วยตัวเอง

ทุกวัตถุ JavaScript มี toString() วิธี

การเรียงลำดับ

เราจะเรียนวิชาการเรียงลำดับในบทถัดไป~

ค้นหาค่าสูงสุดและต่ำสุดในแบบเรียงลำดับ

ไม่มีฟังก์ชันที่สามารถค้นหาค่าสูงสุดและต่ำสุดในแบบเรียงลำดับ JavaScript

คุณจะเรียนวิชาวิธีการแก้ปัญหานี้ในบทถัดไปของคู่มือนี้

คู่มืออ้างอิงแบบเรียงลำดับสมบูรณ์

สำหรับคู่มืออ้างอิงที่สมบูรณ์ โปรดเข้าเว็บไซต์ของเราที่ คู่มืออ้างอิงแบบเรียงลำดับ JavaScript

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