TypeScript adalah superset dari Javascript, ia memiliki semua yang dimiliki Javascript ditambah sintaks tambahannya, ini adalah bahasa yang diketik. Jadi apa itu pemrograman berorientasi objek?

Pemrograman berorientasi objek adalah paradigma pemrograman yang mengatur kode menjadi objek yang merupakan instance kelas. ia memiliki enam konsep utama yaitu:

  1. Kelas: Kelas berfungsi sebagai cetak biru atau templat untuk membuat objek. Mereka mendefinisikan properti dan perilaku yang dimiliki objek kelas tersebut.
  2. Objek: Objek adalah turunan dari kelas. Mereka mewakili entitas individu dengan keadaan dan perilaku unik mereka sendiri. Setiap objek memiliki kumpulan nilai sendiri untuk properti yang ditentukan di kelasnya.
  3. Enkapsulasi: Enkapsulasi adalah cara untuk membatasi akses langsung ke beberapa komponen objek. Hal ini memungkinkan penyembunyian data dan melindungi keadaan internal suatu objek dari akses langsung oleh bagian lain dari program.
  4. Warisan: Warisan memungkinkan kelas mewarisi properti dan metode dari kelas lain. Ini membentuk hubungan induk-anak antar kelas, di mana kelas anak (subkelas) dapat mewarisi dan memperluas atribut dan perilaku kelas induk (superkelas).
  5. Polimorfisme:Polimorfisme adalah konsep yang mengacu pada kemampuan variabel, fungsi, atau objek untuk mengambil berbagai bentuk.
  6. Abstraksi: Abstraksi adalah proses menyembunyikan detail internal aplikasi dari dunia luar. Abstraksi digunakan untuk mendeskripsikan sesuatu secara sederhana.

Cukup teorinya, Mengingat blok kode di bawah ini, mari kita definisikan bidang kelas sederhana dan tambahkan beberapa anggota ke dalamnya, properti x, dan y bertipe nomor, jadi jika kita menetapkan string tipe ke salah satu dari x atau y , kita akan menghasilkan kesalahan tipe 'string' tidak dapat ditetapkan ke tipe 'angka'. ini adalah salah satu manfaat skrip ketikan, ini membantu menjaga kode kita tetap terkendali dan memastikan keseragaman.

class Calculation {
  x: number;
  y: number;

  constructor(x, y) {
    this.x = x;
    this.y = y;
  }
}
 
const cal = new Calculation ();
cal.x = 0;
cal.y = "0"; // this will generate an error of type string is not 
             // assignable to type string

Mengingat blok kode di bawah ini, sebuah bidang dapat diawali dengan pengubah hanya baca, hal ini mencegah penetapan atau modifikasi pada bidang di luar konstruktor. Metode err akan menghasilkan kesalahan karena properti z adalah hanya dapat dibaca dan karenanya tidak dapat diubah.

class Calculation {
  x: number;
  y: number;
  readonly z: number = 10;

  constructor(x, y) {
    this.x = x;
    this.y = y;
  }

  err() {
      this.z = 20; //this will generate an error
    }
}
 
const cal = new Calculation();
cal.x = 0;
cal.y = 0;

Konstruktor

Konstruktor kelas mirip dengan fungsi, Anda bisa menambahkan parameter ke dalamnya dengan anotasi tipe, Anda juga bisa memberinya nilai default, dan bisa juga dibebani. Blok kode yang dikomentari //OVERLOADED adalah contoh konstruktor yang kelebihan beban,

class Point {
  x: number;
  y: number;
  readonly z: number = 10;

//x and y has a default value of 5 here
  constructor(x = 5, y = 5) { 
    this.x = x;
    this.y = y;
  }

  err() {
      this.z = 20; //this will generate an error
    }
}
 
const cal= new Calculation();
cal.x = 0;
cal.y = 0;


//OVERLOADED
// an overloaded constructor will look something like this
class Calculation {
  // Overloads
  constructor(x: number, y: string);
  constructor(s: string);
  constructor(xs: any, y?: any) {
    // TBD
  }
}

panggilan super

Sama seperti Javascript, jika Anda memiliki kelas induk, Anda perlu memanggil metode super di konstruktor Anda sebelum memanggil anggota ini mana pun. lupa memanggil metode super dalam Javascript adalah kesalahan yang mudah, namun skrip ketikan akan memberi tahu Anda di mana dan kapan diperlukan.

class Constant{
  k = 4;
}
 
class Calculation extends Constant{
  constructor() {
     console.log(this.k) //this will generate an error
    // 'super' must be called before accessing 'this' in the constructor
    // of a derived class.
    super();
  }
}

Metode

Properti fungsi pada kelas disebut metode, ia dapat menggunakan anotasi tipe, karena ini membantu untuk terus memeriksa tipe data apa yang dikembalikan fungsi Anda, selain itu, skrip ketikan akan memberi tahu Anda.

class Calculation {
  x = 10;
  y = 10;
 
//if anything other than a number is returned, typescript will inform you
  addition(x, y): number{
    return x + y; 
  }
}

Pengambil dan Penentu

Kelas juga dapat memiliki aksesor,apa artinya ini, jika Anda ingin mendapatkan akses ke beberapa nilai atau properti atau menyetel atau memberi nilai pada properti dari suatu kelas, Anda dapat melakukannya melalui Getter dan Setter.

Catatan:TypeScript memiliki beberapa potongan pada aksesoryang meliputi:

  • jika kita memiliki properti get namun tidak memiliki properti set maka properti get secara otomatis disetel ke readonly.
  • jika jenis penyetel tidak ditentukan, maka secara otomatis akan disimpulkan dari kembalinya pengambil.
  • pengambil dan penyetelharus memiliki anggota visibilitas yang sama yaitu jika pengambilbersifat publik atau pribadi, penyetelharus menjadi publik atau pribadi juga.
class Calculate {
  _PI = 3.142;
  x: 10;
  get constantPI() {
    return this._PI;
  }
  set setX(value) {
    this.x= value;
  }
}

Warisan Kelas

Sama seperti bahasa pemrograman lainnya, kelas pada Javascript dapat mewarisi dari kelas induknya, dan hal ini dapat dilakukan dengan kata kunci implements.

mengimplementasikan klausa

Sebelum saya menjelaskan cara menggunakan implement, izinkan saya menjelaskan dengan cepat apa itu antarmuka, antarmukaitu seperti cetak biru atau sekumpulan aturan yang mendefinisikan bagaimana suatu objek seharusnya terlihat atau berperilaku. Ini mendeskripsikan struktur dan bentuk suatu objek dengan menentukan nama propertinya dan tipe nilai yang harus dimiliki properti tersebut. Contoh kode di bawah menjelaskan tampilan antarmuka.

interface Person {
  name: string;
  age: number;
}

jadi mari kita kembali ke cara mewarisi dari kelas dasar dengan implement. Anda dapat menggunakan klausa implement untuk memeriksa apakah suatu kelas memenuhi antarmuka tertentu >. Kesalahan akan dikeluarkan jika kelas gagal mengimplementasikannya dengan benar.

Catatan:Saat kita menggunakan klausa implement di TypeScript, itu berarti kelas berjanji untuk mengikuti aturan yang ditentukan oleh antarmuka. Namun, penting untuk dipahami bahwa penggunaan implements tidak benar-benar mengubah kelas atau metodenya. Itu hanya cara untuk mengatakan bahwa kelas akan memiliki properti dan metode yang sama seperti yang didefinisikan dalam antarmuka.

interface GrandParents {
  Chidren(): void;
}
 
class Parents implements GrandParents{
  children() {
    console.log("John", "Alli");
  }
}
 
class GrandChild implements GrandParents{
// Class 'GrandChild 'incorrectly implements interface 'GrandParents'.
// Property 'children' is missing in type 'GrandChild' 
// but required in type 'GrandParents'.
  child() {
    console.log("Doe");
  }
}

memperluas klausa

Kelas juga dapat diperluas dari kelas dasar, atau kelas induk. Turunan atau subkelas akan memiliki semua properti kelas dasar ditambah properti dan metode tambahannya sendiri.

dari contoh kode di bawah ini, kita dapat melihat kelas Anjing yang diwarisi dari hewan dan juga memiliki properti pakannya sendiri.

class Animal {
  move() {
    console.log("Moving along!");
  }
}
 
class Dog extends Animal {
  woof(times: number) {
    for (let i = 0; i < times; i++) {
      console.log("woof!");
    }
  }
}
 
const dog = new Dog();
// Base class method
dog.move();
// Derived class method
dog.woof(3);

Metode Penggantian

Saya akan menjelaskan ini dalam logika sederhana, mari kita asumsikan kita memiliki kelas dasar Animal dengan metode makeSound, dan turunan atau subkelas dari Dog, metode overriding adalah ketika kelas Dog menyediakan versinya sendiri makeSound karena semua hewan tidak terdengar sama. dan proses ini adalah bagaimana turunan atau subkelas mengambil alih properti dan metode kelas dasar atau kelas induk.

Melihat kode di bawah, kelas dasar memiliki metode salam dan kelas turunan mewarisi metode salam dan menimpanya dengan mengaturnya berdasarkan logikanya sendiri. Kelas turunan harus mengikuti kontrak kelas dasarnya. Ingatlah bahwa sangat umum (dan selalu sah!) untuk merujuk ke instance kelas turunan melalui referensi kelas dasar:

class Base {
  greet() {
    console.log("Hello, world!");
  }
}
 
class Derived extends Base {
  greet(name?: string) {
    if (name === undefined) {
      super.greet();
    } else {
      console.log(`Hello, ${name.toUpperCase()}`);
    }
  }
}
 
const dog = new Derived();
dog.greet();
dog.greet("reader");

Visibilitas Anggota

Ini pada dasarnya adalah logika enkapsulasi, TypeScript menggunakan logika ini untuk mencegah beberapa metode dan properti tersedia atau tidak di luar kelas.

publik

Visibilitas default properti atau metode kelas apa pun adalah publik, dan metode atau properti dengan tag publik tersedia di dalam dan di luar kelas, seperti yang dapat kita lihat dari kode di bawah, makeSound tersedia untuk anggotanya dan di luar kelas.

class Animal{
  public makeSound() {
    console.log("make sound");
  }
}
const dog= new Animal();
dog.makeSound();

dilindungi

Tag yang dilindungi hanya membuat properti dan metode tersedia bagi anggota dan subkelasnya. Dengan mempertimbangkan kode di bawah ini, properti name tersedia untuk kelas dan subkelas.

class Animal {
  protected name: string;

  constructor(name: string) {
    this.name = name;
  }

  protected makeSound() {
    console.log(`${this.name} makes a sound.`);
  }
}

class Dog extends Animal {
  constructor(name: string) {
    super(name);
  }

  public bark() {
    console.log(`${this.name} barks loudly!`);
    this.makeSound();
  }
}

const dog = new Dog("Buddy");
dog.bark(); // Output: Buddy barks loudly!
            //         Buddy makes a sound.

pribadi

private sama seperti dilindungi, tetapi tidak mengizinkan properti atau tag metode apa pun tersedia untuk subkelas, mereka hanya tersedia untuk anggotanya.

class Animal {
  private name: string;

  constructor(name: string) {
    this.name = name;
  }

  private sleep() {
    console.log(`${this.name} is sleeping.`);
  }

  public wakeUp() {
    console.log(`${this.name} wakes up.`);
    this.sleep(); // Private method called within the class
  }

  public makeSound() {
    console.log(`${this.name} makes a sound.`);
  }
}

const animal = new Animal("Lion");
animal.wakeUp(); // Output: Lion wakes up. Lion is sleeping.
animal.makeSound(); // Output: Lion makes a sound.
// animal.name will generate an error, as it'a private property

Kesimpulan

Masih banyak lagi yang perlu dipelajari tentang OOP di TypeScript, dokumentasi TypeScript adalah tempat yang baik untuk mempelajari lebih lanjut tentang OOP, klik"LINK" untuk membaca lebih lanjut.

Dukungan Anda sangat penting bagi saya, jika Anda menyukai cerita ini dan ingin mendukung saya, tolong beri saya tepuk tangan. Juga jika Anda ingin terhubung dengan saya melalui LinkedIn, Twitter, atau GitHub silakan.