JavaScript Data Structures

📌 Elements

💡 Fundamental Data Structures

JavaScript menyediakan berbagai struktur data bawaan untuk menyimpan dan mengorganisasi data. Memahami struktur data adalah kunci untuk menulis kode yang efisien.

data-structures.js

          
            // Array - Ordered collection

            const fruits = ['Apple', 'Banana', 'Cherry'];

            // Object - Key-value pairs

            const person = {

              name: 'John',

              age: 30,

              isAdmin: true

            };

            // Set - Unique values

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

            // Map - Keyed collections

            const userMap = new Map();

            userMap.set('name', 'Alice');

            userMap.set('age', 25);

📝 Penjelasan Detail:

• Array - Koleksi terurut dengan indeks numerik
• Object - Key-value pairs untuk data terstruktur
• Set - Nilai unik tanpa duplikat
• Map - Koleksi terurut dengan berbagai tipe key
• WeakMap/WeakSet - Untuk memory management yang lebih baik

🛠️ Features

data-operations.js

          
            // Array methods

            fruits.push('Durian'); // Add to end

            fruits.pop(); // Remove from end

            fruits.map(fruit => fruit.toUpperCase());

            // Object operations

            const name = person.name; // Dot notation

            const age = person['age']; // Bracket notation

            const keys = Object.keys(person);

            // Set operations

            uniqueNumbers.add(4);

            uniqueNumbers.has(2); // true

            uniqueNumbers.delete(1);

ℹ️ Browser Support

Semua struktur data dasar didukung oleh semua browser modern. Map/Set didukung sejak ES6 (Chrome 51+, Firefox 53+, Edge 15+, Safari 10+).

📊 Basic Tables

Structure	Use Case	Mutability	Performance
`Array`	Daftar terurut, sering diubah	Mutable	O(1) access, O(n) search
`Object`	Data terstruktur, key-value	Mutable	O(1) access by key
`Set`	Koleksi nilai unik	Mutable	O(1) for add/delete/has
`Map`	Key-value dengan berbagai tipe key	Mutable	O(1) for operations

📝 Penjelasan Detail:

• Array - Ideal untuk koleksi yang sering diakses secara berurutan
• Object - Terbaik untuk data terstruktur dengan properti tetap
• Set - Sempurna untuk memastikan keunikan nilai
• Map - Fleksibel dengan berbagai tipe key dan mempertahankan urutan

🚀 Advanced Table

Method Array Set Map

Add item push(), unshift() add() set()

Remove item pop(), shift() delete() delete()

Check existence includes() has() has()

Size length size size

Iteration forEach(), map() forEach() forEach()

ℹ️ Performance Notes

Untuk operasi pencarian yang sering, Set/Map lebih efisien (O(1)) dibanding Array (O(n)). Gunakan struktur data yang sesuai dengan kebutuhan performa.

💡 Pro Tips

🎯 Best Practices

Pilih struktur data berdasarkan kebutuhan: Array untuk koleksi terurut, Object untuk data terstruktur, Set untuk nilai unik, Map untuk key-value kompleks.

best-practices.js

// ✅ Good - Use Map for dynamic key-value pairs const userSettings = new Map(); userSettings.set('theme', 'dark'); userSettings.set('notifications', true); // ✅ Good - Use Set for unique values const uniqueTags = new Set(['js', 'web', 'js']); // ❌ Avoid - Using arrays for unique values const tags = ['js', 'web', 'js']; const uniqueTags = [...new Set(tags)];

📝 Penjelasan Detail:

• Gunakan Map bukan Object ketika key bersifat dinamis atau berbagai tipe
• Gunakan Set bukan Array ketika perlu menjamin keunikan nilai
• Pertimbangkan performa untuk operasi yang sering dilakukan
• Gunakan WeakMap/WeakSet untuk memory-sensitive applications
• ES6+ features memberikan solusi yang lebih elegan

🌐 Info

📚 Referensi Tambahan

Untuk mempelajari lebih dalam tentang struktur data JavaScript, kunjungi dokumentasi MDN Web Docs atau buku-buku algoritma populer.

⚙️ ECMAScript Compatibility

Map/Set diperkenalkan di ES6 (2015). Beberapa method seperti Array.includes() ditambahkan di ES7 (2016). Pastikan kompatibilitas browser target Anda.

Method	Array	Set	Map
Add item	`push()`, `unshift()`	`add()`	`set()`
Remove item	`pop()`, `shift()`	`delete()`	`delete()`
Check existence	`includes()`	`has()`	`has()`
Size	`length`	`size`	`size`
Iteration	`forEach()`, `map()`	`forEach()`	`forEach()`