Objek JavaScript: Pengertian dan Contoh Penggunaan

Created at by Aris Munandar

Objek (object) adalah salah satu konsep paling penting dalam JavaScript. Jika diibaratkan dalam kehidupan nyata, objek adalah sebuah “benda” yang memiliki ciri-ciri (property) dan kemampuan (method). Dalam pemrograman, konsep ini membuat JavaScript lebih fleksibel, mudah dibaca, dan sangat kuat digunakan di berbagai kebutuhan, mulai dari membuat aplikasi web, menyimpan data, hingga membangun struktur program yang kompleks.

Baca juga: Tutorial Array JavaScript Lengkap Dengan Contoh

Pengantar & Dasar-Dasar Objek JavaScript

Di bagian ini, kita akan membahas fondasi dari objek JavaScript, sehingga pemula dapat memahami apa itu objek, bagaimana cara membuatnya, dan bagaimana menggunakannya dengan benar.

1. Pengertian Objek JavaScript

Objek JavaScript adalah struktur data yang digunakan untuk menyimpan berbagai pasangan key: value. Value tersebut bisa berupa tipe data apa pun: string, number, boolean, function, array, atau bahkan objek lainnya.

Contoh pengertian sederhana:

  • Objek = kumpulan data
  • Property = data
  • Method = fungsi yang berada dalam objek

Contoh singkat:

const mobil = {
    merk: "Toyota",
    warna: "Putih",
    nyalakan: function () {
        console.log("Mobil dinyalakan");
    }
};Code language: JavaScript (javascript)

2. Kenapa Objek Penting dalam JavaScript

Objek menjadi dasar dari hampir semua hal dalam JavaScript. Bahkan array dan function pun sebenarnya adalah objek. Beberapa alasan objek sangat penting:

  • Memudahkan menyimpan data kompleks
  • Bisa menampung banyak tipe data
  • Menghubungkan data dan fungsi dalam satu tempat
  • Dasar dari konsep OOP (Object-Oriented Programming)
  • Banyak fitur bawaan JavaScript menggunakan objek (DOM, console, Math, dll)
  • Dengan memahami objek, kamu otomatis akan lebih mudah mempelajari topik lain di JavaScript.

3. Perbedaan Objek vs Tipe Data Primitif

Tipe data primitif bersifat immutable (tidak dapat diubah langsung) dan disimpan berdasarkan nilai.

Sedangkan objek bersifat mutable (bisa diubah) dan disimpan berdasarkan reference.

Tipe Data PrimitifObjek
String, number, boolean, null, undefined, symbol, bigintSemua bentuk struktur data kompleks
ImmutableMutable
Disimpan sebagai nilaiDisimpan sebagai referensi memori
Tidak memiliki propertyMemiliki property & method

Contoh primitif:

let nama = "Budi";
nama.toUpperCase(); // tidak mengubah variabel asli
console.log(nama); // tetap "Budi"Code language: JavaScript (javascript)

Contoh objek:

let orang = { nama: "Budi" };
orang.nama = "Andi"; // property bisa diubah
console.log(orang.nama); // "Andi"Code language: JavaScript (javascript)

4. Struktur Dasar Object JavaScript

Struktur dasar objek menggunakan pasangan key: value di dalam kurung kurawal { }.

const objectName = {
    key1: value1,
    key2: value2,
    key3: value3
};Code language: JavaScript (javascript)
  • Key → nama property
  • Value → isi property (string, number, function, array, dll)

5. Property dan Method

Property adalah data dalam objek.

Method adalah fungsi yang berada di dalam objek.

Contoh:

const mobil = {
    merk: "Toyota",
    warna: "Putih",
    nyalakan: function () {
        console.log("Mobil dinyalakan");
    }
};Code language: JavaScript (javascript)
  • merk → property
  • warna → property
  • nyalakan → method

Cara memanggil method:

mobil.nyalakan();Code language: CSS (css)

6. Cara Kerja Objek dan Reference

Ketika objek disimpan dalam variabel, yang disimpan sebenarnya hanya referensi, bukan isinya.

Contoh:

const a = { nama: "Siti" };
const b = a;

b.nama = "Rani";

console.log(a.nama); // "Rani"Code language: JavaScript (javascript)

Karena a dan b menunjuk ke referensi yang sama.

7. Dasar Object Literal JavaScript

Object literal adalah cara paling umum membuat objek dengan menuliskan kurung kurawal langsung.

const user = {
    nama: "Dewi",
    umur: 25,
    aktif: true
};Code language: JavaScript (javascript)

Object literal ini memiliki tiga property: nama, umur, dan aktif.

Ini adalah cara paling mudah dan paling sering digunakan oleh developer.

8. Contoh Objek JavaScript Sederhana

const buku = {
    judul: "Belajar JavaScript",
    penulis: "Aris Munandar",
    tahun: 2024,
    deskripsi: function () {
        console.log(`Buku ${this.judul} ditulis oleh ${this.penulis}`);
    }
};

buku.deskripsi();Code language: JavaScript (javascript)

Output:

Buku Belajar JavaScript ditulis oleh Aris Munandar

9. Mengakses Property (Dot & Bracket Notation)

Dot Notation

Yang paling umum:

console.log(buku.judul);Code language: CSS (css)

Bracket Notation

Biasanya digunakan ketika key berupa string dinamis:

console.log(buku["penulis"]);Code language: CSS (css)

Contoh menggunakan variabel sebagai key:

const key = "tahun";
console.log(buku[key]);Code language: JavaScript (javascript)

10. Mengubah dan Menghapus Property

Mengubah Property

buku.judul = "Belajar JavaScript Modern";Code language: JavaScript (javascript)

Menambah Property

buku.kategori = "Programming";Code language: JavaScript (javascript)

Menghapus Property

delete buku.tahun;Code language: JavaScript (javascript)

Cara Membuat Objek JavaScript dan Teknik Dasar Penggunaan

Pada bagian ini, kita akan masuk ke inti utama cara membuat objek dalam JavaScript dan teknik dasar penggunaannya. Semua konsep di bagian ini sangat penting karena inilah pondasi pembuatan struktur data dan pemrograman berbasis objek (OOP) di JavaScript.

Kita akan membahas banyak hal, dari yang paling sederhana sampai yang mulai masuk ke level menengah: object literal, constructor, nested object, destructuring, hingga fitur keamanan seperti Object.freeze.

1. Object Literal

Object literal adalah cara paling mudah dan paling umum untuk membuat objek dalam JavaScript.

Caranya cukup menggunakan kurung kurawal { } dan mengisi property di dalamnya.

Contoh:

const user = {
    nama: "Dina",
    umur: 21,
    aktif: true
};Code language: JavaScript (javascript)

Keuntungan object literal:

  • Simple & cepat dibuat
  • Cocok untuk objek yang tidak terlalu rumit
  • Mudah dibaca dan digunakan

2. Object Constructor

Cara lain membuat objek adalah dengan menggunakan constructor bawaan new Object().

const produk = new Object();
produk.nama = "Laptop";
produk.harga = 15000000;
produk.stok = 10;Code language: JavaScript (javascript)

Namun, cara ini kurang populer, karena object literal jauh lebih mudah dan bersih. Tetapi tetap penting untuk dikenali.

3. Constructor Function (Cara Lama Membuat Class)

Sebelum JavaScript memiliki sintaks class modern, developer menggunakan constructor function.

Contoh:

function Mahasiswa(nama, jurusan) {
    this.nama = nama;
    this.jurusan = jurusan;
    this.perkenalan = function () {
        console.log(`Halo, saya ${this.nama} dari jurusan ${this.jurusan}`);
    };
}

const mhs1 = new Mahasiswa("Rina", "Informatika");
mhs1.perkenalan();Code language: JavaScript (javascript)

Output:

Halo, saya Rina dari jurusan Informatika

Keuntungan constructor function:

  • Bisa menciptakan banyak objek dengan struktur yang sama
  • Mendukung konsep OOP
  • Mendukung prototype
  • Ini adalah pondasi sebelum ES6 memperkenalkan class.

4. Keyword this pada Objek

this merujuk pada objek yang sedang dipanggil, bukan objek yang membuatnya.

Contoh dasar:

const siswa = {
    nama: "Rudi",
    salam: function () {
        console.log(`Halo, nama saya ${this.nama}`);
    }
};

siswa.salam();Code language: JavaScript (javascript)

Output:

Halo, nama saya Rudi

Penjelasan:

  • this.nama mengacu ke siswa.nama

Keuntungan this:

  • Membuat kode lebih dinamis
  • Membuat kode lebih mudah dipahami
  • Membuat kode lebih mudah di-maintain

5. Nested Object (Objek di dalam Objek)

Nested object adalah objek yang memiliki objek lain sebagai property-nya.

Contoh:

const toko = {
    nama: "Toko Makmur",
    alamat: {
        jalan: "Jl. Kenanga No. 10",
        kota: "Bandung",
        kodePos: 40123
    }
};

console.log(toko.alamat.kota);Code language: JavaScript (javascript)

Output:

Bandung

Nested object umum digunakan untuk struktur data lebih kompleks, seperti data user, produk, dan konfigurasi aplikasi.

6. Cara Menambah Property ke Objek

Anda bisa menambah property kapan pun, karena objek bersifat dinamis.

const hewan = {
    jenis: "Kucing"
};

hewan.nama = "Miko";       // menambah property
hewan.umur = 2;

console.log(hewan);Code language: JavaScript (javascript)

Output:

{ jenis: 'Kucing', nama: 'Miko', umur: 2 }Code language: CSS (css)

Bahkan kita bisa menambah property menggunakan bracket:

hewan["warna"] = "Putih";Code language: JavaScript (javascript)

Output:

{ jenis: 'Kucing', nama: 'Miko', umur: 2, warna: 'Putih' }Code language: CSS (css)

7. Cara Membuat Method dalam Objek

Method adalah fungsi yang ada di dalam objek.

Contoh:

const kalkulator = {
    tambah: function (a, b) {
        return a + b;
    },
    kali: function (a, b) {
        return a * b;
    }
};

console.log(kalkulator.tambah(5, 2));
console.log(kalkulator.kali(4, 3));Code language: JavaScript (javascript)

Output:

7
12

Method memungkinkan objek memiliki “kemampuan”.

8. Object.freeze dan Object.seal

Fitur ini digunakan untuk mengatur keamanan objek dan mencegah perubahan yang tidak diinginkan.

Object.freeze()

Membuat objek tidak bisa ditambah, diubah, dan dihapus.

const config = {
    tema: "dark",
    bahasa: "id"
};

Object.freeze(config);
config.tema = "light"; // tidak berubahCode language: JavaScript (javascript)

Object.seal()

Objek masih bisa diubah, tetapi tidak bisa ditambah atau dihapus.

const profil = {
    nama: "Rani",
    umur: 20
};

Object.seal(profil);
profil.umur = 21; // bisa diubah
profil.alamat = "Jakarta"; // gagal ditambah

console.log(profil);Code language: JavaScript (javascript)

Output:

{ nama: 'Rani', umur: 21 }Code language: CSS (css)

9. Destructuring Object

Destructuring adalah cara cepat untuk mengambil property dari objek.

Contoh:

const film = {
    judul: "Naruto",
    genre: "Action",
    tahun: 2002
};

const { judul, genre } = film;

console.log(judul);
console.log(genre);Code language: JavaScript (javascript)

Output:

Naruto
Action

Bahkan nested object bisa di-destructure:

const user = {
    nama: "Dika",
    kontak: {
        email: "dika@example.com",
        hp: "08123456789"
    }
};

const { kontak: { email } } = user;

console.log(email);Code language: JavaScript (javascript)

Output:

dika@example.comCode language: CSS (css)

10. Contoh Penggunaan Object JavaScript dalam Program

Contoh mini program: data produk sederhana

const produk = {
    nama: "Kopi Hitam",
    harga: 15000,
    stok: 30,
    beli: function (jumlah) {
        if (jumlah > this.stok) {
            console.log("Stok tidak mencukupi!");
        } else {
            this.stok -= jumlah;
            console.log(`Anda membeli ${jumlah} kopi. Sisa stok: ${this.stok}`);
        }
    }
};

produk.beli(3);Code language: JavaScript (javascript)

Output:

Anda membeli 3 kopi. Sisa stok: 27

Contoh di atas menunjukkan bagaimana objek:

  • Menyimpan data
  • Mengelola state (stok)
  • Memiliki method (beli)
  • Mengubah data secara dinamis

Demikian tutorial mengenai object di JavaScript. Object adalah bagian yang sangat penting karena sifatnya yang fleksibel dan dinamis, dapat melakukan pertukaran data dalam jumlah yang besar dan kompleks.

Method Bawaan Object & Manipulasi Lanjutan

Pada bagian ini, kita masuk ke level yang jauh lebih dalam mengenai objek dalam JavaScript. Di sini kamu akan belajar berbagai built-in methods yang sangat sering dipakai untuk memanipulasi objek, mengubahnya menjadi array, melakukan cloning, bahkan memahami konsep dasar prototype dan inheritance, yang merupakan fondasi dari OOP (Object-Oriented Programming) di JavaScript.

1. Object.assign()

Object.assign() digunakan untuk:

  • Menggabungkan beberapa objek
  • Menyalin (clone) objek
  • Membuat salinan shallow copy

Cara penggunaan dasar:

const user = { nama: "Rudi" };
const info = { umur: 20 };

const hasil = Object.assign({}, user, info);

console.log(hasil);Code language: JavaScript (javascript)

Output:

{ nama: 'Rudi', umur: 20 }Code language: CSS (css)

Kenapa pakai objek {} kosong?

Karena:

  • Jika tidak, objek pertama akan tertimpa (mutasi).
  • {} membuat hasil menjadi salinan baru, bukan memodifikasi objek asli.

2. Object.keys()

Object.keys() mengembalikan array berisi semua nama property dalam objek.

const produk = {
    nama: "Keyboard",
    harga: 300000,
    stok: 12
};

console.log(Object.keys(produk));Code language: JavaScript (javascript)

Output:

[ 'nama', 'harga', 'stok' ]Code language: JSON / JSON with Comments (json)

Ini sering digunakan untuk looping objek.

3. Object.values()

Mengembalikan semua nilai dari property objek dalam bentuk array.

console.log(Object.values(produk));Code language: JavaScript (javascript)

Output:

[ 'Keyboard', 300000, 12 ]Code language: JSON / JSON with Comments (json)

Ketika hanya butuh nilainya, gunakan ini.

4. Object.entries()

Menghasilkan array dua dimensi:

[ [key, value], [key, value], ... ]Code language: JSON / JSON with Comments (json)
console.log(Object.entries(produk));Code language: JavaScript (javascript)

Output:

[
    ["nama", "Keyboard"],
    ["harga", 300000],
    ["stok", 12]
]Code language: JSON / JSON with Comments (json)

Cocok untuk:

  • Konversi ke Map
  • Iterasi lebih fleksibel

5. Mengubah Objek Menjadi Array

Ada beberapa cara, di antaranya:

1. Dengan Object.keys()

const keys = Object.keys(produk);Code language: JavaScript (javascript)

Output:

[ 'nama', 'harga', 'stok' ]Code language: JSON / JSON with Comments (json)

2. Dengan Object.values()

const values = Object.values(produk);Code language: JavaScript (javascript)

Output:

[ 'Keyboard', 300000, 12 ]Code language: JSON / JSON with Comments (json)

3. Dengan Object.entries()

const entries = Object.entries(produk);Code language: JavaScript (javascript)

Output:

[
    [ 'nama', 'Keyboard' ],
    [ 'harga', 300000 ],
    [ 'stok', 12 ]
]Code language: JSON / JSON with Comments (json)

4. Dengan spread operator

Spread (...) hanya bekerja pada iterable, tetapi objek bukan iterable, sehingga perlu mengubahnya dulu.

Misalnya:

const arr = [...Object.entries(produk)];Code language: JavaScript (javascript)

Output:

[
    [ 'nama', 'Keyboard' ],
    [ 'harga', 300000 ],
    [ 'stok', 12 ]
]Code language: JSON / JSON with Comments (json)

Ini mengubah objek menjadi array pasangan key-value.

6. Spread Operator untuk Object

Spread syntax (...) dapat:

  • Menggabungkan objek
  • Menambah property baru
  • Membuat salinan objek

Contoh:

const user = {
    nama: "Sari",
    umur: 22
};

const userBaru = {
    ...user,
    pekerjaan: "Designer"
};

console.log(userBaru);Code language: JavaScript (javascript)

Output:

{
    nama: "Sari",
    umur: 22,
    pekerjaan: "Designer"
}Code language: CSS (css)

Spread operator > Object.assign > Lebih modern & lebih singkat.

7. Prototype JavaScript (Penjelasan Mudah untuk Pemula)

JavaScript menggunakan sistem prototype-based. Artinya, setiap objek memiliki “cetakan” atau template yang disebut:

  • prototype

Ketika objek tidak menemukan suatu property, JavaScript akan mencarinya di prototype chain.

Contoh mudah:

function Orang(nama) {
    this.nama = nama;
}

Orang.prototype.sapa = function () {
    console.log(`Halo, saya ${this.nama}`);
};

const orang1 = new Orang("Budi");

orang1.sapa();Code language: JavaScript (javascript)

Output:

Halo, saya Budi

Penjelasan:

  • sapa() tidak ada dalam objek orang1
  • JavaScript mencari di Orang.prototype
  • Ditemukan → method bisa dipakai
  • Inilah yang disebut prototype inheritance

8. Inheritance Dasar Menggunakan Prototype

Inheritance memungkinkan objek “mewarisi” property dan method dari objek lain.

Contoh inheritance sederhana:

function Hewan(nama) {
    this.nama = nama;
}

Hewan.prototype.suara = function () {
    console.log(`${this.nama} mengeluarkan suara.`);
};

function Kucing(nama, warna) {
    Hewan.call(this, nama); // mewarisi property
    this.warna = warna;
}

Kucing.prototype = Object.create(Hewan.prototype); // mewarisi method
Kucing.prototype.constructor = Kucing;

Kucing.prototype.mengeong = function () {
    console.log(`${this.nama} mengeong.`);
};

const kucing1 = new Kucing("Mimi", "Putih");
kucing1.suara();
kucing1.mengeong();Code language: JavaScript (javascript)

Penjelasan:

  1. Hewan memiliki method suara().
  2. Kucing menggunakan Hewan.call() untuk mewarisi property…
  3. dan Object.create() untuk mewarisi method.
  4. Kucing.prototype.constructor = Kucing mengembalikan referensi constructor.
  5. kucing1 kini memiliki:
    • method dari Hewan
    • method dari Kucing

Inilah konsep dasar OOP versi JavaScript (tanpa class).

Studi Kasus Besar & Implementasi dalam Program

Pada bagian ini, kita akan masuk ke tahap paling praktis dalam tutorial objek JavaScript untuk pemula: bagaimana objek digunakan dalam program nyata. Kamu akan melihat bagaimana array of objects, looping objek, penggunaan Object methods, serta simulasi modul data digunakan dalam sebuah mini-project sederhana.

Bagian ini sangat penting karena inilah cara objek bekerja di dunia nyata—bukan hanya konsep, tapi penggunaannya saat membangun fitur aplikasi web.

1. Objek dalam Program Nyata

Dalam pemrograman JavaScript, objek adalah salah satu struktur data paling fundamental. Hampir semua fitur kompleks—mulai dari data pengguna, barang, pengaturan aplikasi, hingga komunikasi API—menggunakan objek sebagai media penyimpanan informasinya.

Contoh umum objek dalam program nyata:

  • Data User Login
  • Product / Produk e-commerce
  • Konfigurasi aplikasi
  • Pengaturan tampilan UI
  • Data API (JSON)

Contoh objek program:

let user = {
    id: 1,
    name: "Aris Munandar",
    email: "admin@bahasaweb.com",
    isVerified: true
};Code language: JavaScript (javascript)

Objek seperti ini sangat sering muncul dalam aplikasi modern.

2. Array of Objects

Salah satu struktur data paling populer adalah array of objects.

Struktur ini biasanya digunakan untuk:

  • daftar produk
  • daftar pengguna
  • daftar postingan
  • daftar transaksi
  • daftar menu aplikasi

Contoh array of objects:

let products = [
    {
        id: 1,
        name: "Laptop",
        price: 12000000,
        stock: 5
    },
    {
        id: 2,
        name: "Mouse Gaming",
        price: 250000,
        stock: 20
    },
    {
        id: 3,
        name: "Keyboard Mechanical",
        price: 750000,
        stock: 12
    }
];Code language: JavaScript (javascript)

3. Looping Objek: for…in, Object Method, dan Iterasi Array

Ada beberapa cara untuk melakukan looping pada objek atau array of objects.

Looping Property Object – for…in

for (let key in obj) {
    console.log(key, obj[key]);
}Code language: JavaScript (javascript)

Contohnya:

let user = {
    name: "Aris",
    age: 25,
    job: "Developer"
};

for (let key in user) {
    console.log(key + " = " + user[key]);
}Code language: JavaScript (javascript)

Output:

name = Aris
age = 25
job = Developer

Looping Array of Objects – forEach

products.forEach(product => {
    console.log(product.name);
});Code language: JavaScript (javascript)

Output:

Laptop
Mouse Gaming
Keyboard Mechanical

Looping dengan Object.keys / Object.values / Object.entries

Object.keys

console.log(Object.keys(user));Code language: JavaScript (javascript)

Object.values

console.log(Object.values(user));Code language: JavaScript (javascript)

Object.entries

Object.entries(user).forEach(([key, value]) => {
    console.log(key, value);
});Code language: JavaScript (javascript)

4. Membuat Modul Data Menggunakan Objek

Dalam aplikasi nyata, data biasanya dikelola menggunakan modul.

Contoh modul sederhana:

let UserModule = {
    data: [],

    addUser(user) {
        this.data.push(user);
    },

    findUserByEmail(email) {
        return this.data.find(u => u.email === email);
    },

    getAllUsers() {
        return this.data;
    }
};Code language: JavaScript (javascript)

Cara menggunakan modul:

UserModule.addUser({
    id: 1,
    name: "Aris",
    email: "admin@bahasaweb.com",
    isVerified: true
});

console.log(UserModule.getAllUsers());Code language: CSS (css)

Output:

[
    {
        id: 1,
        name: "Aris",
        email: "admin@bahasaweb.com",
        isVerified: true
    }
]Code language: JavaScript (javascript)

5. Simulasi Struktur Data di Dunia Nyata

Berikut ini adalah simulasi untuk dapat di jadikan contoh studi kasus yang dapat kamu kembangkan dalam berbagai data dan struktur yang berbeda sebagai bahan pembelajaran objek dalam JavaScript.

Struktur Data Produk

let Product = {
    id: 101,
    title: "Headset Wireless",
    price: 650000,
    category: "Elektronik",
    specs: {
        color: "Black",
        battery: "40 Hours",
        warranty: "1 Tahun"
    }
};Code language: JavaScript (javascript)

Struktur Data User

let User = {
    id: 99,
    name: "Aris",
    email: "aris@mail.com",
    preferences: {
        theme: "dark",
        language: "id",
    }
};Code language: JavaScript (javascript)

Struktur Data Settings Aplikasi

let AppSettings = {
    version: "1.0.0",
    maintenance: false,
    theme: {
        primaryColor: "#3498db",
        darkMode: true
    }
};Code language: JavaScript (javascript)

6. Mini Project: Sistem Data Sederhana Menggunakan Object

Kita akan membuat sistem kecil untuk mengelola data produk.

Mini project ini meliputi:

  • Tambah produk
  • Tampilkan semua produk
  • Cari produk berdasarkan ID
  • Update produk
  • Hapus produk

Membuat Modul Produk

let ProductModule = {
    products: [],

    addProduct(product) {
        this.products.push(product);
    },

    getAll() {
        return this.products;
    },

    findById(id) {
        return this.products.find(p => p.id === id);
    },

    updateProduct(id, newData) {
        let index = this.products.findIndex(p => p.id === id);
        if (index !== -1) {
            this.products[index] = { 
                ...this.products[index], 
                ...newData 
            };
        }
    },

    deleteProduct(id) {
        this.products = this.products.filter(p => p.id !== id);
    }
};Code language: JavaScript (javascript)

Menambahkan Produk

ProductModule.addProduct({
    id: 102,
    title: "Keyboard Mechanical",
    price: 750000,
    category: "Elektronik",
    specs: {
        color: "Black",
        warranty: "1 Tahun"
    }
});Code language: CSS (css)

Menampilkan Semua Produk

console.log(ProductModule.getAll());Code language: CSS (css)

Output:

[
    {
        id: 102,
        title: "Keyboard Mechanical",
        price: 750000,
        category: "Elektronik",
        specs: {
            color: "Black",
            warranty: "1 Tahun"
        }
    }
]Code language: JavaScript (javascript)

Mencari Produk Berdasarkan ID

console.log(ProductModule.findById(102));Code language: CSS (css)

Output:

{
    id: 102,
    title: "Keyboard Mechanical",
    price: 750000,
    category: "Elektronik",
    specs: {
        color: "Black",
        warranty: "1 Tahun"
    }
}Code language: CSS (css)

Mengupdate Produk

ProductModule.updateProduct(102, {
    price: 800000
});Code language: CSS (css)

Output:

{
    id: 102,
    title: "Keyboard Mechanical",
    price: 800000,
    category: "Elektronik",
    specs: {
        color: "Black",
        warranty: "1 Tahun"
    }
}Code language: CSS (css)

Menghapus Produk

ProductModule.deleteProduct(102);Code language: CSS (css)

Output:

[
    {
        id: 102,
        title: "Keyboard Mechanical",
        price: 800000,
        category: "Elektronik",
        specs: {
            color: "Black",
            warranty: "1 Tahun"
        }
    }
]Code language: JavaScript (javascript)

Objek adalah dasar dari pemrograman JavaScript modern. Dengan menguasai objek, kamu sudah berada di jalur yang benar untuk memahami konsep yang lebih kompleks seperti OOP, Class, Prototype, hingga Framework JavaScript modern.

Kesimpulan

Objek JavaScript merupakan salah satu fondasi utama dalam pemrograman JavaScript. Dengan memahami apa itu objek, bagaimana cara kerjanya, apa fungsi objek dalam JavaScript, serta bagaimana property dan method bekerja, seorang pemula dapat menguasai struktur data yang digunakan di hampir seluruh aplikasi web modern.

Dalam artikel ini kamu telah mempelajari:

  • Pengertian objek JavaScript
  • Perbedaan objek dengan tipe data primitif
  • Struktur dasar object literal
  • Cara membuat dan memanipulasi property
  • Penggunaan constructor function dan keyword this
  • Konsep nested object
  • Fitur penting seperti Object.assign, Object.keys, Object.values, Object.entries, dan spread operator
  • Dasar prototype & inheritance
  • Cara menggunakan objek dalam program nyata
  • Studi kasus array of objects dan mini project sistem data

Dengan memahami semua konsep ini, kamu kini berada di tahap yang sangat kuat untuk melanjutkan ke topik berikutnya: OOP JavaScript, Class ES6, dan pola desain JavaScript modern.

Semakin sering kamu berlatih menggunakan objek dalam proyek kecil, semakin mudah pula memahami struktur aplikasi web yang lebih kompleks.

2 JavaScript Menengah

3 JavaScript Lanjutan

4 JavaScript Mahir

5 JavaScript Ahli

Comments

Congrats, you have the opportunity to be the first commenter on this article. Have questions or suggestions? Please leave a comment to start discussion.

Leave comment

Alamat email Anda tidak akan dipublikasikan. Required fields are marked *

news-1701

sabung ayam online

yakinjp

yakinjp

rtp yakinjp

slot thailand

yakinjp

yakinjp

yakin jp

yakinjp id

maujp

maujp

maujp

maujp

sabung ayam online

sabung ayam online

judi bola online

sabung ayam online

judi bola online

slot mahjong ways

slot mahjong

sabung ayam online

judi bola

live casino

sabung ayam online

judi bola

live casino

SGP Pools

slot mahjong

sabung ayam online

slot mahjong

SLOT THAILAND

article 118880681

article 118880682

article 118880683

article 118880684

article 118880685

article 118880686

article 118880687

article 118880688

article 118880689

article 118880690

article 118880691

article 118880692

article 118880693

article 118880694

article 118880695

article 118880696

article 118880697

article 118880698

article 118880699

article 118880700

berita 128000731

berita 128000732

berita 128000733

berita 128000734

berita 128000735

berita 128000736

berita 128000737

berita 128000738

berita 128000739

berita 128000740

berita 128000741

berita 128000742

berita 128000743

berita 128000744

berita 128000745

berita 128000746

berita 128000747

berita 128000748

berita 128000749

berita 128000750

berita 128000751

berita 128000752

berita 128000753

berita 128000754

berita 128000755

berita 128000756

berita 128000757

berita 128000758

berita 128000759

berita 128000760

article 128000761

article 128000762

article 128000763

article 128000764

article 128000765

article 128000766

article 128000767

article 128000768

article 128000769

article 128000770

artikel 128000826

artikel 128000827

artikel 128000828

artikel 128000829

artikel 128000830

artikel 128000831

artikel 128000832

artikel 128000833

artikel 128000834

artikel 128000835

artikel 128000836

artikel 128000837

artikel 128000838

artikel 128000839

artikel 128000840

artikel 128000841

artikel 128000842

artikel 128000843

artikel 128000844

artikel 128000845

artikel 128000846

artikel 128000847

artikel 128000848

artikel 128000849

artikel 128000850

artikel 128000851

artikel 128000852

artikel 128000853

artikel 128000854

artikel 128000855

post 128000856

post 128000857

post 128000858

post 128000859

post 128000860

post 128000861

post 128000862

post 128000863

post 128000864

post 128000865

post 128000866

post 128000867

post 128000868

post 128000869

post 128000870

post 128000871

post 128000872

post 128000873

post 128000874

post 128000875

story 138000836

story 138000837

story 138000838

story 138000839

story 138000840

story 138000841

story 138000842

story 138000843

story 138000844

story 138000845

story 138000846

story 138000847

story 138000848

story 138000849

story 138000850

story 138000851

story 138000852

story 138000853

story 138000854

story 138000855

story 138000856

story 138000857

story 138000858

story 138000859

story 138000860

story 138000861

story 138000862

story 138000863

story 138000864

story 138000865

post 138000866

post 138000867

post 138000868

post 138000869

post 138000870

post 138000871

post 138000872

post 138000873

post 138000874

post 138000875

post 138000876

post 138000877

post 138000878

post 138000879

post 138000880

post 138000881

post 138000882

post 138000883

post 138000884

post 138000885

journal-228000381

journal-228000382

journal-228000383

journal-228000384

journal-228000385

journal-228000386

journal-228000387

journal-228000388

journal-228000389

journal-228000390

journal-228000391

journal-228000392

journal-228000393

journal-228000394

journal-228000395

journal-228000396

journal-228000397

journal-228000398

journal-228000399

journal-228000400

journal-228000401

journal-228000402

journal-228000403

journal-228000404

journal-228000405

journal-228000406

journal-228000407

journal-228000408

journal-228000409

journal-228000410

journal-228000411

journal-228000412

journal-228000413

journal-228000414

journal-228000415

journal-228000416

journal-228000417

journal-228000418

journal-228000419

journal-228000420

journal-228000421

journal-228000422

journal-228000423

journal-228000424

journal-228000425

journal-228000426

journal-228000427

journal-228000428

journal-228000429

journal-228000430

journal-228000431

journal-228000432

journal-228000433

journal-228000434

journal-228000435

journal-228000436

journal-228000437

journal-228000438

journal-228000439

journal-228000440

journal-228000441

journal-228000442

journal-228000443

journal-228000444

journal-228000445

journal-228000446

journal-228000447

journal-228000448

journal-228000449

journal-228000450

article 228000426

article 228000427

article 228000428

article 228000429

article 228000430

article 228000431

article 228000432

article 228000433

article 228000434

article 228000435

article 228000436

article 228000437

article 228000438

article 228000439

article 228000440

article 228000441

article 228000442

article 228000443

article 228000444

article 228000445

article 228000446

article 228000447

article 228000448

article 228000449

article 228000450

article 228000451

article 228000452

article 228000453

article 228000454

article 228000455

update 238000507

update 238000508

update 238000509

update 238000510

update 238000511

update 238000512

update 238000513

update 238000514

update 238000515

update 238000516

update 238000517

update 238000518

update 238000519

update 238000520

update 238000521

update 238000522

update 238000523

update 238000524

update 238000525

update 238000526

update 238000527

update 238000528

update 238000529

update 238000530

update 238000531

update 238000532

update 238000533

update 238000534

update 238000535

update 238000536

update 238000537

update 238000538

update 238000539

update 238000540

update 238000541

post 238000541

post 238000542

post 238000543

post 238000544

post 238000545

post 238000546

post 238000547

post 238000548

post 238000549

post 238000550

post 238000551

post 238000552

post 238000553

post 238000554

post 238000555

post 238000556

post 238000557

post 238000558

post 238000559

post 238000560

news-1701