Apps Artificial Intelligence CSS DevOps Go JavaScript Laravel Linux MongoDB MySQL PHP Python Rust Vue

JavaScript: Array Immutably dengan `toReversed()`

1 min read .
Updated on
JavaScript: Array Immutably dengan `toReversed()`

Kadang saya perlu membalik array tapi tetap menjaga array asli utuh. Nah, toReversed() bikin ini gampang.

1. Dasar toReversed()

let newArray = array.toReversed();
  • Mengembalikan array baru yang terbalik.
  • Array asli tidak berubah.

Contoh:

const originalArray = [1,2,3,4,5];
const reversedArray = originalArray.toReversed();

console.log(reversedArray); // [5,4,3,2,1]
console.log(originalArray); // [1,2,3,4,5]

2. Kenapa toReversed() lebih bagus dari reverse()?

  • reverse() → memodifikasi array asli.
  • toReversed() → tetap immutable, aman untuk data asli.

3. Kombinasi dengan Metode Lain

const numbers = [1,2,3,4,5];
const reversedAndDoubled = numbers.toReversed().map(n => n*2);

console.log(reversedAndDoubled); // [10,8,6,4,2]

4. Kegunaan Real-World

  • UI Rendering: Menampilkan daftar terbalik tanpa merusak data asli.
  • Data Analysis: Analisis kronologis dataset tanpa mengubah array asli.
  • Algoritma: Membutuhkan array terbalik sementara input tetap utuh.

Kesimpulan

toReversed() mempermudah manipulasi array dengan cara immuatable, menjaga data asli tetap utuh. Gini deh, fitur kecil tapi bikin kode lebih bersih dan aman.

JavaScript Array

Lihat Juga

JavaScript `Map.groupBy()`: Kelompokkan Data dengan Mudah
Updated on
JavaScript `Map.groupBy()`: Kelompokkan Data dengan Mudah
Kadang saya harus mengelompokkan array atau objek berdasarkan kategori tertentu. Sebelumnya ribet pakai loop atau reduce, tapi sekarang Map.groupBy() bikin semuanya simpel dan rapi. Apa Itu Map.groupBy()? Mengelompokkan elemen array ke dalam Map. Key → kriteria kelompok, Value → array elemen yang termasuk kelompok itu. Copy const groupedMap = Map.groupBy(array, callback); array → data yang mau dikelompokkan callback → fungsi untuk menentukan key tiap elemen Contoh Penggunaan 1. Group Angka Genap/Ganjil
JavaScript Array Map
JavaScript: Array Immutably dengan `toSorted()`
Updated on
JavaScript: Array Immutably dengan `toSorted()`
Kalau kamu butuh array yang terurut tapi tidak ingin mengubah array asli, toSorted() jawabannya. 1. Dasar toSorted() Copy let sortedArray = array.toSorted([compareFunction]); Mengembalikan array baru yang sudah terurut. Array asli tetap utuh. compareFunction opsional, bisa untuk menentukan urutan custom. Contoh: Copy const numbers = [5,3,8,1]; const sortedNumbers = numbers.toSorted(); console.log(sortedNumbers); // [1,3,5,8] console.log(numbers); // [5,3,8,1] 2. Mengurutkan Objek Copy const students = [ { name: 'Alice', grade: 85 }, { name: 'Bob', grade: 92 }, { name: 'Charlie', grade: 88 } ]; const sortedByGrade = students.toSorted((a,b) => b.grade - a.grade); console.log(sortedByGrade); /* [ { name: 'Bob', grade: 92 }, { name: 'Charlie', grade: 88 }, { name: 'Alice', grade: 85 } ] */ console.log(students); // array asli tetap sama 3. Menggunakan Custom Compare Function Copy const words = ['banana','apple','cherry']; const sortedWords = words.toSorted((a,b) => a.length - b.length); console.log(sortedWords); // ['apple','banana','cherry'] 4. Kegunaan Real-World UI Rendering: Tampilkan daftar atau tabel terurut tanpa mengubah data asli. Data Analysis: Analisis dataset sambil menjaga versi original. Functional Programming: Mendukung prinsip immutable data structures. 5. Catatan Performa toSorted() membuat array baru → butuh memory tambahan. Perhatikan saat array sangat besar.
JavaScript Array
JavaScript: Array Immutably dengan `toSpliced()`
Updated on
JavaScript: Array Immutably dengan `toSpliced()`
Kalau kamu ingin memodifikasi array tapi tetap menjaga array asli, toSpliced() jawabannya. 1. Dasar toSpliced() Copy let newArray = array.toSpliced(start[, deleteCount[, ...items]]); Membuat array baru dengan elemen dihapus atau diganti. Array asli tetap utuh. start: indeks mulai perubahan. deleteCount: jumlah elemen yang dihapus. ...items: elemen yang ditambahkan. Contoh:
JavaScript Array
JavaScript: Cara Cepat Mengelompokkan Data dengan `Object.groupBy()`
Updated on
JavaScript: Cara Cepat Mengelompokkan Data dengan `Object.groupBy()`
Kadang di proyek JS, saya perlu mengelompokkan data biar lebih mudah diproses. Object.groupBy() bikin hidup lebih gampang. 1. Dasar Object.groupBy() Copy Object.groupBy(array, callback); array → data yang mau dikelompokkan callback → menentukan key tiap elemen 2. Contoh Sederhana: Genap/Ganjil Copy const numbers = [1,2,3,4,5,6,7,8,9,10]; const grouped = Object.groupBy(numbers, n => n % 2 === 0 ? 'even' : 'odd'); console.log(grouped); // { even:[2,4,6,8,10], odd:[1,3,5,7,9] } 3. Mengelompokkan Objek Berdasarkan Properti Copy const products = [ {name:'Laptop', category:'Electronics'}, {name:'Shirt', category:'Clothing'}, {name:'Phone', category:'Electronics'} ]; const groupedProducts = Object.groupBy(products, p => p.category); console.log(groupedProducts); // { Clothing:[{…}], Electronics:[{…},{…}] } 4. Grup Berdasarkan Kriteria Kompleks Copy const numbers = [1,5,10,15,20,25,30]; const groupedByRange = Object.groupBy(numbers, n => n <=10 ? '1-10' : n <=20 ? '11-20' : '21-30'); console.log(groupedByRange); 5. Menangani Nilai Kosong atau Tidak Valid Copy const items = [null,'apple',undefined,'banana','']; const groupedItems = Object.groupBy(items, item => item || 'unknown'); console.log(groupedItems); // { apple:['apple'], banana:['banana'], unknown:[null,undefined,''] } 6. Tips & Catatan Simpel & fleksibel: Bisa grup berdasarkan apa saja. Tidak mengubah array asli → aman untuk data asli. Perlu cek kompatibilitas browser → gunakan polyfill jika perlu. Kesimpulan Pada akhirnya, Object.groupBy() bikin pengelompokan data lebih gampang dan readable. Dari angka sampai objek kompleks, tinggal tentukan key, semua otomatis rapi. Gini deh, kadang hal kecil kayak ini bikin manipulasi data jauh lebih efisien.
JavaScript Array
JavaScript: Mengambil Elemen Terakhir dengan `findLast()`
Updated on
JavaScript: Mengambil Elemen Terakhir dengan `findLast()`
Kadang saya perlu cari elemen terakhir yang memenuhi kondisi tertentu di array. findLast() bikin ini gampang tanpa harus reverse array dulu. 1. Dasar findLast() Copy array.findLast(callback(element[, index[, array]])[, thisArg]) callback → fungsi yang dijalankan di tiap elemen sampai cocok. thisArg → opsional, untuk konteks this. Return → elemen terakhir yang cocok, atau undefined. 2. Contoh Dasar Copy const numbers = [1,3,5,8,10,12,7,6]; const lastEven = numbers.findLast(num => num % 2 === 0); console.log(lastEven); // 6 3. Contoh Real-World Transaksi terakhir > 200:
JavaScript Array
JavaScript: Mengambil Index Terakhir dengan `findLastIndex()`
Updated on
JavaScript: Mengambil Index Terakhir dengan `findLastIndex()`
Kadang saya perlu tahu posisi elemen terakhir yang memenuhi kondisi tertentu di array. findLastIndex() bikin ini gampang, tanpa harus reverse array dulu. 1. Dasar findLastIndex() Copy array.findLastIndex(callback(element[, index[, array]])[, thisArg]) callback → fungsi dijalankan di tiap elemen sampai cocok. thisArg → opsional, konteks this. Return → index elemen terakhir yang cocok, atau -1. 2. Contoh Dasar Copy const numbers = [1,3,5,8,10,12,7,6]; const lastEvenIndex = numbers.findLastIndex(num => num % 2 === 0); console.log(lastEvenIndex); // 7 3. Contoh Real-World Transaksi terakhir > 200:
JavaScript Array
chevron-up