Class: Properti, Constructor & Modifier Akses

Menulis class bertipe: properti, constructor, parameter properties, public/private/protected/readonly, #private, getter-setter, dan anggota static.

Part 11 dari 24 ± 50 menit Gratis

Class di TypeScript

JavaScript modern sudah punya class. TypeScript menambahkan tipe pada propertinya dan modifier akses untuk mengatur siapa boleh mengakses apa.

class Pengguna {
  nama: string              // properti WAJIB dideklarasikan beserta tipenya
  umur: number

  constructor(nama: string, umur: number) {
    this.nama = nama
    this.umur = umur
  }

  perkenalan(): string {
    return `Saya ${this.nama}, ${this.umur} tahun`
  }
}

const u = new Pengguna("Sinta", 22)
u.perkenalan()
new Pengguna("Sinta")    // ❌ Expected 2 arguments, but got 1

Di mode strict, properti yang tidak diisi di constructor dianggap error ("has no initializer") — mencegah undefined tak terduga.

Modifier akses

ModifierBisa diakses dari
public (bawaan)Di mana saja
privateHanya di dalam class itu sendiri
protectedDi dalam class dan turunannya (bab 12)
readonlyBoleh dibaca di mana saja, hanya diisi sekali (deklarasi/constructor)
class Rekening {
  private saldo: number = 0           // tersembunyi dari luar
  readonly nomor: string

  constructor(nomor: string) { this.nomor = nomor }

  setor(jumlah: number): void { this.saldo += jumlah }
  get saldoSekarang(): number { return this.saldo }
}

const r = new Rekening("001")
r.setor(500)
r.saldo = 999999       // ❌ Property 'saldo' is private
r.nomor = "002"        // ❌ Cannot assign to 'nomor' because it is a read-only property

private milik TypeScript hanya dicek saat kompilasi; di JavaScript hasil kompilasi propertinya tetap bisa diakses. Untuk privasi sungguhan saat runtime, pakai sintaks JavaScript #saldo (field privat ECMAScript).

Parameter properties: jalan pintas

Menulis modifier langsung di parameter constructor mendeklarasikan dan mengisi properti sekaligus:

class Rekening2 {
  private saldo = 0
  constructor(public readonly pemilik: string, public readonly nomor: string) {}
  // setara dengan mendeklarasikan 2 properti + this.pemilik = pemilik; this.nomor = nomor
}

Getter dan setter

class Suhu {
  private _celsius = 0
  get celsius(): number { return this._celsius }
  set celsius(nilai: number) {
    if (nilai < -273.15) throw new Error("Di bawah nol mutlak")
    this._celsius = nilai
  }
  get fahrenheit(): number { return this._celsius * 1.8 + 32 }   // hanya getter = read-only
}
const s = new Suhu()
s.celsius = 100
console.log(s.fahrenheit)   // 212

Getter/setter dipakai seperti properti biasa (tanpa tanda kurung), tetapi menjalankan logika — cocok untuk validasi dan nilai turunan.

Anggota static

Milik class itu sendiri, bukan milik tiap instance:

class Penghitung {
  static jumlah = 0
  constructor() { Penghitung.jumlah++ }
  static reset(): void { Penghitung.jumlah = 0 }
}
new Penghitung(); new Penghitung()
console.log(Penghitung.jumlah)   // 2

Class sebagai tipe

Nama class juga bisa dipakai sebagai tipe untuk instance-nya: function cetak(u: Pengguna) { ... }. Dan karena structural typing, object biasa dengan bentuk yang sama juga diterima (kecuali class punya anggota private, yang membuatnya "nominal").

Kesalahan umum pemula

  • Lupa mendeklarasikan properti di body class lalu langsung this.x = ... di constructor.
  • Mengira private menyembunyikan data di hasil JavaScript.
  • Memberi nama getter dan properti penyimpan yang sama (celsius vs celsius) — pakai awalan _ atau # untuk penyimpannya.

Praktikkan langsung, gratis

Tulis dan jalankan kode langsung di browser, dapatkan penilaian otomatis. Daftar gratis kapan saja untuk menyimpan progres dan meraih sertifikat.

Coba latihan sekarang, tanpa daftar
Bagikan: WhatsApp Facebook LinkedIn X