JavaScript Sorting Arrays
การเรียงลำดับอาร์เรย์
วิธี การsort()
จัดเรียงอาร์เรย์ตามตัวอักษร:
ตัวอย่าง
const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();
การย้อนกลับอาร์เรย์
วิธี การreverse()
กลับองค์ประกอบในอาร์เรย์
คุณสามารถใช้เพื่อเรียงลำดับอาร์เรย์จากมากไปน้อย:
ตัวอย่าง
const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();
fruits.reverse();
การเรียงลำดับตัวเลข
โดยค่าเริ่มต้นsort()
ฟังก์ชันจะจัดเรียงค่าเป็นสตริง
วิธีนี้ใช้ได้ผลดีกับสตริง ("Apple" มาก่อน "Banana")
อย่างไรก็ตาม หากจัดเรียงตัวเลขเป็นสตริง "25" จะมากกว่า "100" เนื่องจาก "2" มากกว่า "1"
ด้วยเหตุนี้sort()
วิธีการนี้จะให้ผลลัพธ์ที่ไม่ถูกต้องเมื่อเรียงลำดับตัวเลข
คุณสามารถแก้ไขได้โดยจัดเตรียมฟังก์ชันเปรียบเทียบ :
ตัวอย่าง
const points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return a - b});
ใช้เคล็ดลับเดียวกันนี้เพื่อจัดเรียงอาร์เรย์จากมากไปน้อย:
ตัวอย่าง
const points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return b - a});
ฟังก์ชันเปรียบเทียบ
วัตถุประสงค์ของฟังก์ชันเปรียบเทียบคือเพื่อกำหนดลำดับการจัดเรียงทางเลือก
ฟังก์ชันเปรียบเทียบจะส่งกลับค่าลบ ศูนย์ หรือค่าบวก ขึ้นอยู่กับอาร์กิวเมนต์:
function(a, b){return a - b}
เมื่อsort()
ฟังก์ชันเปรียบเทียบสองค่า ฟังก์ชันจะส่งค่าไปยังฟังก์ชันเปรียบเทียบ และจัดเรียงค่าตามค่าที่ส่งคืน (ค่าลบ ศูนย์ ค่าบวก)
ถ้าผลเป็นลบa
จะเรียงลำดับ
b
ก่อน
ถ้าผลเป็นบวกb
จะเรียงลำดับa
ก่อน
ถ้าผลลัพธ์เป็น 0 จะไม่มีการเปลี่ยนแปลงใด ๆ กับการเรียงลำดับของสองค่า
ตัวอย่าง:
ฟังก์ชันเปรียบเทียบจะเปรียบเทียบค่าทั้งหมดในอาร์เรย์ ครั้งละสอง(a, b)
ค่า
เมื่อเปรียบเทียบ 40 และ 100 sort()
เมธอดจะเรียกใช้ฟังก์ชันการเปรียบเทียบ (40, 100)
ฟังก์ชันคำนวณ 40 - 100 (a - b)
และเนื่องจากผลลัพธ์เป็นค่าลบ (-60) ฟังก์ชัน sort จะเรียงลำดับ 40 เป็นค่าที่ต่ำกว่า 100
คุณสามารถใช้ข้อมูลโค้ดนี้เพื่อทดลองกับการเรียงลำดับตัวเลขและตัวอักษร:
<button onclick="myFunction1()">Sort Alphabetically</button>
<button
onclick="myFunction2()">Sort Numerically</button>
<p id="demo"></p>
<script>
const points = [40, 100, 1, 5, 25, 10];
document.getElementById("demo").innerHTML = points;
function
myFunction1() {
points.sort();
document.getElementById("demo").innerHTML
= points;
}
function myFunction2() {
points.sort(function(a, b){return
a - b});
document.getElementById("demo").innerHTML = points;
}
</script>
การจัดเรียงอาร์เรย์ในลำดับแบบสุ่ม
ตัวอย่าง
const points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return 0.5 - Math.random()});
วิธีการของฟิชเชอร์เยทส์
ตัวอย่างข้างต้นarray .sort() ไม่ถูกต้อง มันจะสนับสนุนตัวเลขบางตัวมากกว่าตัวอื่นๆ
วิธีการที่ถูกต้องที่ได้รับความนิยมมากที่สุด เรียกว่าการสับเปลี่ยนของฟิชเชอร์ เยทส์ และถูกนำมาใช้ในวิทยาศาสตร์ข้อมูลตั้งแต่ปี 1938!
ใน JavaScript วิธีการสามารถแปลเป็นสิ่งนี้:
ตัวอย่าง
const points = [40, 100, 1, 5, 25, 10];
for (let i = points.length -1; i > 0;
i--) {
let j = Math.floor(Math.random() * i)
let k = points[i]
points[i] = points[j]
points[j] = k
}
ค้นหาค่าอาร์เรย์สูงสุด (หรือต่ำสุด)
ไม่มีฟังก์ชันในตัวสำหรับค้นหาค่าสูงสุดหรือต่ำสุดในอาร์เรย์
อย่างไรก็ตาม หลังจากที่คุณจัดเรียงอาร์เรย์แล้ว คุณสามารถใช้ดัชนีเพื่อรับค่าสูงสุดและต่ำสุดได้
เรียงลำดับจากน้อยไปมาก:
ตัวอย่าง
const points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return a - b});
// now points[0] contains the lowest value
// and points[points.length-1] contains the highest value
เรียงลำดับจากมากไปน้อย:
ตัวอย่าง
const points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return b - a});
// now points[0] contains the highest value
// and points[points.length-1] contains the lowest value
การจัดเรียงอาร์เรย์ทั้งหมดเป็นวิธีที่ไม่มีประสิทธิภาพมาก หากคุณต้องการค้นหาเฉพาะค่าสูงสุด (หรือต่ำสุด)
การใช้ Math.max() บน Array
คุณสามารถใช้Math.max.apply
เพื่อค้นหาจำนวนสูงสุดในอาร์เรย์:
ตัวอย่าง
function myArrayMax(arr) {
return Math.max.apply(null, arr);
}
Math.max.apply(null, [1, 2, 3])
Math.max(1, 2, 3)
มี ค่าเท่ากับ
การใช้ Math.min() บน Array
คุณสามารถใช้Math.min.apply
เพื่อค้นหาตัวเลขต่ำสุดในอาร์เรย์:
ตัวอย่าง
function myArrayMin(arr) {
return Math.min.apply(null, arr);
}
Math.min.apply(null, [1, 2, 3])
Math.min(1, 2, 3)
มี ค่าเท่ากับ
วิธีการ JavaScript ต่ำสุด / สูงสุดของฉัน
วิธีแก้ปัญหาที่เร็วที่สุดคือใช้วิธี "ทำเองที่บ้าน"
ฟังก์ชันนี้จะวนซ้ำผ่านอาร์เรย์ที่เปรียบเทียบแต่ละค่ากับค่าสูงสุดที่พบ:
ตัวอย่าง (ค้นหาสูงสุด)
function myArrayMax(arr) {
let len = arr.length;
let max = -Infinity;
while (len--) {
if (arr[len] > max) {
max = arr[len];
}
}
return max;
}
ฟังก์ชันนี้จะวนซ้ำผ่านอาร์เรย์ที่เปรียบเทียบแต่ละค่ากับค่าต่ำสุดที่พบ:
ตัวอย่าง (ค้นหาขั้นต่ำ)
function myArrayMin(arr) {
let len = arr.length;
let min = Infinity;
while (len--) {
if (arr[len] < min) {
min = arr[len];
}
}
return min;
}
การเรียงลำดับออบเจ็กต์อาร์เรย์
อาร์เรย์ JavaScript มักจะมีอ็อบเจ็กต์:
ตัวอย่าง
const cars = [
{type:"Volvo", year:2016},
{type:"Saab", year:2001},
{type:"BMW", year:2010}
];
แม้ว่าอ็อบเจ็กต์จะมีคุณสมบัติของชนิดข้อมูลที่แตกต่างกัน แต่sort()
เมธอดนี้ก็สามารถใช้เพื่อเรียงลำดับอาร์เรย์ได้
วิธีแก้ไขคือเขียนฟังก์ชันเปรียบเทียบเพื่อเปรียบเทียบค่าคุณสมบัติ:
ตัวอย่าง
cars.sort(function(a, b){return a.year - b.year});
การเปรียบเทียบคุณสมบัติของสตริงนั้นซับซ้อนกว่าเล็กน้อย:
ตัวอย่าง
cars.sort(function(a, b){
let x = a.type.toLowerCase();
let y = b.type.toLowerCase();
if (x < y) {return -1;}
if (x > y) {return 1;}
return 0;
});
การอ้างอิงอาร์เรย์ที่สมบูรณ์
สำหรับการอ้างอิง Array ฉบับสมบูรณ์ ไปที่:
การอ้างอิงอาร์เรย์ JavaScriptที่สมบูรณ์
ข้อมูลอ้างอิงประกอบด้วยคำอธิบายและตัวอย่างคุณสมบัติและเมธอดของ Array ทั้งหมด