DEV Community

BekmuhammadDev
BekmuhammadDev

Posted on

2 1 1 1 1

Javascript OOP

JavaScript and Object-Oriented Programming

Obyektga yo'naltirilgan dasturlash OOP - bu dasturiy ta'minotni loyihalash va rivojlantirishda keng qo'llaniladigan yondashuv bo'lib, u ma'lumotlar va kodlarni obyektlar ko'rinishida tashkil etish orqali amalga oshiriladi. JavaScript ham OOP usullarini qo'llab-quvvatlaydi.Ob'ektga yo'naltirilgan dasturlash yoki OOP zamonaviy ilovalarni ishlab chiqish paradigmasi bo'lib, Java, C# yoki JavaScript kabi asosiy tillar tomonidan qo'llab-quvvatlanadi.

Image description

Image description

Oddiy misol JavaScript OOP ning asosiy tamoyillarini qanday amalga oshirishini ko'rishga yordam beradi. Savatingizga mahsulotlarni qo'yish va keyin to'lashingiz kerak bo'lgan umumiy narxni hisoblab chiqadigan xarid qilish holatini ko'rib chiqing. Agar siz JavaScript-dagi bilimingizni olsangiz va OOPsiz foydalanish holatini kodlasangiz, u quyidagicha ko'rinadi:

const non = {nomi: 'Non', narxi: 1};
const suv = {nomi: 'suv', nsrxi: 0.25};
Enter fullscreen mode Exit fullscreen mode

OOP istiqboli yaxshiroq kod yozishni osonlashtiradi, chunki biz ob'ektlarni haqiqiy dunyoda duch kelganimizdek o'ylaymiz. Bizning foydalanish holatimiz mahsulotlar savatini o'z ichiga olganligi sababli, bizda allaqachon ikkita turdagi ob'ektlar mavjud - savat ob'ekti va mahsulot ob'ektlari.

const savat = [];
savat.push(non);
savat.push(non);
savat.push(non);
savat.push(suv);
savat.push(suv);
Enter fullscreen mode Exit fullscreen mode

bu kod orqali savat nomli o'zgaruvchi ochiladi va maxsulotlar ya'ni non va suv push metodi orqali savat nomli o'zgaruvchiga saqlanadi va savatimizda objectlar mavjud bo'ladi

class

Image description

JavaScript-da class sinf obyektlarni yaratish va ularni boshqarish uchun qo'llaniladigan yangi sintaksisdir. Classlar ES6 ECMAScript 2015 versiyasidan boshlab qo'llab-quvvatlanadi va bu obyektga yo'naltirilgan dasturlashni amalga oshirishda katta qulaylik yaratadi.

JavaScript-da Class

Class yaratish

class Person {
  constructor(name, age, job) {
    this.name = name;
    this.age = age;
    this.job = job;
  }

  // Method
  sayHello() {
    console.log(`Hello, my name is ${this.name}`);
  }
}

// Classdan obyekt yaratish
let person1 = new Person("Alice", 25, "Designer");
person1.sayHello(); // "Hello, my name is Alice"

Enter fullscreen mode Exit fullscreen mode

Konstruktor

constructor - bu sinfda maxsus metod bo'lib, u yangi obyekt yaratilganda avtomatik ravishda chaqiriladi. Konstruktor orqali obyektning dastlabki qiymatlari o'rnatiladi.

class Animal {
  constructor(name, species) {
    this.name = name;
    this.species = species;
  }

  // Method
  speak() {
    console.log(`${this.name} makes a noise.`);
  }
}

let animal1 = new Animal("Lion", "Mammal");
animal1.speak(); // "Lion makes a noise."

Enter fullscreen mode Exit fullscreen mode

Metodlar

Class ichida metodlar aniqlash juda oson. Faqat metod nomini yozish va uni funksiya kabi belgilash kerak.

class Car {
  constructor(brand, model) {
    this.brand = brand;
    this.model = model;
  }

  startEngine() {
    console.log(`${this.brand} ${this.model} engine started.`);
  }
}

let car1 = new Car("Toyota", "Corolla");
car1.startEngine(); // "Toyota Corolla engine started."

Enter fullscreen mode Exit fullscreen mode

Statik Metodlar

Statik metodlar sinfning o'ziga tegishli bo'lib, ularni sinf nomi orqali chaqirish mumkin, obyektlar orqali emas.

class MathUtilities {
  static add(a, b) {
    return a + b;
  }
}

console.log(MathUtilities.add(5, 3)); // 8


Enter fullscreen mode Exit fullscreen mode

Meros olish

Image description

extends kalit so'zi orqali bir sinfni boshqa sinfdan meros olish mumkin. super kalit so'zi yordamida esa ota sinfning konstruktorini yoki metodlarini chaqirish mumkin.

class Employee extends Person {
  constructor(name, age, job, salary) {
    super(name, age, job); // Ota sinf konstruktorini chaqirish
    this.salary = salary;
  }

  // Method
  displaySalary() {
    console.log(`Salary: ${this.salary}`);
  }
}

let employee1 = new Employee("David", 28, "Developer", 50000);
employee1.sayHello(); // "Hello, my name is David"
employee1.displaySalary(); // "Salary: 50000"

Enter fullscreen mode Exit fullscreen mode

JavaScript-da classlar obyektga yo'naltirilgan dasturlashni qulayroq va osonroq amalga oshirish imkonini beradi. Classlar yordamida kodni tartibga solish, qayta foydalanish va kengaytirish osonlashadi. Agar qo'shimcha savollaringiz bo'lsa yoki boshqa mavzular haqida bilmoqchi bo'lsangiz, marhamat, so'rang!

Sentry blog image

How I fixed 20 seconds of lag for every user in just 20 minutes.

Our AI agent was running 10-20 seconds slower than it should, impacting both our own developers and our early adopters. See how I used Sentry Profiling to fix it in record time.

Read more

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay