Bagaimana untuk menulis oop dalam javascript

Dalam pembangunan web, JavaScript telah menjadi bahasa pengaturcaraan yang sangat popular. Dalam JavaScript, pengaturcaraan berorientasikan objek (OOP) adalah konsep penting. Menggunakan OOP, anda boleh menstruktur kod anda dan mengurangkan pertindihannya, menjadikannya lebih mudah untuk diselenggara dan dilanjutkan. Artikel ini akan memperkenalkan cara menulis OOP dalam JavaScript.

1. Prototaip dan pembina

Dalam JavaScript, sifat dan kaedah sesuatu objek boleh dikongsi melalui prototaip, manakala pembina digunakan untuk Mencipta objek baharu dan memulakan sifatnya . Berikut ialah contoh mudah menggunakan pembina dan prototaip:

function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.sayHi = function() {
  console.log("Hi, my name is " + this.name + " and I'm " + this.age + " years old.");
}

var person1 = new Person("John", 30);
var person2 = new Person("Mary", 25);

person1.sayHi(); // Hi, my name is John and I'm 30 years old.
person2.sayHi(); // Hi, my name is Mary and I'm 25 years old.

Dalam contoh di atas, kami mentakrifkan Person pembina yang memulakan sifat name dan age. Kemudian, kami menggunakan Person.prototype untuk menambah kaedah Person pada setiap objek sayHi, yang boleh dikongsi oleh semua Person objek. Akhir sekali, kami mencipta dua Person objek dan memanggil kaedah sayHi mereka.

2. Kelas

Dalam ES6, JavaScript memperkenalkan konsep kelas dan menggunakan kata kunci class untuk melaksanakannya. Kelas menyediakan sintaks yang lebih bersih dan lebih mudah difahami untuk menentukan objek.

Berikut ialah contoh menggunakan kelas:

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  
  sayHi() {
    console.log("Hi, my name is " + this.name + " and I'm " + this.age + " years old.");
  }
}

let person1 = new Person("John", 30);
let person2 = new Person("Mary", 25);

person1.sayHi(); // Hi, my name is John and I'm 30 years old.
person2.sayHi(); // Hi, my name is Mary and I'm 25 years old.

Dalam contoh di atas, kami mentakrifkan kelas class menggunakan kata kunci Person dan memulakannya dalam kaedah constructor Atribut name dan age ditambah. Kemudian, kami mentakrifkan kaedah sayHi untuk mengeluarkan ucapan. Akhir sekali, kami mencipta dua Person objek dan memanggil kaedah sayHi mereka.

3. Warisan

Dalam OOP, pewarisan bermaksud memperoleh objek baharu daripada objek sedia ada, dan objek baharu mewarisi sifat dan kaedah objek asal. Dalam JavaScript, warisan boleh dicapai dengan menggunakan prototype dan class.

Berikut ialah contoh penggunaan prototype untuk melaksanakan warisan:

function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.sayHi = function () {
  console.log("Hi, my name is " + this.name + " and I'm " + this.age + " years old.");
}

function Student(name, age, major) {
  Person.call(this, name, age);
  this.major = major;
}

Student.prototype = Object.create(Person.prototype);
Student.prototype.constructor = Student;
Student.prototype.sayMajor = function() {
  console.log("My major is " + this.major + ".");
}

let person1 = new Person("John", 30);
let student1 = new Student("Mary", 25, "Computer Science");

person1.sayHi(); // Hi, my name is John and I'm 30 years old.
student1.sayHi(); // Hi, my name is Mary and I'm 25 years old.
student1.sayMajor(); // My major is Computer Science.

Dalam contoh di atas, kami mentakrifkan pembina Person dan menambah kaedah sayHi pada prototaip. Selain itu, kami mentakrifkan pembina Student, dipanggil pembina call menggunakan kaedah Person untuk memulakan sifat name dan age dan menambah sifat major. Kami kemudian membuat salinan Object.create menggunakan kaedah Person.prototype dan menetapkannya kepada Student.prototype supaya objek Student boleh mewarisi sifat dan kaedah objek Person. Akhir sekali, kami mentakrifkan kaedah sayMajor untuk mengeluarkan major pelajar. Akhir sekali, kami mencipta objek Person dan objek Student dan memanggil kaedahnya.

Berikut ialah contoh penggunaan class untuk melaksanakan warisan:

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  
  sayHi() {
    console.log("Hi, my name is " + this.name + " and I'm " + this.age + " years old.")
  }
}

class Student extends Person {
  constructor(name, age, major) {
    super(name, age);
    this.major = major;
  }
  
  sayMajor() {
    console.log("My major is " + this.major + ".");
  }
}

let person1 = new Person("John", 30);
let student1 = new Student("Mary", 25, "Computer Science");

person1.sayHi(); // Hi, my name is John and I'm 30 years old.
student1.sayHi(); // Hi, my name is Mary and I'm 25 years old.
student1.sayMajor(); // My major is Computer Science.

Dalam contoh di atas, kami mentakrifkan kelas Person dan memulakan constructor dalam kaedah name dan atribut age dan keluarkan ucapan dalam kaedah sayHi. Kemudian, kami mencipta kelas extends menggunakan kata kunci Student dan memanggil kaedah super kelas Person menggunakan kata kunci constructor untuk memulakan sifat name dan age dan menambah majorHartanah. Akhir sekali, kami mentakrifkan kaedah sayMajor untuk mengeluarkan major pelajar. Akhir sekali, kami mencipta objek Person dan objek Student dan memanggil kaedahnya.

Kesimpulan:

Dalam JavaScript, OOP ialah konsep yang sangat penting dengan menggunakan objek, pembina, prototaip dan kelas boleh menyusun kod dengan lebih baik dan mengurangkan pertindihan. Warisan boleh dicapai melalui prototaip dan kelas. Bermula dengan ES6, JavaScript memperkenalkan kata kunci class, yang menyediakan sintaks yang lebih ringkas dan mudah difahami untuk mentakrifkan objek. Apabila boleh, adalah penting untuk memilih pendekatan yang betul untuk menulis kod OOP kerana ini akan menghasilkan faedah yang ketara dalam pembangunan dan penyelenggaraan projek.

Atas ialah kandungan terperinci Bagaimana untuk menulis oop dalam javascript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!