Class & Constructor

Run Settings
LanguageJavaScript
Language Version
Run Command
/* Dalam paradigma Object-Oriented Programming (OOP), class merupakan sebuah blueprint yang dapat dikembangkan untuk membuat sebuah objek. Blueprint ini merupakan sebuah template yang di dalamnya menjelaskan seperti apa perilaku dari objek itu (berupa properti ataupun method). */ // A Class Before ES6 /* Sebelum ES6, Hal yang paling mendekati dengan class yaitu membuat sebuah objek menggunakan constructor function dan keyword new, lalu untuk menambahkan method kita gunakan konsep prototype. */ function Car(manufacture, color) { this.manufacture = manufacture; this.color = color; this.enginesActive = false; } Car.prototype.startEngines = function () { console.log('Mobil dinyalakan...'); this.enginesActive = true; }; Car.prototype.info = function () { console.log("Manufacture: " + this.manufacture); console.log("Color: " + this.color); console.log("Engines: " + (this.enginesActive ? "Active" : "Inactive")); } var johnCar = new Car("Honda", "Red"); johnCar.startEngines(); johnCar.info(); /* Pada kode di atas Car merupakan constructor function yang akan membuat instance Car baru setiap kali kode new Car() dieksekusi. Melalui Car.prototype, method startEngines() dan carInfo() diwarisi pada setiap instance Car yang dibuat, sehingga johnCar (sebagai instance Car) dapat mengakses kedua method tersebut.*/ // A Class After ES6 /* Pembuatan class pada ES6 menggunakan keyword class itu sendiri kemudian diikuti dengan nama class-nya. */ class Plane { // Sama seperti function constructor constructor(manufacture, maskapai){ this.manufacture = manufacture; this.maskapai = maskapai; this.enginesActive = false; } // Sama seperti Car.prototype.startEngine startEngines(){ console.log(`Pesawat siap lepas landas`); this.enginesActive = true; } // Sama seperti car.prototype.info info() { console.log(`Manufacture: ${this.manufacture}`); console.log(`Maskapai: ${this.maskapai}`); console.log(`Engines: ${this.enginesActive ? "Active" : "Inactive"}`); } } function br(){ console.log(""); } const myPlane = new Plane("Boeing", "Garuda Indonesia"); br(); myPlane.startEngines(); myPlane.info(); /* “Ketika kita hendak membuat sebuah constructor function ataupun class. Secara code convention (aturan penulisan), gunakan PascalCase dalam penamaannya. Contohnya Car daripada car, SportCar daripada sportCar atau Sportcar” */ //========================================================================= /* Constructor Deklarasi class menggunakan ES6 memiliki sifat yang sama seperti pembuatan class menggunakan function constructor (seperti contoh sebelumnya). Namun alih-alih menggunakan function constructor dalam menginisialisasi propertinya, class ini memisahkan constructornya dan ditempatkan pada body class menggunakan method spesial yang dinamakan constructor*/ class Motorcycle { constructor(manufacture, color, types) { this.manufacture = manufacture; this.types = types; this.color = color; this.enginesActive = false; } //menambahkan method starEngines() // Sama seperti Car.prototype.startEngine startEngines(){ console.log(`Motor Keluaran Terbaru!!`); this.enginesActive = true; } //menambahkan method info() // Sama seperti car.prototype.info info() { console.log(`Manufacture: ${this.manufacture}`); console.log(`Types: ${this.types}`); console.log(`Color: ${this.color}`) console.log(`Engines: ${this.enginesActive ? "Active" : "Inactive"}`); } } const myMotorcycle = new Motorcycle("Yamaha", "Sport Bikes", "Black"); br(); myMotorcycle.startEngines(); myMotorcycle.info();
Editor Settings
Theme
Key bindings
Full width
Lines