Konsep OOP Sebagai Landasan Pemrograman Bagi Frontend Developer

Hello, fellow learners!

Have you ever questioned how important the OOP concept is for frontend developers? Ketika pertama kalian bertemu dengan istilah ini, mungkin kalian merasa sedikit bingung. Diperlukan waktu untuk sepenuhnya memahami pentingnya OOP dalam dunia pemrograman. Namun, hal ini juga merupakan peluang untuk memahami konsep-konsep utama dan betapa vitalnya OOP bagi seorang pengembang serta kemampuannya dalam menyelesaikan berbagai tantangan.

Memahami pentingnya konsep OOP atau Pemrograman Berbasis Objek menjadi sebuah jalan bagi kalian sebagai frontend developer untuk mengembangkan kode yang lebih terstruktur dan efisien. Di dunia pengembangan frontend, di mana fokus utamanya adalah menciptakan antarmuka pengguna yang interaktif, prinsip-prinsip OOP memberikan fondasi yang kuat.

Selain itu, konsep OOP membuktikan kebermanfaatannya ketika berhadapan dengan framework frontend terkemuka seperti React, Angular, atau Vue.js. Pemahaman ini memberikan landasan kepada kalian untuk memanfaatkan framework tersebut dengan lebih baik.

So now, let’s get to know about this concept!😊

Apa itu Object-Oriented Programming (OOP)?

Pemrograman Berorientasi Objek (OOP) adalah paradigma pemrograman yang berfokus pada konsep class dan object. Dalam dunia pemrograman, kita menggunakan class untuk membuat blok-blok kode yang dapat digunakan berulang, seolah-olah class adalah blueprints untuk menciptakan suatu object.

Lego House bg gray.png

Mirip ketika kita membangun sesuatu menggunakan balok-balok Lego. Sebagai analogi, class dapat diibaratkan sebagai kumpulan petunjuk atau buku instruksi membangun Lego, dan object adalah struktur Lego nyata yang kita bangun dengan mengikuti petunjuk itu. Kita dapat memiliki beberapa set Lego berbeda - satu untuk membuat rumah, satu untuk mobil, dan satu untuk pesawat luar angkasa. Setiap set dilengkapi dengan petunjuk khusus (class) untuk membangun suatu object tertentu (rumah, mobil, atau pesawat luar angkasa). Setiap struktur Lego (object) memiliki karakteristik dan fungsi unik berdasarkan petunjuk (class) yang kita gunakan.

Jadi, dalam dunia pemrograman, OOP memungkinkan kita membuat kumpulan petunjuk (class) yang dapat digunakan berulang kali untuk membangun sesuatu (object) dengan karakteristik unik. Dengan konsep seperti ini, kalian dapat menciptakan program-program yang lebih fleksibel, mudah dikelola, dan dapat digunakan berulang kali untuk membangun aplikasi yang lebih kompleks.

Struktur Pemrograman Berorientasi Objek

Struktur OOP.png

Struktur dasar dalam OOP terdiri dari empat elemen utama: Class, Object, Attribute dan Method. Berikut penjelasan dari masing-masing elemen:

  • Class Class merupakan tipe data yang didefinisikan oleh pengguna dan berfungsi sebagai blueprint atau cetak biru untuk menciptakan object. Class menentukan atribut (data) dan metode (fungsi) yang dimiliki oleh object yang akan dibuat berdasarkan class ini.
  • Object
    object adalah instansiasi dari sebuah class, yang memiliki atribut dan metode sesuai dengan yang telah ditentukan oleh class tersebut.
  • Attribute
    Attribute adalah variabel yang dideklarasikan di dalam class dan digunakan untuk menyimpan data atau informasi tentang objek. Attribute berperan menyimpan karakteristik atau state dari suatu objek yang dihasilkan dari class.
  • Method
    Method adalah fungsi atau tindakan yang dapat dilakukan oleh objek, yang didefinisikan di dalam class. Method ini yang menentukan perilaku atau aksi yang dapat dilakukan oleh object yang dibuat berdasarkan class.

Implementasi sederhana dari Class, Object, Attribute, dan Method dapat diilustrasikan dengan membuat sebuah class "Car" yang memiliki atribut seperti "model" dan "color," serta metode seperti "start" dan "stop”. Berikut contohnya:

class Car {
    // Atribut
    constructor(model, color) {
      this.model = model;
      this.color = color;
      this.isStarted = false;
    }
  
    // Metode untuk memulai mesin
    start() {
      if (!this.isStarted) {
        this.isStarted = true;
        console.log(`${this.color} ${this.model} has started.`);
      } else {
        console.log(`${this.color} ${this.model} is already running.`);
      }
    }
  
    // Metode untuk mematikan mesin
    stop() {
      if (this.isStarted) {
        this.isStarted = false;
        console.log(`${this.color} ${this.model} has stopped.`);
      } else {
        console.log(`${this.color} ${this.model} is not running.`);
      }
    }
  }
  
  // Membuat objek menggunakan class Car
  const myCar = new Car("Sedan", "Blue");
  const anotherCar = new Car("SUV", "Red");
  
  // Memanggil metode pada objek
  myCar.start();
  anotherCar.start();
  myCar.stop();
  

Dalam contoh ini, class "Car" digunakan sebagai blueprint untuk menciptakan dua object, yaitu myCar dan anotherCar. Objek-objek ini memiliki atribut "model" dan "color," serta dapat memanggil metode "start" dan "stop" untuk mengendalikan status mesin. Konsep inilah yang membentuk dasar dari Pemrograman Berorientasi Objek.

Prinsip Pemrograman Berorientasi Objek

Prinsip OOP.png

Untuk menulis kode OOP yang baik, kita perlu memahami 4 pilar OOP yang harus kita patuhi:

1. Encapsulation (Enkapsulasi)

Encapsulation mengacu pada konsep menyembunyikan rincian implementasi internal suatu objek dan hanya mengekspos fungsionalitas yang diperlukan. Ini dilakukan dengan menggunakan private dan public access modifiers agar objek dapat beroperasi tanpa perlu memahami seluruh kompleksitas internalnya.

2. Abstraction (Abstraksi)

Abstraksi melibatkan penyederhanaan kompleksitas dengan menentukan dan mengekspos fungsionalitas yang esensial, serta menyembunyikan detail yang tidak diperlukan. Class dan objek dalam OOP menyediakan tingkat abstraksi untuk merepresentasikan ide atau konsep secara lebih terfokus.

3. Inheritance (Pewarisan)

Pewarisan memungkinkan suatu class untuk mewarisi sifat atau perilaku dari class lainnya. Hal ini memungkinkan kita untuk memanfaatkan dan memperluas fungsionalitas yang sudah ada tanpa perlu menulis ulang kode. Class yang mewarisi disebut subclass atau child class, sedangkan class yang diwarisi disebut superclass atau parent class.

4. Polymorphism (Polimorfisme)

Polimorfisme memungkinkan suatu objek untuk memiliki banyak bentuk atau perilaku. Dengan menggunakan konsep ini, objek dapat diolah dengan cara yang berbeda tergantung pada konteks atau tipe data. Polimorfisme dapat mencakup overriding (penggantian) metode dan overloading (pembuatan beberapa versi) metode.

Kesimpulan

Konsep Pemrograman Berorientasi Objek (OOP) sangat penting, tak hanya bagi frontend developer tapi juga keseluruhan para developer. Pada artikel ini, kita telah membahas dasar-dasar OOP mulai dari definisi OOP, struktur dasar seperti class, object, atribut, dan metode, hingga prinsip-prinsip utama OOP, seperti encapsulation, abstraction, inheritance, dan polymorphism.

Dengan memahami OOP, pengembang dapat membangun kode yang lebih terstruktur, mudah dimanajemen, dan dapat digunakan kembali. Kesadaran akan konsep ini memungkinkan pengembang untuk membuat solusi yang lebih efisien dan memahami cara bekerja dengan berbagai teknologi terkini dalam pengembangan frontend. Dengan demikian, pemahaman mendalam terhadap OOP dapat memberikan landasan yang kuat untuk kesuksesan dalam pengembangan aplikasi web.

Pelajari lebih lanjut konsep OOP dengan mengikuti Kelas Gratis di BuildWithAngga seperti Kelas Online Vanilla JavaScript Pada Website Development atau dapatkan pemahaman praktikal dengan mengikuti kelas berbentuk project base seperti Kelas Online Vanilla JavaScript OOP & LocalStorage: Web Task Management.

Keep learning and see you at class!✨