Array JavaScript
Array adalah variabel khusus, yang dapat menampung lebih dari satu nilai:
const cars = ["Saab", "Volvo", "BMW"];
Mengapa Menggunakan Array?
Jika Anda memiliki daftar item (daftar nama mobil, misalnya), menyimpan mobil dalam variabel tunggal dapat terlihat seperti ini:
let car1 = "Saab";
let car2 = "Volvo";
let car3 = "BMW";
Namun, bagaimana jika Anda ingin menelusuri mobil dan menemukan yang spesifik? Dan bagaimana jika Anda tidak memiliki 3 mobil, tetapi 300?
Solusinya adalah array!
Array dapat menampung banyak nilai di bawah satu nama, dan Anda dapat mengakses nilai dengan merujuk ke nomor indeks.
Membuat Array
Menggunakan literal array adalah cara termudah untuk membuat Array JavaScript.
Sintaksis:
const array_name = [item1, item2, ...];
Ini adalah praktik umum untuk mendeklarasikan array dengan kata kunci const .
Pelajari lebih lanjut tentang const dengan array dalam bab: JS Array Const .
Contoh
const cars = ["Saab", "Volvo", "BMW"];
Spasi dan jeda baris tidak penting. Deklarasi dapat menjangkau beberapa baris:
Contoh
const cars = [
"Saab",
"Volvo",
"BMW"
];
Anda juga dapat membuat larik, lalu menyediakan elemen:
Contoh
const cars = [];
cars[0]= "Saab";
cars[1]= "Volvo";
cars[2]= "BMW";
Menggunakan Kata Kunci JavaScript baru
Contoh berikut juga membuat Array, dan memberikan nilai padanya:
Contoh
const cars = new Array("Saab", "Volvo", "BMW");
Kedua contoh di atas melakukan hal yang persis sama.
Tidak perlu menggunakan new Array().
Untuk kesederhanaan, keterbacaan, dan kecepatan eksekusi, gunakan metode literal array.
Mengakses Elemen Array
Anda mengakses elemen array dengan mengacu pada nomor indeks :
const cars = ["Saab", "Volvo", "BMW"];
let car = cars[0];
Catatan: Indeks array dimulai dengan 0.
[0] adalah elemen pertama. [1] adalah elemen kedua.
Mengubah Elemen Array
Pernyataan ini mengubah nilai elemen pertama di cars:
cars[0] = "Opel";
Contoh
const cars = ["Saab", "Volvo", "BMW"];
cars[0] = "Opel";
Akses Array Lengkap
Dengan JavaScript, array lengkap dapat diakses dengan mengacu pada nama array:
Contoh
const cars = ["Saab", "Volvo", "BMW"];
document.getElementById("demo").innerHTML = cars;
Array adalah Objek
Array adalah jenis objek khusus. Operator typeofdalam JavaScript mengembalikan "objek" untuk array.
Tapi, array JavaScript paling baik digambarkan sebagai array.
Array menggunakan angka untuk mengakses "elemen" -nya. Dalam contoh ini, person[0]
mengembalikan John:
Himpunan:
const person = ["John", "Doe", 46];
Objek menggunakan nama untuk mengakses "anggota" -nya. Dalam contoh ini,
person.firstName
mengembalikan John:
Obyek:
const person = {firstName:"John", lastName:"Doe", age:46};
Elemen Array Bisa Menjadi Objek
Variabel JavaScript dapat berupa objek. Array adalah jenis objek khusus.
Karena itu, Anda dapat memiliki variabel dengan tipe berbeda dalam Array yang sama.
Anda dapat memiliki objek dalam Array. Anda dapat memiliki fungsi dalam Array. Anda dapat memiliki array dalam Array:
myArray[0] = Date.now;
myArray[1] = myFunction;
myArray[2] = myCars;
Properti dan Metode Array
Kekuatan sebenarnya dari array JavaScript adalah properti dan metode array bawaan:
cars.length // Returns the number of elements
cars.sort() // Sorts the array
Metode array dibahas dalam bab-bab berikutnya.
Properti panjangnya
Properti lengtharray mengembalikan panjang array (jumlah elemen array).
Contoh
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let length = fruits.length;
Properti lengthselalu satu lebih dari indeks array tertinggi.
Mengakses Elemen Array Pertama
Contoh
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fruit = fruits[0];
Mengakses Elemen Array Terakhir
Contoh
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fruit = fruits[fruits.length - 1];
Elemen Array Pengulangan
Salah satu cara untuk mengulang melalui array, menggunakan forloop:
Contoh
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fLen = fruits.length;
let text = "<ul>";
for (let i = 0; i < fLen; i++) {
text += "<li>" + fruits[i] + "</li>";
}
text
+= "</ul>";
Anda juga dapat menggunakan Array.forEach()fungsi:
Contoh
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let text = "<ul>";
fruits.forEach(myFunction);
text += "</ul>";
function
myFunction(value) {
text += "<li>" + value + "</li>";
}
Menambahkan Elemen Array
Cara termudah untuk menambahkan elemen baru ke array adalah menggunakan push()metode:
Contoh
const fruits = ["Banana", "Orange", "Apple"];
fruits.push("Lemon"); // Adds a new element (Lemon) to fruits
Elemen baru juga dapat ditambahkan ke array menggunakan lengthproperti:
Contoh
const fruits = ["Banana", "Orange", "Apple"];
fruits[fruits.length] = "Lemon"; // Adds "Lemon" to fruits
PERINGATAN !
Menambahkan elemen dengan indeks tinggi dapat membuat "lubang" yang tidak ditentukan dalam larik:
Contoh
const fruits = ["Banana", "Orange", "Apple"];
fruits[6] = "Lemon"; // Creates undefined "holes" in fruits
Array Asosiatif
Banyak bahasa pemrograman mendukung array dengan indeks bernama.
Array dengan indeks bernama disebut array asosiatif (atau hash).
JavaScript tidak mendukung array dengan indeks bernama.
Dalam JavaScript, array selalu menggunakan indeks bernomor .
Contoh
const person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
person.length; // Will return 3
person[0]; // Will return "John"
PERINGATAN !!
Jika Anda menggunakan indeks bernama, JavaScript akan mendefinisikan ulang array menjadi objek.
Setelah itu, beberapa metode dan properti array akan menghasilkan hasil yang salah .
Contoh:
const person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
person.length; // Will return 0
person[0]; // Will return undefined
Perbedaan Antara Array dan Objek
Dalam JavaScript, array menggunakan indeks bernomor .
Dalam JavaScript, objek menggunakan indeks bernama .
Array adalah jenis objek khusus, dengan indeks bernomor.
Kapan Menggunakan Array. Kapan harus menggunakan Objek.
- JavaScript tidak mendukung array asosiatif.
- Anda harus menggunakan objek ketika Anda ingin nama elemen menjadi string (teks) .
- Anda harus menggunakan array bila Anda ingin nama elemen menjadi angka .
JavaScript Array baru()
JavaScript memiliki konstruktor array bawaan new Array().
Tetapi Anda dapat menggunakan dengan aman []sebagai gantinya.
Kedua pernyataan berbeda ini membuat array kosong baru bernama poin:
const points = new Array();
const points = [];
Kedua pernyataan berbeda ini sama-sama membuat array baru yang berisi 6 angka:
const points = new Array(40, 100, 1, 5, 25, 10);
const points = [40, 100, 1, 5, 25, 10];
Kata newkunci dapat menghasilkan beberapa hasil yang tidak terduga:
// Create an array with three elements:
const points = new Array(40, 100, 1);
// Create an array with two elements:
const points = new Array(40, 100);
// Create an array with one element ???
const points = new Array(40);
Kesalahan Umum
const points = [40];
tidak sama dengan:
const points = new Array(40);
// Create an array with one element:
const points = [40];
// Create an array with 40 undefined elements:
const points = new Array(40);
Bagaimana Mengenali Array
Pertanyaan umum adalah: Bagaimana saya tahu jika suatu variabel adalah array?
The problem is that the JavaScript operator typeof returns
"object":
const fruits = ["Banana", "Orange", "Apple"];
let type = typeof fruits;
The typeof operator returns object because a JavaScript array is an object.
Solution 1:
To solve this problem ECMAScript 5 (JavaScript 2009) defined a new method Array.isArray():
Array.isArray(fruits);
Solution 2:
The instanceof operator returns true if an object is created
by a given constructor:
const fruits = ["Banana", "Orange", "Apple"];
fruits instanceof Array;
Complete Array Reference
For a complete Array reference, go to our:
Complete JavaScript Array Reference.
The reference contains descriptions and examples of all Array properties and methods.