Pengantar Bukan Sembarang Data

“If you only have a hammer, you tend to see every problem as a nail.”

- Abraham Maslow, Psikolog asal Amerika.

Jika hanya memiliki palu, Anda akan cenderung melihat semua masalah itu sebagai paku. Sangat penting untuk menyelesaikan masalah dengan cara yang baru dan berbeda, sama halnya ketika membuat program. Oleh karena itu, kita akan membahas struktur data yang ada di JavaScript agar Anda dapat menyelesaikan masalah dengan cara yang berbeda dan lebih efektif.

Berikut adalah objektif pembelajaran yang akan dicapai pada modul kali ini.

Menjelaskan berbagai kasus yang dapat ditangani oleh struktur data, seperti Object, Array, Map, dan Set.
Menentukan struktur data yang cocok untuk digunakan berdasarkan sebuah kasus.
Menjelaskan berbagai kasus yang dapat ditangani dengan menggunakan sintaks Spread Operator untuk Object dan Array.
Membuat, mengakses, hingga memanipulasi nilai yang terkandung di dalam sebuah struktur data Object, Array, Map, dan Set di JavaScript secara efektif.

Sudah siap? Yuk, kencangkan sabuk Anda untuk lanjut ke materi selanjutnya!

Menstrukturkan Data dengan Objek

Struktur data pertama yang kita bahas adalah Objek . Object adalah kumpulan pasangan key-value dan merupakan tipe data yang bukan primitif . Jika tipe data primitif hanya dapat menyimpan satu jenis data seperti string atau angka , tipe data objek dapat menyimpan data yang beragam dan kompleks. Objek dapat menyimpan data secara tidak terurut. Selain tipe data seperti string, number, simbol, boolean , null, dan undefinisi dalam JavaScript, semuanya dianggap sebagai objek. Sebagai informasi tambahan, objek dalam bahasa pemrograman lain disebut dengan tabel hash, peta, dan kamus.

Membuat Objek

Ada berbagai cara untuk membuat objek seperti menggunakan objek konstruktor atau yang paling mudah adalah dengan menggunakan objek literal. Membuat objek dengan literal objek sangat mudah yaitu cukup dengan menulis kurung kurawal {}.

const user = {}; 
const products = { name : 'Sepatu' , price : 230000 };

Dapat dilihat bahwa selain membuat objek dengan beberapa properti, kita juga dapat membuat objek dengan properti kosong. Properti yang ada di dalam objek dapat ditambah dan dihapus. Di dalam kurung kurawal tersebut dapat ditulis properti dari objek.

Properti memiliki kunci dan nilai. Key dari properti dapat berupa string dan value dapat bernilai tipe data apa pun, seperti string, number , atau boolean . Properti yang ada di dalam objek dipisahkan oleh koma.

Catatan
Anda bisa mengubah kode di atas dengan mencetak variabel user menggunakan console.log untuk melihat bentuk objek jika ditampilkan pada konsol.

Kenapa kita menambahkan koma pada properti terakhir? Tujuannya adalah mempermudah kita untuk membaca dan menghindari error karena lupa menulis koma ketika menambahkan properti baru setelah properti age. Beberapa bahasa pemrograman juga menyarankan untuk menuliskan koma pada akhir properti seperti contoh kode di atas.

Mengaksis Properti di Object

Setelah berhasil membuat objek , tentunya kita akan mengakses properti yang ada pada objek tersebut. Objek yang sudah dibuat dapat diakses dengan beberapa teknik.

Mengaksis menggunakan dot

Cara pertama untuk mengakses nilai properti yang ada pada objek adalah menggunakan notasi titik (.). Contohnya ketika ingin mengakses properti namedari objek userdapat ditulis seperti berikut ini.

Kita dapat memanggil nama objek , kemudian menuliskan tanda titik yang diikuti dengan nama propertinya. Sebelum titik adalah nama object-nya dan setelah titik adalah nama properti yang ingin diakses. Kekurangan dari notasi titik adalah nama key yang ingin diakses harus valid; tidak boleh mengandung spasi; tidak boleh diawali angka; dan tidak boleh mengandung karakter spesial.

Mengakses menggunakan tanda kurung siku

Untuk menutupi kekurangan menggunakan notasi titik, ada cara lain yaitu menggunakan tanda kurung siku. Contoh:

Tulislah nama objek terlebih dahulu dan di dalam kurung siku kita menuliskan nama properti yang ingin diakses. Dengan menggunakan tanda kurung siku, kunci yang memiliki spasi pun dapat diakses.

Mengakses menggunakan penghancuran objek

Selain itu nilai properti dari objek dapat diakses juga dengan cara lainnya yaitu menggunakan destrukturisasi objek. Destructuring dalam JavaScript merupakan sintaksis yang dapat mengeluarkan nilai dari properti objek ke dalam satuan yang lebih kecil (variabel). Contohnya seperti berikut.

Penghancuran objek yang key-nya tidak akan mengembalikan nilai yang tidak terdefinisi. Oleh karena itu, kita dapat memanfaatkan nilai default ketika mendestrukturisasi objek seperti berikut ini agar nilainya tidak terdefinisi.

Karena di objek pengguna tidak ada properti isMale, ketika properti tersebut diakses akan mengembalikan nilai false sesuai dengan nilai default yang kami berikan.

Penghancuran objek sangat berguna sekali ketika Anda memiliki objek dengan properti yang banyak dan ingin mendapatkan nilai masing-masing properti seperti contoh berikut.

const user = { 
  id : 24 , 
  Email : 'aras@dicoding.com ' 
  nama : 'Arsy ' 
  nama panggilan : 'Aras ' 
  nama pengguna : 'aras123 ' 
  kata sandi : 'rahasia' , 
};

Untuk mendapatkan masing-masing properti dari object user , Anda hanya perlu melakukan destrukturisasi objek seperti berikut ini.

Tanpa menggunakan penghancuran objek , Anda akan melakukan hal berikut ini.

Hasilnya, penghancuran objek sangat memudahkan hidup para programmer JavaScript karena kita tidak perlu lagi melakukan hal yang rumit hanya untuk mendapatkan nilai properti dari objek.

Perlu dicatat bahwa mengakses properti yang tidak ada di dalam objek akan menyebabkan error dan nilai kembalinya adalah undefinisi yang mana hal ini jika tidak ditangani akan mengganggu program yang dibuat.

Mengubah Nilai di Properti Objek

Untuk mengubah nilai properti di objek sangat mudah asalkan kita mengetahui nama objek dan nama properti yang ingin diubah. Memodifikasi objek dapat dilakukan dengan operator penugasan (=).

Objek akun yang awalnya memiliki nilai properti balance 1000 berubah menjadi 2000. Sebentar, sepertinya ada yang aneh. Objek akun diinisialisasi menggunakan const, kok bisa berubah nilainya? Bukankah const bersifat immutable (tidak dapat diubah)?

Nilai yang ada pada objek dapat diubah karena objek berbeda dengan number , string , dan boolean yang nilainya tidak mungkin berubah. Selain itu, nilai properti dapat diubah karena kita hanya mengubah keuntungan bukan menginisialisasi ulang properti dari objek tersebut. Ingat, mengubah dan menginisialisasi ulang adalah hal yang berbeda.

Menghapus Properti di Objek

Untuk menghapus properti pada objek dapat menggunakan operator delete dengan menuliskan nama objek lalu tanda titik dan diikuti nama propertinya. Contohnya seperti di bawah ini.

Selain menggunakan notasi titik (.), kita juga bisa menggunakan operator delete dengan tanda kurung siku seperti berikut ini.

Menstrukturkan Data dengan Array

Array adalah struktur data spesial yang dapat menyimpan kumpulan data yang terurut. Letak perbedaan array dengan object adalah data yang disimpan di dalam array terurut, sedangkan di object tidak terurut. Di array, kita bisa menambahkan nilai di antara data yang sudah ada. Data yang ada di array dapat diakses menggunakan pola indeks. Nilai yang disimpan di dalam array disebut dengan element.

Array dapat menyimpan nilai dengan tipe data apa pun, seperti number, object, dan string. Oleh karena itu, array bersifat dinamis sehingga kita dapat menambahkan element baru di dalam array. Array juga merupakan sebuah object. Anda dapat memanfaatkan method typeof untuk melihat jenis tipe data dari array tersebut seperti berikut.

Membuat Array

Membuat Array dapat dilakukan dengan tiga cara di bawah ini.

Menggunakan object constructor

Array dapat dibuat dengan constructor new Array() seperti berikut.

const users = new Array();
const numbers = new Array(5);

Array users merupakan array kosong yang belum memiliki element dan jika kita lihat di console akan menghasilkan [].

Pada array numbers, kita menambahkan angka 5 pada constructornya sehingga itu menjadi initial length dari array. Meskipun sudah menetapkan panjangnya 5, kita masih bisa menambahkan dan menghapus element di array numbers tersebut.

Menggunakan sintaks Array.from

Cara lainnya untuk membuat array adalah menggunakan Array.from. Contohnya seperti di bawah ini.

Array.from merupakan method untuk membuat array yang diperkenalkan di ES6. Array.from juga dapat dimanfaatkan untuk menyalin array lainnya seperti berikut ini.

Menggunakan array literal

Terakhir, cara yang paling mudah, singkat, dan disarankan untuk membuat array adalah menggunakan object literals. Membuat array dengan literals lebih disarankan karena lebih sederhana dan mudah untuk dibaca. Contohnya seperti berikut ini.

const array = [];
const fruits = ['apple', 'banana', 'cherry'];

Element yang ada di dalam array literals dipisahkan oleh tanda koma. Element kosong juga dapat ditambahkan di dalam array literals seperti berikut.

Mengakses Element Array

Data di dalam array terurut sehingga untuk mengaksesnya dapat dengan mudah dengan menggunakan nilai indeks-nya. Indeks merupakan angka yang digunakan untuk merujuk ke nilai di dalam array, sehingga kita bisa menambahkan, mengubah, atau menghapus nilainya. Indeks array dimulai dari angka 0. Untuk mengakses nilai di dalam array, gunakan tanda kurung siku [] yang di dalamnya berisi angka yang merupakan posisi dari nilai yang ingin diakses seperti berikut.

Ketika mengakses indeks di luar dari ukuran array akan menghasilkan undefined. Jadi, jangan sampai mengakses array melebihi ukurannya, ya!

Manipulasi Nilai Array

Kita sudah mengetahui cara untuk membuat array. Terkadang, program kita membutuhkan manipulasi array. Jika program Anda membutuhkan itu, tak usah khawatir karena manipulasi nilai pada array dapat dilakukan dengan menggunakan indexing dan method push.

Menggunakan indexing

Misalnya, kita memiliki sebuah array seperti berikut.

let myArray = [1, 2, 3, 4, 5];

Lalu, bagaimana caranya untuk mengubah nilai element ke-2? Perhatikan langkahnya seperti berikut ini.

Pada contoh di atas, mengubah nilai element ke-2 dilakukan dengan menuliskan indeks 1, bukan 2 karena indeks dimulai dari nol. Ingat ya bahwa indeks dalam array dimulai dari nol.

Menggunakan push

Push adalah cara yang kita gunakan untuk menambahkan nilai ke dalam array pada element terakhir. Misalnya kita memiliki array seperti berikut.

let myArray = [1, 2, 3, 4, 5];

Untuk menambahkan nilai ke dalam array menggunakan method push, dapat dilakukan dengan cara menuliskan nama array-nya diikuti tanda titik dan method push beserta nilai yang ingin ditambahkan yaitu 6 seperti berikut.

myArray.push(6);

Nilai yang ditambahkan akan berada di element terakhir.

Menghapus Element dan Data Array

Data pada array dapat dihapus menggunakan keyword delete. Untuk menghapus data yang diinginkan, kita perlu mengetahui nilai indeksnya terlebih dahulu. Contohnya seperti di bawah ini yang akan menghapus data array pada indeks ke-1.

Data pada array sudah berhasil dihapus, tetapi element-nya masih ada. Lalu, bagaimana cara untuk menghapus element dan datanya? Untuk melakukan hal itu dapat dilakukan dengan menggunakan method splice() seperti berikut ini.

Method splice membutuhkan dua parameter yaitu indeks dari element yang ingin dihapus dan jumlah element yang ingin dihapus. Pada contoh di atas, kita menghapus element indeks ke-1 dan jumlah element yang dihapus adalah 1. Lalu, bagaimana caranya kita ingin menghapus dua element dari array?

Berikut adalah caranya.

Terakhir, ada cara lainnya yaitu menggunakan method shift dan pop. Kekurangan dari kedua method ini adalah tidak sefleksibel delete dan splice karena shift hanya menghapus element pertama dan pop menghapus element terakhir.

Array Destructuring

Destructuring digunakan untuk melihat isi dari array. Destructuring cukup mudah dilakukan yaitu dengan menggunakan kurung siku yang di dalamnya adalah nama variabel yang kita assign. Kemudian diikuti dengan assignment operator sama dengan (=) dan array yang ingin diambil nilainya.

Dapat dilihat bahwa variabel greeting didapatkan dari array introduction tanpa harus mengaksesnya menggunakan index. Destructuring array mempermudah kita untuk memecah struktur data menjadi bagian-bagian yang lebih kecil seperti contoh kode di atas. Destructuring array hanya dapat dilakukan jika array tersebut tidak bernilai null atau undefined. Ketika melakukan destructuring pada array yang bernilai null atau undefined akan menyebabkan error.

Array Method

Perlu diketahui bahwa array memiliki banyak sekali method atau fungsi bawaan yang dapat digunakan untuk memudahkan proses pengelolaan atau penggunaannya. Kita hanya akan membahas beberapa method array yang sering digunakan dalam kehidupan sehari-hari oleh programmer JavaScript.

Reverse

Reverse adalah method yang digunakan untuk membalikkan nilai array. Metode reverse() mengembalikan array dengan element yang dibalik.

Element pertama array akan menjadi element terakhir akhir dan sebaliknya. Method reverse tidak akan membuat array baru, tetapi mengatur ulang element tersebut di dalam array yang sudah ada.

Sort

Sort adalah method yang digunakan untuk mengurutkan nilai array. Loh, katanya array sudah menyimpan data secara terurut kok masih perlu mengurutkan array menggunakan sort? Memang array sudah mengurutkan data sesuai dengan indeks-nya tetapi mengurutkan berdasarkan indeks saja belum cukup.

Terkadang, kita butuh untuk mengurutkan array berdasarkan kriteria tertentu sesuai kebutuhan aplikasi. Secara default, array akan diurutkan secara ascending. Contohnya seperti berikut.

Secara default, method sort akan mengurutkan berdasarkan abjadnya.

Menstrukturkan Data dengan Map

Map adalah tipe data yang mirip dengan object yaitu menyimpan data dengan key-value. Kalau sama seperti object, lalu apa fungsinya map? Map berfungsi untuk menutupi kekurangan dari object. Map dapat menggunakan key dengan tipe data apa pun, tidak seperti object yang hanya menerima string. Jadi perbedaan mendasarnya terletak pada key yang digunakan.

Membuat Map

Map dapat dibuat dengan mudah yaitu menggunakan object map constructor seperti berikut ini.

const map = new Map();

Kita telah berhasil membuat map yang bernilai kosong. Selain itu, kita juga dapat menambahkan data di dalam constructor ketika menginisialisasi map seperti berikut.

Menyimpan Nilai di Map

Untuk menyimpan nilai ke dalam map, gunakanlah method set. Set menerima dua nilai yang pertama adalah keynya dan yang kedua adalah valuenya. Set memiliki struktur seperti berikut: set(key, value). Perhatikan contoh berikut ini.

Selain menggunakan string sebagai key pada Map, kita juga dapat menggunakan number sebagai key-nya seperti berikut ini.

Mengakses Nilai di Map

Setelah berhasil menyimpan nilai ke dalam map, kita dapat mengakses nilainya berdasarkan key tertentu dengan method get.

Pada contoh di atas, key-nya adalah name dan nilai yang dikembalikan adalah “aras”.

Menghapus Nilai di Map

Menghapus nilai di map dapat menggunakan method delete. Method ini akan menghapus nilai spesifik berdasarkan key yang kita tentukan.

Kembalian dari method delete akan bernilai true jika element tersedia atau berhasil dihapus. Namun, kembaliannya juga dapat bernilai false jika element yang ingin dihapus tidak ada.

Menstrukturkan Data dengan Set

Terakhir, struktur data yang kita bahas adalah set. Set adalah struktur data yang spesial dibandingkan dengan map, array , dan object . Kenapa dikatakan spesial?

Jawabannya adalah karena set tidak memiliki key dan indeks ketika menyimpan data. Selain itu, data yang disimpan di dalam set akan bernilai unik artinya tidak akan ada data yang duplikat. Spesial bukan?

Membuat Set

Set dapat dibuat dengan cara menuliskan set konstruktor objek seperti contoh berikut ini.

const set = new Set ();

Set juga dapat dibuat dengan nilai seperti berikut ini.

Simpan Nilai di Set

Untuk menambahkan nilai set setelah diinisialisasi dapat menggunakan metode add.

const set = new Set ();    
set . add ( 1 );
set . add ( 2 );

Metode add hanya menerima satu argumen sebagai nilai yang ingin kita tambahkan ke dalam set. Jika kita memberikan nilai yang sama, set hanya akan menyimpan sekali saja. Oleh karena itu, data yang ada di dalam set tidak akan terduplikat.

Dalam contoh kode di atas, perhatikan bahwa ketika menambahkan data yang sama, seperti 'Apple' dan '1' ke dalam set, hanya satu data yang tersimpan.

Mengaksis Nilai di Set

Set memiliki perbedaan untuk cara menemukan nilai yaitu menggunakan perulangan ( looping ). Cara pertama adalah menggunakan kata kunci seperti berikut ini.

Cara lainnya adalah menggunakan kata kunci foreach seperti berikut ini.

Catatan
Perulangan merupakan salah satu bagian dari teknik memanipulasi alur program yang umum dilakukan pada pemrograman. Perulangan akan dibahas secara detail pada modul Sang Pengatur Program.

Menghapus Nilai di Set

Terakhir, untuk menghapus nilai di set, gunakanlah metode delete.

Ingat bahwa set tidak memiliki urutan atau indeks, jadi argumen yang dimasukkan ke dalam fungsi delete adalah nilai yang ingin dihapus, bukan indeks-nya.

Spread Operator

Spread, memiliki arti sesuai dengan namanya, yaitu menyebarkan. Spread operator digunakan untuk menyebarkan nilai yang ada pada object dan array. Spread operator yang ditandai dengan sintaks tiga titik (...) adalah fitur yang menarik dan membantu dalam pengelolaan object dan array. Dengan menggunakan spread operator, nilai object dan array dapat di-iterable menjadi beberapa element.

Object

Spread operator di object dapat dilakukan seperti berikut ini.

Dapat dilihat bahwa spread operator dapat mempermudah menggabungkan dua object. Selain mempermudah menggabungkan object, spread operator juga mempermudah untuk menyalin object seperti berikut ini.

Array

Selain di object, spread operator juga dapat digunakan di array seperti berikut ini.

Untuk menggabungkan dua array menggunakan spread operator cukup mudah, kan? Spread operator juga dapat digunakan untuk menyalin sebuah array seperti berikut.

Spread operator pada dasarnya sama seperti menggunakan looping untuk mendapatkan nilai yang ada di dalam object maupun di dalam array.

Rest Operator

Ketika bekerja dengan function, sering kali function menerima argument yang kemudian menjadi parameter. Ketika argument-nya masih sedikit, seperti satu atau dua belum menimbulkan masalah. Masalah terjadi ketika argument-nya sudah melebihi dua karena terlalu banyak argument pada function membuat kode menjadi tidak bersih (tidak sesuai prinsip clean code) sehingga sulit untuk dibaca dan di-maintenance.

Solusinya adalah menggunakan rest operator. Rest operator memungkinkan function untuk menerima argument dalam bentuk array. Rest operator yang digunakan pada parameter fungsi sering disebut sebagai Rest Parameter. Cara menggunakan rest parameter adalah dengan menambahkan tiga titik (...) sebelum parameter terakhir.

Rest parameter memungkinkan kita untuk menulis argument yang tak terbatas pada function. Rest parameter akan menangani argument tersebut menjadi sebuah array dan meneruskannya ke function. Jika ada parameter lain sebelumnya, nilainya tidak menjadi bagian dari array yang dihasilkan rest parameter.

Karena rest parameter menangani argument sebagai array, method array.length juga dapat digunakan pada rest parameter seperti berikut ini.

Tak hanya method array.length, kita juga dapat menggunakan method array lainnya pada rest parameter.

Selain pada parameter fungsi, rest operator juga kerap digunakan ketika kita melakukan destructuring array untuk menangkap seluruh sisa elemen terakhir dalam bentuk array.

Tak terasa, Anda sudah menguasai struktur data di JavaScript. Menguasai struktur data membuat Anda lebih leluasa dalam menulis program JavaScript karena Anda sudah tahu struktur data apa yang cocok untuk menangani kasus tertentu. Selanjutnya, kita akan bahas mengenai alur program!

Rangkuman Bukan Sembarang Data

Selamat! Anda sudah berada di penghujung modul Bukan Sembarang Data. Mari kita uraikan materi yang sudah Anda pelajari untuk menyegarkan ingatan Anda tentang materi tersebut.

Menstrukturkan Data dengan Object

Struktur data pertama yang kita bahas adalah Object. Object adalah kumpulan pasangan key-value dan merupakan tipe data yang bukan primitif.

Membuat Object

Membuat object dengan object literals sangat mudah yaitu cukup dengan menulis kurung kurawal {}.

const user = {};
const products = { name: 'Sepatu', price: 230000 };

Di dalam kurung kurawal tersebut dapat ditulis properti dari object.

Mengakses Properti di Object

Object yang sudah dibuat dapat diakses dengan 3 teknik.

Mengakses menggunakan dot

Cara pertama untuk mengakses nilai properti yang ada di object adalah menggunakan dot notation (.).

const user = {
  name: 'Dicoding',
  'last name': 'Indonesia',
  age: 9,
};
 
console.log(user.name); // Output: Dicoding

Kita dapat memanggil nama object, kemudian menuliskan tanda titik yang diikuti dengan nama propertinya.

Mengakses menggunakan square bracket

Untuk menutupi kekurangan menggunakan dot notation, ada cara lain yaitu menggunakan square bracket.

const user = {
  name: 'Dicoding',
  'last name': 'Indonesia',
  age: 9,
};
 
console.log(user['last name']); // Output: Indonesia

Tulislah nama object terlebih dahulu dan di dalam kurung siku kita menuliskan nama properti yang ingin diakses.

Mengakses menggunakan object destructuring

Selain itu nilai properti dari object dapat diakses juga dengan cara lainnya yaitu menggunakan object destructuring.

const user = {
  'name': 'Dicoding',
  'lastName': 'Indonesia',
  age: 9
};
 
const { name, lastName } = user;
console.log(name, lastName); // Output: Dicoding Indonesia

Mengubah nilai di properti Object

Memodifikasi object dapat dilakukan dengan assignment operator (=).

const account = {
  balance: 1000,
  debt: 10,
};
 
account.balance = 2000;
console.log(account.balance); // Output: 2000

Menghapus properti di Object

Untuk menghapus properti pada object dapat menggunakan operator delete dengan menuliskan nama object lalu tanda titik dan diikuti nama propertinya.

const user = {
  'name': 'Dicoding',
  'last name': 'Indonesia',
  age: 9,
};
 
delete user.age;
console.log(user); // Output: { name: 'Dicoding', 'last name': 'Indonesia' }

Menstrukturkan Data dengan Array

Array adalah struktur data spesial yang dapat menyimpan kumpulan data yang terurut. Membuat Array dapat dilakukan dengan tiga cara di bawah ini.

Menggunakan object constructor

Array dapat dibuat dengan constructor new Array() seperti berikut.

const users = new Array();
const numbers = new Array(5);

Menggunakan sintaks Array.from

Cara lainnya untuk membuat array adalah menggunakan Array.from. Contohnya seperti di bawah ini.

const foo = Array.from('foo');
console.log(foo); // Output: ['f', 'o', 'o']

Menggunakan array literal

Terakhir, cara yang paling mudah, singkat, dan disarankan untuk membuat array adalah menggunakan object literals.

const array = [];
const fruits = ['apple', 'banana', 'cherry'];

Mengakses Element Array

const myArray = [42, 55, 30];
console.log(myArray[1]); // Output: 55

Manipulasi Nilai Array

Manipulasi nilai pada array dapat dilakukan dengan menggunakan indexing dan method push.

Menggunakan indexing

Misalnya, kita memiliki sebuah array seperti berikut.

const myArray = [1, 2, 3, 4, 5];

Lalu, bagaimana caranya untuk mengubah nilai element ke-2? Perhatikan langkahnya seperti berikut ini.

const myArray = [1, 2, 3, 4, 5];
myArray[1] = 10;
console.log(myArray); // Output: [1, 10, 3, 4, 5]

Menggunakan push

Push adalah cara yang kita gunakan untuk menambahkan nilai ke dalam array pada element terakhir. Misalnya kita memiliki array seperti berikut.

const myArray = [1, 2, 3, 4, 5];

myArray.push(6);

Menghapus Element dan Data Array

Data pada array dapat dihapus menggunakan keyword delete.

const myArray = ['Android', 'Data Science', 'Web'];
delete myArray[1];
 
console.log(myArray); // Output: ['Android', <1 empty item>, 'Web']

Lalu, bagaimana cara untuk menghapus element dan datanya? Untuk melakukan hal itu dapat dilakukan dengan menggunakan method splice() seperti berikut ini.

const myArray = ['Android', 'Data Science', 'Web'];
myArray.splice(1, 1);
console.log(myArray); // Output: ['Android', 'Web']

Terakhir, ada cara lainnya yaitu menggunakan method shift dan pop.

const myArray = ['Android', 'Data Science', 'Web'];
myArray.shift();
console.log(myArray); // Output: ['Data Science', 'Web']
 
const myArray = ['Android', 'Data Science', 'Web'];
myArray.pop();
console.log(myArray); // Output: ["Android", "Data Science"]

Array Destructuring

Destructuring cukup mudah dilakukan yaitu dengan menggunakan kurung siku yang di dalamnya adalah nama variabel yang kita assign. Kemudian diikuti dengan assignment operator sama dengan (=) dan array yang ingin diambil nilainya.

const introduction = ['Hello', 'Arsy'];
const [greeting, name] = introduction;
console.log(greeting); // Output: Hello

Menstrukturkan Data dengan Map

Map adalah tipe data yang mirip dengan object yaitu menyimpan data dengan key-value. Map dapat dibuat dengan mudah yaitu menggunakan object map constructor seperti berikut ini.

const map = new Map();

Menyimpan Nilai di Map

Untuk menyimpan nilai ke dalam map, gunakanlah method set.

const map = new Map();
map.set('name', 'aras');
console.log(map); // Map(1) { 'name' => 'aras' }

Mengakses Nilai di Map

Setelah berhasil menyimpan nilai ke dalam map, kita dapat mengakses nilainya berdasarkan key tertentu dengan method get.

const map = new Map();
map.set('name', 'aras');
console.log(map.get('name')); // Output: aras

Menghapus Nilai di Map

Menghapus nilai di map dapat menggunakan method delete. Method ini akan menghapus nilai spesifik berdasarkan key yang kita tentukan.

const map = new Map();
map.set('name', 'aras');
map.set('last name', 'opraza');
map.delete('last name');
console.log(map); // Map(1) { 'name' => 'aras' }

Menstrukturkan Data dengan Set

Set adalah struktur data yang spesial dibandingkan dengan map, array, dan object. Set dapat dibuat dengan cara menuliskan object constructor set seperti contoh berikut ini.

const set = new Set();

Set juga dapat dibuat beserta dengan nilainya seperti berikut ini.

const mySet = new Set([1, 2, 3]);

Menyimpan Nilai di Set

Untuk menambahkan nilai set setelah diinisialisasi dapat menggunakan method add.

const set = new Set();
set.add(1);
set.add(2);

Mengakses Nilai di Set

Cara pertama adalah menggunakan keyword for seperti berikut ini.

const set = new Set();
set.add(1);
set.add(2);
 
for (const number of set) {
  console.log(number); // Output: 1, 2
}

Cara lainnya adalah menggunakan keyword foreach seperti berikut ini.

const set = new Set();
set.add(1);
set.add(2);
 
set.forEach((value) => console.log(value)); // Output: 1, 2

Menghapus Nilai di Set

Terakhir, untuk menghapus nilai di set, gunakanlah method delete.

const set = new Set();
set.add(1);
set.add(2);
set.delete(1);
 
console.log(set); // Set(1) { 2 }

Spread Operator

Spread operator yang ditandai dengan sintaks tiga titik (...) adalah fitur yang menarik dan membantu dalam pengelolaan object dan array.

Object

Spread operator di object dapat dilakukan seperti berikut ini.

const obj1 = { name: 'Dicoding' };
const obj2 = { lastName: 'Indonesia', address: 'Jl. Batik Kumeli No 50' };
const newObj = { ...obj1, ...obj2 };
console.log(newObj); // Output: { name: 'Dicoding', lastName: 'Indonesia', address: 'Jl. Batik Kumeli No 50' }

Array

Selain di object, spread operator juga dapat digunakan di array seperti berikut ini.

const array1 = ['Dicoding'];
const array2 = ['Indonesia', 'Jl. Batik Kumeli No 50'];
const newArray = [...array1, ...array2];
 
console.log(newArray); // Output: ['Dicoding', 'Indonesia', 'Jl. Batik Kumeli No 50']

Rest Operator

Rest operator memungkinkan function untuk menerima argument dalam bentuk array. Rest operator yang digunakan pada parameter fungsi sering disebut sebagai Rest Parameter. Cara menggunakan rest parameter adalah dengan menambahkan tiga titik (...) sebelum parameter terakhir.

  console.log('manyMoreArgs', manyMoreArgs);
}
 
myFunc('one', 'two', 'three');

Bersambung ke: