JavaScript - Struktur Data

Manfaat Struktur Data

• Mengatur dan menggunakan data yang cukup banyak
• Mencari data dari basis data yang ada
• Mempermudah dan Mempercepat proses data

(TL;DR) Struktur Data

• Tipe Data tingkat tinggi (non-primitif) di dalam JS

Array (ii)

• Cara aksesnya dengan menggunakan index, suatu urutan angka, yang dimulai dari 0 (nol)
• Memiliki beberapa fungsi bawaan yang bisa mempermudah developer dalam mengakses dan memodifikasi array yang dibuat

Visualisasi & Penulisan Array

// cara penulisan array secara langsung
const arr = [100, 200, 300];

// cara penulisan inisialisasi array yang tidak diketahui jumlahnya
const arr2 = [];

// cara menambahkan array secara manual
arr2[0] = 100;
arr2[1] = 200;
arr2[2] = 300;

// cara menambahkan nilai baru pada array di posisi terakhir
arr2.push(400);

Array 2 Dimensi (Nested Array)

// inisialisasi array
const sheet = [];

// deklarasi baris pada array
sheet[0] = [];
sheet[1] = [];
sheet[2] = [];

// deklarasi kolom pada array
sheet[0][0] = 100; sheet[0][1] = 200; sheet[0][2] = 300;
sheet[1][0] = 400; sheet[1][1] = 500; sheet[1][2] = 600;
sheet[2][0] = 700; sheet[2][1] = 800; sheet[2][2] = 900;

Tantangan: Array

• Harus menggunakan fungsi push
• Tidak boleh ada akses secara langsung x[0] = yyy;

Metode Bawaan Array

Array juga memiliki banyak sekali metode bawaan yang bisa mempermudah hidup

Cara Penulisan Object

// cara penulisan object dengan menggunakan { ... }
const kucing = {
  nama: "Whiskas",
  warna: "Hitam",
  jumlahKaki: 4
};

// cara penulisan object dengan menggunakan new Object()
const kucing2 = new Object();

kucing2.nama = "Me-O";
kucing2.warna = "Belang";
kucing2.jumlahKaki = 4;

Mudah sekali bukan?

Namun dunia tidak seindah itu Ferguso

Waduh

Kenyataan Dunia yang Pahit

• Umumnya data memang dibuat dalam bentuk array dan object
• Hanya saja akan sangat umum menemukan data GABUNGAN keduanya (beserta gabungan data primitif lainnya)

Contoh data Gabungan

const response = {
  statusCode: 200,
  endpoint: 'GET /api/v1/dummies',
  body: {
    message: 'Hello World',
    data: [
      { id: 1, name: 'Andre', age: 20 },
      { id: 2, name: 'Bella', age: 21 },
      { ... },
   ],
  totalData: 100
  responseTime: '1506ms'
};

Penggunaan Map

// inisialisasi objek
const obj = {'a': 1, 'b': 2, 'c': 3};
// inisialisasi Map
let map = new Map();

// menambahkan data
map.set('halo', 'dunia');
map.set(1, 'satu');
map.set(obj, 'lho ini bisa?');

// mengakses data
console.log(map.get('halo'));
console.log(map.get(1));
console.log(map.get(obj));

Penggunaan Set

// inisialisasi Set
let set = new Set();

let muridPertama = { nama: 'Mari' };
let muridKedua = { nama: 'Regal' };

// memasukkan data ke dalam set
set.add(muridPertama);
set.add(muridKedua);
set.add(muridPertama);

console.log(set.size); // tetap 2, bukan 3