Array adalah salah satu konsep Javascript yang paling umum, yang memberi kita banyak kemungkinan untuk bekerja dengan data yang disimpan di dalamnya. Mempertimbangkan bahwa array adalah salah satu topik paling mendasar dalam Javascript yang Anda pelajari di awal jalur pemrograman Anda, dalam artikel ini, saya ingin menunjukkan kepada Anda beberapa trik yang mungkin tidak Anda ketahui dan mungkin sangat membantu dalam pengkodean! Mari kita mulai.

1. Hapus duplikat dari array

Ini adalah pertanyaan wawancara yang sangat populer tentang array Javascript, bagaimana cara mengekstrak nilai unik dari array Javascript. Ini adalah solusi cepat dan mudah untuk masalah ini, Anda dapat menggunakan new Set() untuk tujuan ini. Dan saya ingin menunjukkan dua kemungkinan cara untuk melakukannya, satu dengan metode .from() dan kedua dengan operator spread (…).

var fruits = [“banana”, “apple”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”];

// First method
var uniqueFruits = Array.from(new Set(fruits));
console.log(uniqueFruits); // returns ["banana", "apple", "orange", "watermelon", "grape"]
// Second method
var uniqueFruits2 = […new Set(fruits)];
console.log(uniqueFruits2); // returns ["banana", "apple", "orange", "watermelon", "grape"]

Terkadang perlu mengganti nilai tertentu dalam array saat membuat kode, dan ada metode singkat yang bagus untuk melakukannya yang mungkin belum Anda ketahui. Untuk ini, kita dapat menggunakan .splice(start, value to remove, valueToAdd) dan meneruskan ke sana ketiga parameter yang menentukan di mana kita ingin memulai modifikasi, berapa banyak nilai yang ingin kita ubah dan nilai baru.

var fruits = [“banana”, “apple”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”];
fruits.splice(0, 2, “potato”, “tomato”);
console.log(fruits); // returns [“potato”, “tomato”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”]

Mungkin semua orang tahu .map() metode array, tetapi ada solusi berbeda yang dapat digunakan untuk mendapatkan efek serupa dan kode yang sangat bersih juga. Kita dapat menggunakan metode .from() untuk tujuan ini.

var friends = [
    { name: ‘John’, age: 22 },
    { name: ‘Peter’, age: 23 },
    { name: ‘Mark’, age: 24 },
    { name: ‘Maria’, age: 22 },
    { name: ‘Monica’, age: 21 },
    { name: ‘Martha’, age: 19 },
]

var friendsNames = Array.from(friends, ({name}) => name);
console.log(friendsNames); // returns ["John", "Peter", "Mark", "Maria", "Monica", "Martha"]

Apakah Anda memiliki array yang penuh dengan elemen tetapi Anda perlu membersihkannya untuk tujuan apa pun, dan Anda tidak ingin menghapus item satu per satu? Sangat mudah melakukannya dalam satu baris kode. Untuk mengosongkan array, Anda perlu menyetel panjang array ke 0, dan selesai!

var fruits = [“banana”, “apple”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”];

fruits.length = 0;
console.log(fruits); // returns []

Kebetulan kita memiliki larik, tetapi untuk beberapa tujuan, kita memerlukan objek dengan data ini, dan cara tercepat untuk mengubah larik menjadi objek adalah dengan menggunakan operator sebaran yang terkenal (…).

var fruits = [“banana”, “apple”, “orange”, “watermelon”];
var fruitsObj = { …fruits };
console.log(fruitsObj); // returns {0: “banana”, 1: “apple”, 2: “orange”, 3: “watermelon”, 4: “apple”, 5: “orange”, 6: “grape”, 7: “apple”}

Ada beberapa situasi ketika kita membuat larik, dan kita ingin mengisinya dengan beberapa data, atau kita membutuhkan larik dengan nilai yang sama, dan dalam hal ini metode .fill() hadir dengan solusi yang mudah dan bersih.

var newArray = new Array(10).fill(“1”);
console.log(newArray); // returns [“1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”]

Apakah Anda tahu cara menggabungkan array menjadi satu array yang tidak menggunakan metode .concat()? Ada cara sederhana untuk menggabungkan sejumlah array menjadi satu dalam satu baris kode. Seperti yang mungkin Anda sadari sudah menyebar operator (…) cukup berguna saat bekerja dengan array dan itu sama dalam kasus ini.

var fruits = [“apple”, “banana”, “orange”];
var meat = [“poultry”, “beef”, “fish”];
var vegetables = [“potato”, “tomato”, “cucumber”];
var food = […fruits, …meat, …vegetables];
console.log(food); // [“apple”, “banana”, “orange”, “poultry”, “beef”, “fish”, “potato”, “tomato”, “cucumber”]

Ini juga merupakan salah satu tantangan paling populer yang dapat Anda hadapi dalam setiap wawancara Javascript karena menunjukkan apakah Anda dapat menggunakan metode array dan apa logika Anda. Untuk menemukan persimpangan dua array, kami akan menggunakan salah satu metode yang ditunjukkan sebelumnya dalam artikel ini, untuk memastikan bahwa nilai dalam array yang kami periksa tidak terduplikasi dan kami akan menggunakan metode .filter dan metode .includes. Hasilnya, kita akan mendapatkan larik dengan nilai yang disajikan di kedua larik. Periksa kodenya:

var numOne = [0, 2, 4, 6, 8, 8];
var numTwo = [1, 2, 3, 4, 5, 6];
var duplicatedValues = […new Set(numOne)].filter(item => numTwo.includes(item));
console.log(duplicatedValues); // returns [2, 4, 6]

Pertama, mari kita definisikan nilai-nilai palsu. Dalam Javascript, nilai falsy adalah false, 0, „”, null, NaN, undefined. Sekarang kita bisa mengetahui cara menghapus nilai-nilai semacam ini dari array kita. Untuk mencapai ini, kita akan menggunakan metode .filter().

var mixedArr = [0, “blue”, “”, NaN, 9, true, undefined, “white”, false];
var trueArr = mixedArr.filter(Boolean);
console.log(trueArr); // returns [“blue”, 9, true, “white”]

Terkadang kita perlu memilih nilai dari array secara acak. Untuk membuatnya dengan cara yang mudah, cepat, dan singkat serta menjaga kode kita tetap bersih, kita bisa mendapatkan nomor indeks acak sesuai dengan panjang array. Mari kita lihat kodenya:

var colors = [“blue”, “white”, “green”, “navy”, “pink”, “purple”, “orange”, “yellow”, “black”, “brown”];
var randomColor = colors[(Math.floor(Math.random() * (colors.length)))]

Saat kita perlu membalik array kita, tidak perlu membuatnya melalui loop dan fungsi yang rumit, ada metode array mudah yang melakukan semuanya untuk kita, dan dengan satu baris kode, array kita mungkin terbalik. Mari kita periksa:

var colors = [“blue”, “white”, “green”, “navy”, “pink”, “purple”, “orange”, “yellow”, “black”, “brown”];
var reversedColors = colors.reverse();
console.log(reversedColors); // returns [“brown”, “black”, “yellow”, “orange”, “purple”, “pink”, “navy”, “green”, “white”, “blue”]

Dalam Javascript, ada metode menarik yang memungkinkan Anda menemukan indeks kejadian terakhir dari elemen yang diberikan. Misalnya, jika array kita memiliki nilai duplikat, kita dapat menemukan posisi kejadian terakhirnya. Mari kita lihat contoh kodenya:

var nums = [1, 5, 2, 6, 3, 5, 2, 3, 6, 5, 2, 7];
var lastIndex = nums.lastIndexOf(5);
console.log(lastIndex); // returns 9

Tantangan lain yang sangat sering terjadi selama wawancara Javascript Engineer. Tidak ada yang menakutkan datang ke sini; itu dapat diselesaikan dengan menggunakan metode .reduce dalam satu baris kode. Mari kita periksa kodenya:

var nums = [1, 5, 2, 6];
var sum = nums.reduce((x, y) => x + y);
console.log(sum); // returns 14

Tingkatkan Pengkodean

Terima kasih telah menjadi bagian dari komunitas kami! Sebelum kamu pergi:

• Tepuk tangan untuk ceritanya dan ikuti penulisnya
• Lihat lebih banyak konten di publikasi Level Up Coding
• Ikuti kami: Twitter | LinkedIn | Buletin