Array & Metodenya di JS | Belajar JavaScript Dasar: Menghidupkan Web | Mahir.dev | Mahir.dev Academy

Array & Metodenya di JS | Belajar JavaScript Dasar: Menghidupkan Web | Mahir.dev | Mahir.dev Academy

javascript

// Array kosong
let namaKosong = [];
console.log(namaKosong); // Output: []
 
// Array berisi string (nama buah)
let buahBuahan = ["Apel", "Jeruk", "Mangga", "Pisang"];
console.log(buahBuahan); // Output: ["Apel", "Jeruk", "Mangga", "Pisang"]
 
// Array berisi angka (skor)
let skorGame = [100, 85, 92, 78];
console.log(skorGame); // Output: [100, 85, 92, 78]
 
// Array berisi tipe data campuran (gak terlalu disarankan tapi bisa)
let dataCampuran = ["Budi", 25, true, null];
console.log(dataCampuran); // Output: ["Budi", 25, true, null]
 
// Array di dalem array (array multi-dimensi)
let matriks = [
    [1, 2, 3],
    [4, 5, 6],
    [7, 8, 9]
];
console.log(matriks[0][1]); // Output: 2 (baris 0, kolom 1)

javascript

let namaHari = ["Senin", "Selasa", "Rabu", "Kamis", "Jumat", "Sabtu", "Minggu"];
 
console.log(namaHari[0]); // Output: Senin (elemen pertama, indeks 0)
console.log(namaHari[2]); // Output: Rabu (elemen ketiga, indeks 2)
console.log(namaHari[6]); // Output: Minggu (elemen terakhir)
 
// Mengakses indeks yang gak ada bakal ngasilin undefined
console.log(namaHari[10]); // Output: undefined

javascript

let warnaFavorit = ["merah", "biru", "hijau"];
console.log("Warna awal:", warnaFavorit); // Output: Warna awal: ["merah", "biru", "hijau"]
 
warnaFavorit[1] = "kuning"; // Ubah elemen di indeks 1 (yang tadinya "biru") jadi "kuning"
console.log("Warna setelah diubah:", warnaFavorit); // Output: Warna setelah diubah: ["merah", "kuning", "hijau"]

push(elemen1, elemen2, ...): Nambahin satu atau lebih elemen di akhir array. Metode ini ngubah array aslinya dan ngembaliin panjang array baru.
javascript
```
let angka = [1, 2, 3];
angka.push(4, 5);
console.log(angka); // Output: [1, 2, 3, 4, 5]
```

pop(): Ngapus elemen terakhir dari array. Metode ini ngubah array aslinya dan ngembaliin elemen yang dihapus.

javascript

let huruf = ['a', 'b', 'c'];
let hurufDihapus = huruf.pop();
console.log(huruf);         // Output: ['a', 'b']
console.log(hurufDihapus);  // Output: c

unshift(elemen1, elemen2, ...): Nambahin satu atau lebih elemen di awal array. Metode ini ngubah array aslinya dan ngembaliin panjang array baru.
javascript
```
let angkaLagi = [10, 20];
angkaLagi.unshift(0, 5);
console.log(angkaLagi); // Output: [0, 5, 10, 20]
```

shift(): Ngapus elemen pertama dari array. Metode ini ngubah array aslinya dan ngembaliin elemen yang dihapus.

javascript

let namaNama = ["Adi", "Beni", "Cici"];
let namaPertama = namaNama.shift();
console.log(namaNama);    // Output: ["Beni", "Cici"]
console.log(namaPertama); // Output: Adi

slice(startIndex, endIndex): Ngembaliin array baru yang isinya potongan dari array asli, mulai dari startIndex sampe sebelum endIndex. endIndex opsional (kalau gak ada, diambil sampe akhir). Array asli gak berubah. Bisa pake indeks negatif.

javascript

let angkaBanyak = [0, 1, 2, 3, 4, 5, 6];
let potongan1 = angkaBanyak.slice(2, 5); // Dari indeks 2 sampe sebelum 5
console.log(potongan1);      // Output: [2, 3, 4]
let potongan2 = angkaBanyak.slice(3);    // Dari indeks 3 sampe akhir
console.log(potongan2);      // Output: [3, 4, 5, 6]
console.log(angkaBanyak);    // Output: [0, 1, 2, 3, 4, 5, 6] (array asli gak berubah)

splice(startIndex, jumlahHapus, item1, item2, ...): Ini metode yang super powerful buat ngubah array.

startIndex: Indeks tempat mulai ngubah.
jumlahHapus: Berapa banyak elemen yang mau dihapus dari startIndex.
item1, item2, ... (Opsional): Elemen-elemen baru yang mau ditambahin di posisi startIndex (setelah elemen yang dihapus).
Metode ini ngubah array aslinya dan ngembaliin array yang isinya elemen-elemen yang dihapus.

javascript

let bulan = ["Jan", "Mar", "Apr", "Jun"];
 
// Nambahin "Feb" di indeks 1, tanpa ngapus apa-apa
bulan.splice(1, 0, "Feb"); 
console.log(bulan); // Output: ["Jan", "Feb", "Mar", "Apr", "Jun"]
 
// Ngapus "Apr" (di indeks 3 sekarang)
let bulanDihapus = bulan.splice(3, 1);
console.log(bulan);        // Output: ["Jan", "Feb", "Mar", "Jun"]
console.log(bulanDihapus); // Output: ["Apr"]
 
// Ganti "Jun" (di indeks 3) dengan "Mei", "Jun"
bulan.splice(3, 1, "Mei", "Jun");
console.log(bulan); // Output: ["Jan", "Feb", "Mar", "Mei", "Jun"]

indexOf(itemCari, startIndex): Nyari itemCari di array, ngembaliin indeks pertama kemunculannya. Kalau gak ketemu, hasilnya -1. startIndex opsional.
lastIndexOf(itemCari, startIndex): Mirip indexOf, tapi nyarinya dari belakang.

includes(itemCari, startIndex): (ES7) Ngecek apakah array mengandung itemCari. Ngembaliin true atau false. Lebih gampang dibaca daripada indexOf() !== -1.

javascript

let hewan = ["kucing", "anjing", "burung", "kucing"];
console.log(hewan.indexOf("anjing"));  // Output: 1
console.log(hewan.indexOf("kucing"));  // Output: 0 (kemunculan pertama)
console.log(hewan.lastIndexOf("kucing"));// Output: 3 (kemunculan terakhir)
console.log(hewan.includes("ikan"));   // Output: false

join(separator): Gabungin semua elemen array jadi satu string. separator (opsional) adalah string yang dipake buat misahin antar elemen. Kalau gak ada separator, defaultnya pake koma (,).

javascript

let kataKata = ["Belajar", "JavaScript", "itu", "seru"];
console.log(kataKata.join(" ")); // Output: Belajar JavaScript itu seru
console.log(kataKata.join("-")); // Output: Belajar-JavaScript-itu-seru
console.log(kataKata.join());    // Output: Belajar,JavaScript,itu,seru

concat(array2, array3, ...): Gabungin array saat ini dengan satu atau lebih array lain (atau nilai lain). Ngembaliin array baru, array asli gak berubah.
javascript
```
let angka1 = [1, 2];
let angka2 = [3, 4];
let hurufA = ['a', 'b'];
let gabungan = angka1.concat(angka2, hurufA, 5);
console.log(gabungan); // Output: [1, 2, 3, 4, "a", "b", 5]
console.log(angka1);   // Output: [1, 2] (array asli gak berubah)
```
Di JavaScript modern (ES6+), sering juga dipake Spread Operator (...) buat gabungin array, yang kadang lebih ringkes: let gabunganPakeSpread = [...angka1, ...angka2, ...hurufA, 5];

javascript

let angkaAsli = [1, 2, 3, 4, 5];
 
// Pake map buat ngaliin tiap angka sama 2
let angkaKaliDua = angkaAsli.map(function(angka) {
    return angka * 2;
});
// atau pake arrow function: let angkaKaliDua = angkaAsli.map(angka => angka * 2);
console.log(angkaKaliDua); // Output: [2, 4, 6, 8, 10]
 
// Pake filter buat ngambil angka yang genap aja
let angkaGenap = angkaAsli.filter(function(angka) {
    return angka % 2 === 0;
});
// atau pake arrow function: let angkaGenap = angkaAsli.filter(angka => angka % 2 === 0);
console.log(angkaGenap); // Output: [2, 4]