Memahami Empat Method Array JavaScript: Push, Pop, Shift dan Unshift

Diterjemahkan dari The four common Javascript array methods Push, Pop, Shift and Unshift

JavaScript memiliki banyak method yang memungkinkan programmer bekerja dengan array. Ada empat method yang paling sering dipakai untuk menambahkan dan menghapus elemen dari sebuah array. Keempat method tersebut adalah push(), pop(), shift(), dan unshift().

Baik programmer pemula maupun yang sudah mahir, terkadang kita tetap tertukar dalam menggunakan keempat method di atas. Artikel ini akan mencoba menyederhanakan konsep mereka dengan gambar dancontoh. Mari kita eksplor satu per satu, lalu kita akan bandingkan kemiripan dan perbedaan masing-masing. Silahkan lihat gambar juga untuk pemahaman yang lebih baik.

1. Push

Seperti yang terlihat pada gambar di atas, method push() menambah satu atau lebih elemen ke akhir sebuah array. Elemen-elemen tersebut dituliskan sebagai parameter saat memanggil method. Dalam dunia komputer, istilah untuk menambahkan sesuatu ke akhir sesuatu yang lain (bisa array, file, atau yang lain) bernama append. Setelah menambahkan elemen-elemen ke akhir suatu array, push() akan mengembalikan nilai berupa jumlah elemen yang ada.

// Syntax: arr.push(item1[, ...[, itemN]])
// Parameters: One or more items
// Return value: the new length of array

let languages = [ "Java", "PHP", "Python" ];
let foo = languages.push("JS");

console.log(foo);
// Output => 4

console.log(languages);
// Output => [ 'Java', 'PHP', 'Python', 'JS' ]

2. Pop

Method pop() merupakan kebalikan dari push(), ia menghapus elemen terakhir dari suatu array dan mengembalikan elemen yang dihapus. Method ini tidak menerima parameter apapun.

// Syntax: arr.pop()
// Return value: the removed element of the array

let languages = ["Java", "PHP", "Python"];
let poppedItem = languages.pop();

console.log(poppedItem);
// Output => Python

console.log(languages);
// Output => [ 'Java', 'PHP' ]

3. Shift

Method shift() mirip dengan pop(), tapi ia menghapus elemen yang pertama dari suatu array dan mengembalikan nilai yang dihapus. Sama juga seperti pop(), method ini tidak menerima parameter apapun.

// Syntax: arr.shift()
// Return value: the removed element of the array

let languages = ["Java", "PHP", "Python"];
let foo = languages.shift();

console.log(foo);
// Output => Java

console.log(languages);
// Output => [ 'PHP', 'Python' ]

4. Unshift

Sama juga seperti method push() yang kita bahas di awal, unshift() akan menambah satu atau lebih elemen ke dalam suatu array, tapi method ini menambahkannya ke awal/depan array yang dalam dunia komputer juga sering disebut sebagai prepend. Setelah menambahkan elemen ke depan array, method unshift() akan menambahkan jumlah baru array yang sudah berubah.

//Syntax: arr.unshift(Item1[, ...[, ItemN]])
// Return value: the new length of the array

let languages = ["Java", "PHP", "Python"];
let foo = languages.unshift("JS");

console.log(foo);
// Output => 4

console.log(languages);
// Output => [ 'JS', 'Java', 'PHP', 'Python' ]

Sampai di sini saya harap konsep keempat method di atas sudah cukup jelas. Mari kita lihat lagi perbandingan keempat method tersebut supaya kita memiliki pemahaman yang lebih baik lagi.

Push & Pop vs Shift & Unshift

Push dan pop berurusan dengan akhir dari suatu array, sedangkan shift dan unshift berurusan dengan bagian awal dari suatu array.

Push vs Pop

• Push untuk menambahkan elemen sedangkan Pop untuk menghapus elemen
• Push memerlukan elemen yang ingin ditambah sebagai parameter saat dipanggil sedangkan Pop tidak memerlukan parameter
• Push mengembalikan jumlah elemen di dalam array setelah ditambahkan sementara Pop mengembalikan konten elemen yang dihapus

Unshift vs Shift

• Unshift untuk menambahkan elemen sementara Shift untuk menghapus elemen
• Unshift memerlukan elemen yang ingin ditambah sebagai parameter saat dipanggil sedangkan Shift tidak memerlukan parameter
• Unshift mengembalikan jumlah elemen di dalam array setelah ditambahkan sementara Shift mengembalikan konten elemen yang dihapus