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)

Heroku

Build apps, not infrastructure.

Dealing with servers, hardware, and infrastructure can take up your valuable time. Discover the benefits of Heroku, the PaaS of choice for developers since 2007.

Visit Site

👋 Kindness is contagious

Dive into an ocean of knowledge with this thought-provoking post, revered deeply within the supportive DEV Community. Developers of all levels are welcome to join and enhance our collective intelligence.

Saying a simple "thank you" can brighten someone's day. Share your gratitude in the comments below!

On DEV, sharing ideas eases our path and fortifies our community connections. Found this helpful? Sending a quick thanks to the author can be profoundly valued.

Okay