30 Hari Belajar JavaScript : Hari ke — 17
--
Halo! Semuanya, selamat datang kembali di series 30 hari belajar JavaScript. Pada Hari ke 17, kita akan mempelajari beberapa module berikut: 🍈
- Public Class Field pada JavaScript
- Private Class Field pada JavaScript
- Private Method pada JavaScript
- Operator Instanceof pada JavaScript
- Static Class Field
Tanpa berlama-lama lagi, mari kita gaskan! 🍉
Public Class Field pada JavaScript
Seperti yang telah kita ketahui bahwa, ketika kita ingin menambahkan property yang berisi value (field) di constructor. Kita harus memperhatikan yang namanya access modifier, access modifier secara ssederhana yaitu sebuah konsep dalam OOP yang mengontrol akses dan visibilitas dari sebuah variabel, method, atau kelas dalam sebuah program. Ada banyak access modifier dalam OOP diantaranya yaitu public, private dan lain-lain. Namun disini kita akan terlebih dahulu membahas tentang public. Public artinya bisa diakses dari luar class, dan private hanya bisa diakses dari dalam class saja. Untuk membuat public class field, kita bisa langsung buat nama field dengan value nya selevel dengan method. Jika kita tidak memasukkan value ke dalam field tersebut, artinya field tersebut memiliki value yaitu undefined. 🍊
class Customer {
firstName;
lastName;
balance = 0
constructor(firstName, lastName) {
this.firstName = firstName
this.lastName = lastName
}
}
const john = new Customer("John", "Doe")
console.log(john);
Private Class pada JavaScript
Berbeda dengan public class, private class hanya dapat diakses dari dalam kelas itu sendiri. Variabel, method, atau kelas ini tidak dapat diakses dari kelas lain. Jika kita ingin membuat field yang bersifat private (hanya bisa diakses di dalam class), kita bisa menggunakan tanda # sebelum nama field nya 🍋.
class Counter {
#counter = 0
increment() {
this.#counter++
}
decrement() {
this.#counter--
}
get() {
return this.#counter
}
}
const counter = new Counter()
counter.increment()
counter.increment()
counter.increment()
counter.increment()
counter.increment()
console.info(counter.get())
Private Method pada JavaScript
Dengan fitur ini, kita dapat menandai sebuah method sebagai “private” dengan menambahkan tanda “#” di awal method. Hal ini akan membuat method tersebut hanya bisa diakses dari dalam kelas atau objek yang sama. Namun, fitur ini masih dalam tahap usulan dan belum menjadi standar resmi dari JavaScript. Sehingga, tidak semua browser atau lingkungan pemrograman JavaScript mendukung fitur ini 🍍.
class Customer {
say(name) {
if (name) {
this.#sayWithName(name)
} else {
this.#sayWithoutName()
}
}
#sayWithName(name) {
console.log(`Selamat datang ${name}`)
}
#sayWithoutName() {
console.log(`Selamat Datang!`)
}
}
const customer = new Customer()
customer.say("Budi")
Operator Instanceof Pada JavaScript
kadang-kadang kita butuh ngecek nih, apakah sebuah objek itu dibuat dari suatu class tertentu atau nggak. Tapi kita nggak bisa pake operator “typeof” karena kalau objek itu dibuat dari class, hasilnya bakal jadi “object” aja. Solusinya, kita bisa menggunakan operator “instanceof” untuk ngecek apakah objek itu beneran instance dari class yang kita cari atau nggak. Hasilnya bakal jadi boolean, true kalau beneran instance-nya, atau false kalau nggak 🥭.
class Kucing {
}
class Kambing {
}
const kucing = new Kucing()
const kambing = new Kambing()
console.log(kucing instanceof Kucing);
console.log(kucing instanceof Kambing)
console.log(kambing instanceof Kambing)
console.log(kambing instanceof Kambing)
Static Class Field pada JavaScript
biasanya ketika kita bikin field atau method di sebuah class, secara otomatis field-nya jadi properti di instance object, dan method-nya jadi function di prototype object. Tapi, kadang-kadang kita pengen bikin field atau method yang ga terikat dengan object-nya, artinya ga jadi properti atau function di prototype. Nah, untuk bikin field atau method yang ga terikat dengan object, kita bisa pake kata kunci “static”. Kalo kita tambahin “static” di depan field atau method, maka field atau method itu ga akan jadi properti atau function di prototype object. Jadi, bisa dipanggil langsung dari class-nya aja tanpa harus bikin instance object dulu 🍎.
Namun, kalau kita tambahkan “static” di class field, maka field tersebut bukan lagi milik instance object, tapi jadi milik class-nya sendiri. Nah, biasanya “static” digunakan kalo kita ingin bikin field atau function yang bukan bergantung sama instance object. Misalnya, kalau kita bikin function untuk ngitung luas atau keliling, kan tidak ada hubungannya sama objek-objek yang dibuat. Terus, cara mengakses static class field juga beda dari biasanya. Kalo biasanya kita akses lewat objek yang dibuat dari class, kalau yang static ini kita akses langsung lewat class-nya. Yang penting diingat dan perlu kita perhatikan ialah, kalau field atau function yang dijadikan static itu bisa dianggap sebagai global. Artinya, hasilnya akan sama, tidak peduli dari mana yang akses 🍏.
class Configuration {
static name = "App"
static version = 1.0
}
console.info(Configuration.name)
console.info(Configuration.version)
Halo! Saya Bahrul Rozak, seorang mahasiswa dari Universitas Muhammadiyah Prof. DR. HAMKA. Saya memiliki pengalaman sebagai web developer di sebuah institusi dan telah membuat serta mengembangkan aplikasi internal menggunakan bahasa pemrograman JavasScript dan PHP, serta menggunakan framework PHP seperti Laravel, codeigniter, dan Vue Js. Saya juga pernah memimpin sebuah tim proyek yang terdiri dari divisi Front End dan Back End, di sana saya belajar banyak hal, terutama tentang kolaborasi dalam tim. Selain itu, saya memiliki hobi terkait desain web dan menulis artikel tentang teknologi. Saya sangat suka tantangan yang memacu adrenalin karena saya percaya bahwa more complex more adrenaline. Jika Anda ingin tahu lebih banyak tentang saya atau ingin berkolaborasi, silakan hubungi saya melalui email di bahrulrozak02@gmail.com atau follow media sosial saya untuk mendapatkan insight terbaru dalam perduniawian di.
Instagram : https://instagram.com/rozak.dexamethasone
Linkedin : https://linkedin.com/in/bahrul-rozak
Stackoverflow : https://stackoverflow.com/users/20835639/bahrul-rozak
Github : https://github.com/Bahrul-Rozak
