Masukkan Password
43 Metode Penggantian & Modifikasi Terproteksi
Di lecture ini ada 2 konsep utama yang sangat penting dalam inheritance TypeScript:
- Method overriding → child class mengganti implementasi method milik parent.
protectedaccess modifier → property/method bisa digunakan oleh parent dan child class, tetapi tidak bisa diakses sembarangan dari luar.
Saya jelaskan dari dasar supaya hubungan antara private, protected, inheritance, dan overriding benar-benar jelas.
1. Gambaran besar lecture ini
Sebelumnya kita punya inheritance seperti ini:
Person
┌──────┼──────┐
│ │ │
name gender dateOfBirth
│ │
└── calculateAge()
│
┌────┴─────┐
↓ ↓
Employee Athlete
Employee dan Athlete mewarisi Person.
Misalnya:
class Person {
name: string;
gender: string;
dateOfBirth: string;
calculateAge() {
// logic menghitung umur
}
}
Kemudian:
class Employee extends Person {
salary: number;
getSalary() {
// logic salary
}
}
Karena Employee extends Person, maka Employee mendapatkan fitur dari Person.
Tetapi lecture ini bertanya:
Bagaimana kalau
Employeeingin punya cara sendiri untuk menghitung umur?
Nah, di sinilah kita masuk ke method overriding.
2. Apa itu Method Overriding?
Method overriding adalah ketika child class membuat method dengan nama yang sama dengan method yang sudah ada di parent class, tetapi dengan implementasi/logic yang berbeda.
Contoh sederhana:
class Person {
calculateAge() {
return 30;
}
}
class Employee extends Person {
calculateAge() {
return 35;
}
}
Perhatikan:
Person.calculateAge()
dan
Employee.calculateAge()
Namanya sama:
calculateAge()
Tetapi implementasinya berbeda.
Jadi:
Person
└── calculateAge()
↓
logic A
Employee extends Person
└── calculateAge()
↓
logic B
Employee meng-override calculateAge() milik Person.
3. Analogi sederhana Method Overriding
Bayangkan ada perusahaan.
Person punya aturan:
“Untuk menghitung umur, gunakan cara A.”
Kemudian Employee mengatakan:
“Saya tetap menggunakan konsep menghitung umur, tetapi khusus Employee saya ingin menggunakan cara B.”
Maka Employee tidak perlu membuat nama method baru seperti:
calculateEmployeeAge()
Cukup:
calculateAge()
Karena Employee sedang mengganti perilaku dari method parent.
4. Contoh dari lecture
Misalnya parent class:
class Person {
name: string;
dateOfBirth: string;
gender: string;
constructor(
name: string,
dateOfBirth: string,
gender: string
) {
this.name = name;
this.dateOfBirth = dateOfBirth;
this.gender = gender;
}
calculateAge() {
const currentYear = new Date().getFullYear();
const birthYear = new Date(this.dateOfBirth).getFullYear();
return currentYear - birthYear;
}
}
Di sini Person memiliki:
calculateAge()
yang menghitung:
tahun sekarang - tahun lahir
Misalnya:
2024 - 1991 = 33
5. Kemudian Employee melakukan overriding
Sekarang kita buat:
class Employee extends Person {
calculateAge() {
return 2024 - new Date(this.dateOfBirth).getFullYear();
}
}
Perhatikan bahwa kita membuat:
calculateAge()
lagi di Employee.
Ini bukan method baru yang benar-benar berbeda.
Ini adalah override dari:
Person.calculateAge()
6. Apa yang terjadi ketika object dibuat?
Misalnya:
const person = new Person(
"John",
"08/30/1991",
"Male"
);
Kemudian:
person.calculateAge();
Yang dipanggil adalah:
Person.calculateAge()
Karena object tersebut adalah instance dari Person.
Sekarang:
const employee = new Employee(
"John",
"08/30/1991",
"Male"
);
Lalu:
employee.calculateAge();
Yang dipanggil adalah:
Employee.calculateAge()
bukan:
Person.calculateAge()
karena Employee sudah meng-override method tersebut.
7. Cara mudah mengingat overriding
Bayangkan seperti ini:
Parent:
calculateAge()
↓
"cara menghitung umur versi parent"
Child:
calculateAge()
↓
"cara menghitung umur versi child"
Ketika kita memanggil:
employee.calculateAge();
TypeScript akan menggunakan versi yang dimiliki Employee.
Jadi:
Person object
↓
Person.calculateAge()
Employee object
↓
Employee.calculateAge()
8. Lalu apa hubungannya dengan private?
Nah, di sinilah bagian lecture yang sangat penting.
Di awal lecture, dateOfBirth diubah menjadi:
private dateOfBirth: string;
Misalnya:
class Person {
name: string;
gender: string;
private dateOfBirth: string;
constructor(
name: string,
dateOfBirth: string,
gender: string
) {
this.name = name;
this.dateOfBirth = dateOfBirth;
this.gender = gender;
}
}
Sekarang dateOfBirth adalah private.
Artinya:
dateOfBirthhanya boleh digunakan di dalam classPerson.
9. private bukan berarti “tidak bisa diwariskan”
Ini adalah salah satu bagian yang sering membingungkan pemula.
Ketika:
class Employee extends Person
kita memang mewarisi struktur/perilaku dari Person.
Tetapi member yang private tidak bisa diakses langsung oleh child class.
Misalnya:
class Person {
private dateOfBirth: string;
constructor(dateOfBirth: string) {
this.dateOfBirth = dateOfBirth;
}
}
Kemudian:
class Employee extends Person {
calculateAge() {
return new Date(this.dateOfBirth);
}
}
Ini error.
Kenapa?
Karena:
private dateOfBirth
hanya boleh diakses di:
Person
Bukan di:
Employee
Walaupun Employee adalah child dari Person.
10. Visualisasi private
Misalnya:
Person
┌─────────────────────────────┐
│ private dateOfBirth │
│ │
│ calculateAge() │
│ ↓ │
│ boleh akses dateOfBirth │
└─────────────────────────────┘
│
│ extends
↓
┌─────────────────────────────┐
│ Employee │
│ │
│ ❌ tidak boleh akses │
│ dateOfBirth langsung │
└─────────────────────────────┘
Jadi private sangat ketat.
11. Lalu kita membutuhkan protected
Masalahnya sekarang:
Bagaimana kalau kita ingin
dateOfBirthtidak boleh diakses oleh sembarang code dari luar, tetapi tetap ingin child class sepertiEmployeebisa menggunakannya?
Jawabannya:
protected
Jadi:
private dateOfBirth: string;
diubah menjadi:
protected dateOfBirth: string;
12. Apa arti protected?
protected berarti:
Property atau method hanya bisa diakses dari class tersebut dan class turunannya (child classes).
Jadi:
Person
↓
boleh akses protected
Employee extends Person
↓
boleh akses protected
Athlete extends Person
↓
boleh akses protected
kode dari luar
↓
❌ tidak boleh akses protected
13. Perbedaan public, private, dan protected
Ini bagian yang wajib banget dipahami.
| Modifier | Di dalam class | Child class | Dari luar |
|---|---|---|---|
public | ✅ | ✅ | ✅ |
protected | ✅ | ✅ | ❌ |
private | ✅ | ❌ | ❌ |
Cara mengingatnya:
public
Semua orang boleh akses.
Class
├── Child
└── Outside
↓
✅
private
Hanya class pemiliknya.
Person
↓
✅
Employee
↓
❌
Outside
↓
❌
protected
Class pemilik + child classes.
Person
↓
✅
Employee
↓
✅
Athlete
↓
✅
Outside
↓
❌
14. Kembali ke contoh dateOfBirth
Sekarang kita ubah:
private dateOfBirth: string;
menjadi:
protected dateOfBirth: string;
Sehingga:
class Person {
name: string;
gender: string;
protected dateOfBirth: string;
constructor(
name: string,
dateOfBirth: string,
gender: string
) {
this.name = name;
this.dateOfBirth = dateOfBirth;
this.gender = gender;
}
calculateAge() {
const currentYear = new Date().getFullYear();
const birthYear =
new Date(this.dateOfBirth).getFullYear();
return currentYear - birthYear;
}
}
Sekarang Employee bisa mengakses:
this.dateOfBirth
karena Employee adalah child class.
15. Employee bisa mengakses protected
Contohnya:
class Employee extends Person {
calculateAge() {
const birthYear =
new Date(this.dateOfBirth).getFullYear();
return 2024 - birthYear;
}
}
Ini sekarang valid.
Kenapa?
Karena:
dateOfBirth
adalah:
protected
dan Employee merupakan subclass dari Person.
16. Tetapi dari luar tetap tidak boleh
Walaupun Employee bisa mengaksesnya:
class Employee extends Person {
calculateAge() {
return new Date(this.dateOfBirth).getFullYear();
}
}
kode seperti ini tetap tidak boleh:
const employee = new Employee(...);
console.log(employee.dateOfBirth);
Karena dari luar class:
employee.dateOfBirth
❌ tidak boleh.
Jadi protected bukan berarti public.
17. Analogi protected yang mudah
Bayangkan sebuah rumah.
public
Seperti ruang tamu:
Siapa pun boleh masuk.
private
Seperti kamar pribadi:
Hanya pemilik rumah yang boleh masuk.
protected
Seperti ruang keluarga:
Pemilik rumah dan anggota keluarga boleh masuk, tetapi tamu umum tidak.
Kalau:
Person = orang tua
Employee = anak
maka property protected bisa digunakan oleh:
Person ✅
Employee ✅
tetapi bukan oleh:
orang dari luar ❌
18. Full contoh yang lebih lengkap
Mari kita gabungkan semuanya:
class Person {
name: string;
gender: string;
protected dateOfBirth: string;
constructor(
name: string,
dateOfBirth: string,
gender: string
) {
this.name = name;
this.dateOfBirth = dateOfBirth;
this.gender = gender;
}
calculateAge() {
const currentYear = new Date().getFullYear();
const birthYear =
new Date(this.dateOfBirth).getFullYear();
console.log("calculate age of person called");
return currentYear - birthYear;
}
}
Kemudian:
class Employee extends Person {
calculateAge() {
const birthYear =
new Date(this.dateOfBirth).getFullYear();
console.log("calculate age of employee called");
return 2024 - birthYear;
}
}
Sekarang:
const employee = new Employee(
"John",
"08/30/1991",
"Male"
);
console.log(employee.calculateAge());
Output:
calculate age of employee called
33
Kenapa "calculate age of employee called"?
Karena:
Employee
sudah meng-override:
Person.calculateAge()
19. Bagaimana membuktikan bahwa overriding benar-benar terjadi?
Lecture menggunakan:
console.log()
di kedua method.
Parent:
calculateAge() {
console.log("calculate age of person called");
// ...
}
Child:
calculateAge() {
console.log("calculate age of employee called");
// ...
}
Kemudian:
const employee = new Employee(...);
employee.calculateAge();
Output:
calculate age of employee called
Ini membuktikan bahwa method Employee yang digunakan.
20. Bagaimana kalau Employee tidak punya calculateAge()?
Misalnya kita hapus:
class Employee extends Person {
}
Kemudian:
const employee = new Employee(...);
employee.calculateAge();
Karena Employee tidak memiliki calculateAge() sendiri, TypeScript akan mencari ke parent:
Employee
↓
tidak menemukan calculateAge()
↓
Person
↓
menemukan calculateAge()
↓
gunakan Person.calculateAge()
Jadi inheritance bekerja seperti pencarian.
21. Cara berpikir method lookup
Misalnya:
employee.calculateAge()
JavaScript/TypeScript secara konsep akan mencari:
Apakah Employee punya calculateAge()?
│
├── YES → gunakan Employee.calculateAge()
│
└── NO
↓
Apakah Person punya?
│
└── YES → gunakan Person.calculateAge()
Ini membantu memahami kenapa overriding bekerja.
22. Apa bedanya overriding dengan membuat method baru?
Misalnya parent:
class Person {
calculateAge() {}
}
Kalau child:
class Employee extends Person {
calculateAge() {}
}
Ini:
overriding
Karena nama method sama.
Tetapi kalau:
class Employee extends Person {
calculateSalary() {}
}
Ini bukan overriding.
Ini adalah:
method baru milik Employee.
Jadi:
calculateAge()
↓
sudah ada di parent
↓
dibuat ulang di child
↓
OVERRIDING
Sedangkan:
calculateSalary()
↓
belum ada di parent
↓
dibuat di child
↓
METHOD BARU
23. Kenapa overriding berguna?
Bayangkan kita punya:
Person
├── calculateAge()
Employee extends Person
└── calculateAge()
Athlete extends Person
└── calculateAge()
Semua orang punya konsep:
calculateAge()
Tetapi masing-masing bisa punya cara menghitung yang berbeda.
Misalnya:
Person
→ cara standar
Employee
→ cara khusus employee
Athlete
→ cara khusus athlete
Kita tetap menggunakan nama:
calculateAge()
sehingga interface/perilakunya konsisten.
24. protected juga bisa digunakan pada method
Bukan hanya property.
Misalnya:
class Person {
protected getBirthYear() {
return new Date(this.dateOfBirth).getFullYear();
}
}
Kemudian child bisa menggunakan:
class Employee extends Person {
calculateAge() {
const year = this.getBirthYear();
return 2024 - year;
}
}
Tetapi dari luar:
employee.getBirthYear();
❌ tidak boleh.
Karena method tersebut:
protected
25. Kenapa tidak dibuat public saja?
Pertanyaan bagus.
Misalnya kita punya:
public dateOfBirth: string;
Maka dari luar orang bisa melakukan:
employee.dateOfBirth = "01/01/2000";
Artinya siapa pun bisa mengubahnya.
Kalau kita tidak ingin itu terjadi, tetapi masih ingin child class menggunakannya, kita bisa menggunakan:
protected dateOfBirth: string;
Jadi:
protected
↓
Parent bisa akses
Child bisa akses
Outside tidak bisa akses
Ini memberikan kontrol akses yang lebih baik.
26. private vs protected adalah poin terpenting
Bayangkan:
class Person {
private privateData: string;
protected protectedData: string;
}
Child:
class Employee extends Person {
test() {
this.privateData; // ❌
this.protectedData; // ✅
}
}
Dari luar:
const employee = new Employee(...);
employee.privateData; // ❌
employee.protectedData; // ❌
Jadi:
Person Employee Outside
---------------------------------------------------
private ✅ ❌ ❌
protected ✅ ✅ ❌
public ✅ ✅ ✅
27. Hubungan private, protected, dan inheritance
Sekarang kita bisa melihat kenapa ketiganya dibuat.
public
Digunakan ketika sesuatu memang merupakan bagian dari API yang ingin kita expose.
employee.getSalary();
Silakan dipanggil dari luar.
private
Digunakan untuk detail internal yang hanya diperlukan oleh class tersebut.
private calculateBonus();
Child bahkan tidak perlu tahu bagaimana detailnya.
protected
Digunakan ketika detail tersebut masih internal, tetapi child class perlu menggunakannya.
protected dateOfBirth;
Parent dan child boleh menggunakannya, tetapi pengguna object dari luar tidak.
28. Satu hal yang sering membuat pemula salah paham
Jangan berpikir:
“
protectedberarti hanya child yang bisa mengakses.”
Salah.
protected bisa diakses oleh:
- class tempat property tersebut didefinisikan
- child/subclass
Jadi:
class Person {
protected dateOfBirth: string;
calculateAge() {
this.dateOfBirth; // ✅
}
}
dan:
class Employee extends Person {
test() {
this.dateOfBirth; // ✅
}
}
Tetapi:
const employee = new Employee(...);
employee.dateOfBirth; // ❌
29. Hubungan antara extends dan protected
Ingat:
class Employee extends Person
extends membuat hubungan parent-child.
Karena Employee adalah child:
Person
│
│ extends
↓
Employee
Employee mendapatkan akses ke member protected dari Person.
Tanpa inheritance:
class Employee {
// tidak otomatis punya akses
// ke protected member Person
}
Karena Employee bukan child dari Person.
30. Tentang kode 2024
Di transcript, lecture menggunakan:
return 2024 - ...
Ini hanya untuk contoh pembelajaran.
Dalam aplikasi nyata, kita biasanya tidak ingin hard-code:
2024
karena tahun akan berubah.
Lebih baik:
const currentYear = new Date().getFullYear();
sehingga pada 2026 otomatis mendapatkan:
2026
dan tahun berikutnya akan berubah otomatis.
Jadi konsep lecture-nya adalah overriding, bukan bahwa kita harus menghitung umur menggunakan angka 2024.
31. Satu detail penting tentang Date
Lecture juga menunjukkan bahwa format tanggal harus benar.
Misalnya:
new Date("08/30/1991")
digunakan untuk mendapatkan tanggal.
Kemudian:
.getFullYear()
mengambil tahun:
1991
Sehingga:
const birthYear =
new Date(this.dateOfBirth).getFullYear();
hasilnya:
1991
Lalu:
2024 - 1991
hasil:
33
Catatan kecil: format tanggal string seperti "08/30/1991" bisa bergantung pada lingkungan dan mudah ambigu. Untuk aplikasi nyata, format ISO seperti "1991-08-30" biasanya lebih aman.
32. Gambaran keseluruhan kode
Kalau digabung, kira-kira seperti ini:
class Person {
name: string;
gender: string;
protected dateOfBirth: string;
constructor(
name: string,
dateOfBirth: string,
gender: string
) {
this.name = name;
this.dateOfBirth = dateOfBirth;
this.gender = gender;
}
calculateAge() {
const currentYear = new Date().getFullYear();
const birthYear =
new Date(this.dateOfBirth).getFullYear();
console.log("calculate age of person called");
return currentYear - birthYear;
}
}
class Employee extends Person {
calculateAge() {
const currentYear = new Date().getFullYear();
const birthYear =
new Date(this.dateOfBirth).getFullYear();
console.log("calculate age of employee called");
return currentYear - birthYear;
}
}
Kemudian:
const person = new Person(
"John",
"1991-08-30",
"Male"
);
const employee = new Employee(
"Mary",
"1995-05-10",
"Female"
);
Kalau:
person.calculateAge();
yang dipanggil:
Person.calculateAge()
Sedangkan:
employee.calculateAge();
yang dipanggil:
Employee.calculateAge()
karena Employee melakukan overriding.
33. Mental model paling sederhana
Coba hafalkan tiga konsep ini:
private
“Cuma class saya yang boleh pakai.”
Person ✅
Employee ❌
Outside ❌
protected
“Saya dan anak-anak saya boleh pakai.”
Person ✅
Employee ✅
Outside ❌
public
“Semua boleh pakai.”
Person ✅
Employee ✅
Outside ✅
Kemudian:
overriding
“Parent punya method ini, tapi child ingin mengganti cara kerjanya.”
Person
calculateAge()
↓
↓ override
↓
Employee
calculateAge()
34. Ringkasan lecture
Jadi sebenarnya lecture ini mengajarkan hubungan yang sangat erat antara inheritance + access modifier + overriding.
Person
│
┌─────────────┼─────────────┐
│ │ │
public protected private
│ │ │
↓ ↓ ↓
bisa diakses parent + hanya Person
dari mana saja child
│
↓
Employee
│
↓
bisa menggunakan
protected member
Dan untuk method:
Person
└── calculateAge()
│
│ override
↓
Employee
└── calculateAge()
Ketika:
new Employee().calculateAge();
yang digunakan adalah versi Employee.
🧠 Inti yang harus kamu bawa ke lecture berikutnya
Kalau kamu hanya mengingat 4 kalimat, ingat ini:
- Inheritance → child mewarisi fitur dari parent.
- Overriding → child mengganti implementasi method parent dengan method bernama sama.
private→ hanya bisa digunakan di class tempat dia didefinisikan.protected→ bisa digunakan di class tersebut dan child classes, tetapi tidak dari luar.
Dan perbedaan aksesnya:
Parent Child Outside
public ✅ ✅ ✅
protected ✅ ✅ ❌
private ✅ ❌ ❌
Jadi kalau muncul pertanyaan “Kenapa Employee tidak bisa mengakses dateOfBirth ketika dateOfBirth private, tetapi bisa ketika protected?”, jawabannya adalah:
Karena
privatemembatasi akses hanya ke class pemiliknya (Person), sedangkanprotectedmemperluas akses ke class pemilik dan seluruh child class-nya, sepertiEmployee.