วิธีการอาร์เรย์ JavaScript พื้นฐานบางอย่างคือ -
วิธีการ | คำอธิบาย |
---|---|
Array.push() | การเพิ่มองค์ประกอบที่ส่วนท้ายของอาร์เรย์ |
Array.pop() | การลบองค์ประกอบออกจากส่วนท้ายของอาร์เรย์ |
Array.unshift() | การเพิ่มองค์ประกอบที่ด้านหน้าของอาร์เรย์ |
Array.shift() | การลบองค์ประกอบออกจากด้านหน้าของอาร์เรย์ |
Array.splice() | การเพิ่มหรือลบองค์ประกอบออกจาก splice |
ต่อไปนี้เป็นรหัสสำหรับวิธีการอาร์เรย์พื้นฐาน -
ตัวอย่าง
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <style> body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .sample, .result { font-size: 18px; font-weight: 500; color: red; } .result { color: blueviolet; } </style> </head> <body> <h1>JavaScript Basic array methods</h1> <div class="sample">arr =</div> <div class="result"></div> <button class="Btn">CLICK HERE</button> <h3>Click on the above button to apply the array methods on the above array</h3> <script> let resultEle = document.querySelector(".result"); let sampleEle = document.querySelector(".sample"); let arr = ["A", "B", 1, 2, 3, 5]; sampleEle.innerHTML += arr; document.querySelector(".Btn").addEventListener("click", () => { arr.pop(); resultEle.innerHTML += "arr.pop() = " + arr + "<br>"; arr.push(22); resultEle.innerHTML += "arr.push(22) = " + arr + "<br>"; arr.shift(); resultEle.innerHTML += "arr.shift() = " + arr + "<br>"; arr.unshift(); resultEle.innerHTML += "arr.unshift(55) = " + arr + "<br>"; arr.splice(3, 0, "D", "E", "F"); resultEle.innerHTML += 'Array.splice(3,0,"D","E","F") = ' + arr; }); </script> </body> </html>
ผลลัพธ์
เมื่อคลิกปุ่ม 'คลิกที่นี่' -