OOP veya Nesne Yönelimli Programlama, kodunuzu daha mantıklı ve yönetilebilir bir şekilde düzenlemenize yardımcı olabilir ve gelecekte kodunuzu yeniden kullanmayı ve genişletmeyi kolaylaştırabilir.

JavaScript'te, nesne yönelimli programlama (OOP), belirli görevleri gerçekleştirmek için birlikte çalışan veri ve işlev koleksiyonları olan "nesneler" kavramına dayanan bir programlama paradigmasıdır.

OOP'de nesneler, oluşturdukları nesnelerin özelliklerini ve yöntemlerini tanımlayan şablonlar olan "sınıflardan" oluşturulur.

OOP'nin Avantajları

JavaScript'te OOP kullanmanın en önemli avantajlarından biri, kodunuzu daha mantıklı ve yönetilebilir bir şekilde düzenlemenize izin vermesidir. OOP ile gerçek dünyadaki nesneleri temsil eden sınıflar oluşturabilir ve bu nesnelerin sahip olduğu özellikleri ve yöntemleri tanımlayabilirsiniz. Bu, özellikle karmaşıklığı arttıkça kodunuzu anlamayı ve kodla çalışmayı kolaylaştırır.

JavaScript veya programlamada OOP'nin bir başka yararı da, kodun yeniden kullanılmasına ve genişletilebilirliğe izin vermesidir.

Bir sınıf tanımladıktan sonra, o sınıftan istediğiniz kadar nesne oluşturabilirsiniz. Her nesne için aynı kodu tekrar tekrar yazmanız gerekmediğinden bu size çok zaman ve emek kazandırabilir.

Ek olarak, mevcut kodun işlevselliğini yeniden kullanmanıza ve genişletmenize olanak tanıyan mevcut sınıflardan miras alan yeni sınıflar oluşturabilirsiniz.

OOP'ye başlarken

JavaScript'te OOP'ye başlamak için önce sınıf kavramını anlamanız gerekir. JavaScript'te sınıf, oluşturduğu nesnelerin özelliklerini ve yöntemlerini tanımlayan bir şablondur. İşte bir kişiyi temsil eden basit bir sınıf örneği:

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  greet() {
    console.log(`Hi, my name is ${this.name} and I am ${this.age} years old.`);
  }
}

Bu sınıftan bir nesne oluşturmak için, newanahtar kelimeyi ve ardından sınıfın adını kullanırsınız, bunun gibi:

const person1 = new Person("John", 25);
const person2 = new Person("Jane", 30);

console.log(person1.name);  // Output: "John"
console.log(person2.age);  // Output: 30
person1.greet();  // Output: "Hi, my name is John and I am 25 years old."

JavaScript'te OOP, sınıfları tanımlamaya ve nesne oluşturmaya ek olarak kalıtıma da izin verir. Bu, mevcut sınıfların özelliklerini ve yöntemlerini miras alan yeni sınıflar oluşturabileceğiniz anlamına gelir. Örneğin, Studentbir okuldaki bir öğrenciyi temsil eden bir sınıf oluşturmak istediğinizi varsayalım. Sınıf , Studentşu şekilde sınıftan miras alabilir Person:

class Student extends Person {
  constructor(name, age, school) {
    super(name, age);
    this.school = school;
  }
  info() {
    console.log(`${this.name} is ${this.age} years old and goes to ${this.school}.`);
  }
}

OOPS'un Dört Sütunu

JavaScript'teki nesne yönelimli programlamanın (OOP) dört ayağı şunlardır:

Kapsülleme:

Kapsülleme, verileri ve işlevselliği bir nesnenin içinde bir araya getirme fikrini ifade eder. OOP'de nesneler, kodunuzun temel yapı taşlarıdır ve her nesnenin kendi özellikleri ve yöntemleri vardır. Bu, kodunuzu anlamayı ve üzerinde çalışmayı kolaylaştıracak şekilde düzenlemenizi sağlar.

Örneğin , ve gibi özelliklere ve ve gibi yöntemlere Personsahip bir sınıf oluşturabilirsiniz .nameagegreet()introduce()

Soyutlama:

Soyutlama, bir nesnenin uygulanmasının ayrıntılarını gizleme ve yalnızca gerekli bilgileri kullanıcıya gösterme işlemidir. OOP'de, kodunuzu daha modüler ve esnek hale getirmek için soyutlamayı kullanabilirsiniz.

Örneğin, ilgili nesnelerin bir grubu için ortak bir arabirim sağlayan soyut bir sınıfı, bu nesnelerin nasıl uygulandığını belirtmeden tanımlayabilirsiniz.

Miras:

Kalıtım, mevcut sınıfların özelliklerini ve yöntemlerini miras alan yeni sınıflar oluşturma işlemidir. Bu, size zaman ve çaba kazandırabilecek mevcut kodu yeniden kullanmanıza ve genişletmenize olanak tanır.

Örneğin, Personbir kişi için ortak özellikleri ve yöntemleri tanımlayan bir sınıfınız varsa, Studentsınıftan miras alan Personve ek işlevler ekleyen bir sınıf oluşturabilirsiniz.

Polimorfizm:

Polimorfizm, farklı nesnelerin aynı yöntem çağrısına farklı şekillerde yanıt verme yeteneğidir. OOP'de polimorfizm, ortak bir arabirimi paylaşan ancak farklı uygulamaları olan nesneler oluşturmanıza olanak tanır. Bu, kodunuzu daha esnek hale getirir ve bakımı daha kolay ve genişletilebilir olan kod yazmanıza olanak tanır.

Örneğin, Shapeortak bir yöntemi tanımlayan bir sınıf oluşturabilir ve ardından her biri yöntemi kendi yöntemiyle uygulayan draw()farklı şekil türleri (örn . Circle, , vb.) için alt sınıflar oluşturabilirsiniz.Rectangledraw()

İşte bu OOP sütunlarının bir JavaScript programında nasıl kullanılabileceğine dair bir örnek:

// Encapsulation: define a Person class with properties and methods
class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  greet() {
    console.log(`Hi, my name is ${this.name} and I am ${this.age} years old.`);
  }
}

// Inheritance: define a Student class that inherits from the Person class
class Student extends Person {
  constructor(name, age, school) {
    super(name, age);
    this.school = school;
  }
  info() {
    console.log(`${this.name} is ${this.age} years old and goes to ${this.school}.`);
  }
}

// Abstraction: define an abstract Shape class with a common draw() method
abstract class Shape {
  abstract draw(): void;
}

// Polymorphism: define subclasses of Shape that implement the draw() method in their own way
class Circle extends Shape {
  draw() {
    console.log("Drawing a circle...");
  }
}
class Rectangle extends Shape {
  draw() {
    console.log("Drawing a rectangle...");
  }
}

Nesne yönelimli programlama, JavaScript'te temel bir kavramdır ve kodunuzun yapısını ve organizasyonunu büyük ölçüde geliştirebilir. Kapsülleme, kalıtım ve polimorfizm gibi kavramları anlayıp uygulayarak daha verimli ve sürdürülebilir programlar oluşturabilirsiniz.

İster yeni başlayan ister deneyimli bir geliştirici olun, JavaScript'te OOP'de uzmanlaşmak için zaman ayırmanız uzun vadede karşılığını verecektir. Okuduğunuz için teşekkürler ve mutlu kodlamalar.

CSS FlexBox hakkında derinlemesine bilgi edinmek istiyorsanız , bu E- Kitaba göz atın