Berkenalan Lagi Dengan Javascript: Object & Array

Object

Object pada Javascript mirip dengan:

  • Dictionaries di python
  • Hashes pada Perl dan Ruby.
  • Hash tables di C dan C++.
  • HashMaps di Java.
  • Associative arrays pada PHP.

Faktanya, struktur data seperti ini banyak digunakan karena fleksibilitasnya. Bagian ‘name’ dari Object merupakan string sedangkan value dapat berupa ‘Javascript Value’ apapun, ataupun Object lain.

Ada 2 cara untuk dapat membuat Object baru pada Javascript.

let obj = new Object();

Dan

let obj = {};

Tidak ada perbedaan hasil dari kedua cara di atas. Cara kedua biasa disebut object literal syntax. Syntax kedua juga merupakan format utama JSON. Object literal syntax dapat digunakan untuk membuat keseluruhan Object seperti:

let obj = {
  name: 'Carrot',
  for: 'Max', // 'for' merupakan reserved word, sebaiknya gunakan '_for'.
  details: {
    color: 'orange',
    size: 12
  }
}

Attribut pada objek dapat diakses secara berantai

obj.details.color; // orange
obj['details']['size']; // 12

Contoh berikut merupakan contoh pembuatan Object prototype, Person, dan instance dari prototype tersebut.

function Person(name, age) {
  this.name = name;
  this.age = age;
}

// Define an object
var you = new Person('You', 24);
// Membuat Person dengan "You"

Setelah dibuat object properties dapat diakses dengan dua cara:

you.name = 'Simon';
var name = you.name;

// Atau

you['name'] = 'Simon';
var name = you['name'];

Cara kedua memiliki kelebihan dimana nama dari property diberikan sebagai string, yang berarti dapat dihasilkan dari kalkulasi atau proses saat runtime. Tetapi cara tersebut membuat optimalisasi yang dilakukan beberapa javascript minifier tidak dapat dilakukan. Kelebihan dari cara ke dua di atas adalah memungkinkan untuk menggunakan reserved words

obj.for    = 'Simon'; // Syntax error, 'for' merupakan reserved word
obj['for'] = 'Simon'; // works fine

Array

Array (Larik dalam bahasa Indonesia) pada Javascript merupakan object spesial dengan key berupa angka. Array bekerja seperti halnya Object, numerical properties dapat diakses dengan [ ]. Array memiliki magic property length yang tidak dimiliki Object, length selalu bernilai lebih 1 dari index tertinggi pada Array.

var a = new Array();
a[0] = 'dog';
a[1] = 'cat';
a[2] = 'hen';
a.length; // 3

Atau dengan menggunakan array literal:

var a = ['dog', 'cat', 'hen'];
a.length; // 3

Sebagai catatan, Array.length tidak selalu sama dengan item di dalam Array. Karenga length selalu lebih besar 1 angka terhadap index tertinggi

var a = ['dog', 'cat', 'hen'];
a[100] = 'fox';
a.length; // 101

typeof a[90]; // undefined

Looping terhadap array dapat dilakukan dengan for:

for (var i = 0; i < a.length; i++) {
  // Do something with a[i]
}

Atau dengan for ... in, tetapi apabila melakukan iterasi menggunakan for ... in property yang ditambahkan pada Array.prototype juga akan ikut diiterasi. Cara lain untuk melakukan iterasi pada Array adalah menggunakan forEach yang ditambahkan pada ECMAScript 5

['dog', 'cat', 'hen'].forEach(function(currentValue, index, array) {
  // Do something with currentValue or array[index]
});

Catatan Lainnya:

  1. Berkenalan Lagi Dengan Javascript: Types
  2. Berkenalan Lagi Dengan Javascript: Variable & Operator
  3. Berkenalan Lagi Dengan Javascript: Control Structures
  4. Berkenalan Lagi Dengan Javascript: Object & Array