15 Metode Yang Berguna Dalam Array JavaScript | 15 Useful Methods In JavaScript Array

Soefyan Syah
Soefyan Syah14 Sep 2022
JavascriptWebDev

Apa itu Array di JS? Objek Array, seperti halnya array dalam bahasa pemrograman lain, memungkinkan penyimpanan kumpulan beberapa item di bawah satu nama variabel, dan memiliki anggota untuk melakukan operasi array umum.

5 Useful Methods In JavaScript Array
5 Useful Methods In JavaScript Array

Mendeklarasikan array

Kita dapat mendeklarasikan array dengan 2 cara yang berbeda.

  1. Menggunakan Array baru | Using new Array

    Using new Array, kita bisa menentukan elemen yang kita inginkan ada di dalam array, seperti code ini :

    const fruits = new Array('Apple', 'Banana');
    console.log(fruits.length);
  2. Notasi literal array | Array literal notation

    Mendeklarasikan dengan literal array, kami menentukan nilai yang akan dimiliki array. Jika kita tidak mendeklarasikan nilai apapun, array akan kosong.

    // 'fruits' array created using array literal notation.
    const fruits = ['Apple', 'Banana'];
    console.log(fruits.length);

Metode Array Javascript | 15 Useful Methods In JavaScript Array

Berikut adalah daftar metode objek Array beserta deskripsinya.

  • forEach

    Metode forEach() mengeksekusi fungsi yang disediakan satu kali untuk setiap elemen array.

    forEach() memanggil fungsi callbackFn yang disediakan satu kali untuk setiap elemen dalam array dalam urutan indeks naik. Itu tidak dipanggil untuk properti indeks yang telah dihapus atau tidak diinisialisasi.

    array.forEach(callback[, thisObject]);
    const array1 = ['a', 'b', 'c'];
    
    array1.forEach(element => console.log(element));
    
    // expected output: "a"
    // expected output: "b"
    // expected output: "c"

  • map

    Metode Array.map() memungkinkan Anda untuk mengulangi array dan memodifikasi elemennya menggunakan fungsi callback. Fungsi callback kemudian akan dieksekusi pada setiap elemen array.

    array.map(callback[, thisObject]);
    let arr = [3, 4, 5, 6];
    
    let modifiedArr = arr.map(function(element){
        return element *3;
    });
    
    console.log(modifiedArr); // [9, 12, 15, 18]

    Metode Array.map() biasanya digunakan untuk menerapkan beberapa perubahan pada elemen, apakah mengalikan dengan angka tertentu seperti pada kode di atas, atau melakukan operasi lain yang mungkin Anda perlukan untuk aplikasi Anda.

  • concat

    Dalam JavaScript, concat() adalah metode string yang digunakan untuk menggabungkan string menjadi satu. Metode concat() menambahkan satu atau lebih nilai string ke string panggilan dan kemudian mengembalikan hasil gabungan sebagai string baru. Karena metode concat() adalah metode dari objek String, metode tersebut harus dipanggil melalui instance tertentu dari kelas String.

    array.concat(value1, value2, ..., valueN);
    const array1 = ['a', 'b', 'c'];
    const array2 = ['d', 'e', 'f'];
    const array3 = array1.concat(array2);
    
    console.log(array3);
    // expected output: Array ["a", "b", "c", "d", "e", "f"]

  • push

    Metode push() array Javascript menambahkan elemen yang diberikan pada array terakhir dan mengembalikan panjang array baru.

    Saat Anda ingin menambahkan elemen ke akhir array Anda, gunakan push().

    array.push(element1, ..., elementN);
    const countries = ["Nigeria", "Ghana", "Rwanda"];
    
    countries.push("Kenya");
    
    console.log(countries); // ["Nigeria","Ghana","Rwanda","Kenya"]

  • pop

    Metode pop() menghapus elemen terakhir dari array dan mengembalikan nilai tersebut ke pemanggil. Jika Anda memanggil pop() pada array kosong, ia mengembalikan undefined.

    Array.prototype.shift() memiliki perilaku yang mirip dengan pop(), tetapi diterapkan pada elemen pertama dalam array.

    array.pop();
    const plants = ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato'];
    
    console.log(plants.pop());
    // expected output: "tomato"
    
    console.log(plants);
    // expected output: Array ["broccoli", "cauliflower", "cabbage", "kale"]

  • splice

    Metode splice() adalah metode tujuan umum untuk mengubah isi array dengan menghapus, mengganti, atau menambahkan elemen pada posisi tertentu dari array. Bagian ini akan membahas cara menggunakan metode ini untuk menambahkan elemen ke lokasi tertentu.

    array.splice(index, howMany, [element1][, ..., elementN]);
    const fruits = ["Banana", "Orange", "Apple", "Mango"];
    
    fruits.splice(2, 0, "Lemon", "Kiwi"); //Banana,Orange,Lemon,Kiwi,Apple,Mango

  • slice


    Metode slice() mengembalikan salinan dangkal dari sebagian array ke objek array baru yang dipilih dari awal hingga akhir (akhir tidak disertakan) di mana awal dan akhir mewakili indeks item dalam array itu. Array asli tidak akan diubah.

    array.slice( begin [,end] );
    const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];
    
    console.log(animals.slice(2));
    // expected output: Array ["camel", "duck", "elephant"]
    
    console.log(animals.slice(2, 4));
    // expected output: Array ["camel", "duck"]

  • shift

    shift() adalah fungsi JavaScript bawaan yang menghapus elemen pertama dari array. Fungsi shift() secara langsung memodifikasi larik JavaScript yang sedang Anda kerjakan. shift() mengembalikan item yang telah Anda hapus dari array.

    Fungsi shift() menghapus item pada posisi indeks 0 dan menggeser nilai pada nomor indeks mendatang turun satu per satu.

    array.shift();
    const array1 = [1, 2, 3];
    
    const firstElement = array1.shift();
    
    console.log(array1);
    // expected output: Array [2, 3]
    
    console.log(firstElement);
    // expected output: 1

  • unshift

    Metode unshift() menyisipkan nilai yang diberikan ke awal objek seperti array.

    Array.prototype.push() memiliki perilaku yang mirip dengan unshift(), tetapi diterapkan pada akhir array.

    array.unshift( element1, ..., elementN );
    const array1 = [1, 2, 3];
    
    console.log(array1.unshift(4, 5));
    // expected output: 5
    
    console.log(array1);
    // expected output: Array [4, 5, 1, 2, 3]

  • join

    JavaScript array join() adalah metode bawaan yang membuat dan mengembalikan string baru dengan menggabungkan semua elemen array. Metode join() menggabungkan item array ke dalam string dan mengembalikan string tersebut. Pemisah yang ditentukan akan memisahkan larik elemen. Pemisah default adalah koma (,).

    array.join(separator);
    const elements = ['Fire', 'Air', 'Water'];
    
    console.log(elements.join());
    // expected output: "Fire,Air,Water"
    
    console.log(elements.join(''));
    // expected output: "FireAirWater"
    
    console.log(elements.join('-'));
    // expected output: "Fire-Air-Water"

  • every

    Metode every() menguji apakah semua elemen dalam array lulus pengujian yang diterapkan oleh fungsi yang disediakan. Ini mengembalikan nilai Boolean.

    array.every(callback[, thisObject]);
    const isBelowThreshold = (currentValue) => currentValue < 40;
    
    const array1 = [1, 30, 39, 29, 10, 13];
    
    console.log(array1.every(isBelowThreshold));
    // expected output: true

  • filter

    Metode filter() membuat salinan dangkal dari sebagian larik tertentu, difilter ke hanya elemen dari larik tertentu yang lulus pengujian yang diimplementasikan oleh fungsi yang disediakan.

    array.filter(callback[, thisObject]);
    const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];
    
    const result = words.filter(word => word.length > 6);
    
    console.log(result);
    // expected output: Array ["exuberant", "destruction", "present"]

  • indexOf

    Metode indexOf() mengembalikan indeks pertama di mana elemen tertentu dapat ditemukan dalam array, atau -1 jika tidak ada.

    array.indexOf(searchElement[, fromIndex]);
    const beasts = ['ant', 'bison', 'camel', 'duck', 'bison'];
    
    console.log(beasts.indexOf('bison'));
    // expected output: 1
    
    // start from index 2
    console.log(beasts.indexOf('bison', 2));
    // expected output: 4
    
    console.log(beasts.indexOf('giraffe'));
    // expected output: -1

  • reduce

    Metode reduce() menjalankan fungsi callback "peredam" yang disediakan pengguna pada setiap elemen larik, secara berurutan, meneruskan nilai balik dari perhitungan pada elemen sebelumnya. Hasil akhir menjalankan peredam di semua elemen array adalah nilai tunggal.

    array.reduce(callback[, initialValue]);
    const array1 = [1, 2, 3, 4];
    
    // 0 + 1 + 2 + 3 + 4
    const initialValue = 0;
    const sumWithInitial = array1.reduce(
      (previousValue, currentValue) => previousValue + currentValue,
      initialValue
    );
    
    console.log(sumWithInitial)

  • reverse

    Metode reverse() membalikkan array di tempatnya dan mengembalikan referensi ke array yang sama, elemen array pertama sekarang menjadi yang terakhir, dan elemen array terakhir menjadi yang pertama. Dengan kata lain, urutan elemen dalam array akan berbalik ke arah yang berlawanan dengan yang dinyatakan sebelumnya.

    array.reverse();
    const array1 = ['one', 'two', 'three'];
    console.log('array1:', array1);
    // expected output: "array1:" Array ["one", "two", "three"]
    
    const reversed = array1.reverse();
    console.log('reversed:', reversed);
    // expected output: "reversed:" Array ["three", "two", "one"]
    
    // Careful: reverse is destructive -- it changes the original array.
    console.log('array1:', array1);
    // expected output: "array1:" Array ["three", "two", "one"]

Terimakasih sudah mampir, semoga bermanfaat.

Soefyan Syah

Written by Soefyan Syah

Hey there! I hope you find this post useful. If you have anything to say, questions or feedback, send me a tweet or an email.