Написание класса в JavaScript

Мы знаем, что в JavaScript нет концепции классов. Все экземпляры классов наследуют свойства от одного и того же прототипа, поэтому прототип является ядром класса.

Классы являются абстракцией объектов, а объекты — это конкретные экземпляры классов. Классы абстрактны и не занимают память, а объекты конкретны и занимают пространство хранения. — Википедия

Ранние потребности JavaScript были очень простыми, в основном写成 функций, затем стали использоваться процедурные подходы, а затем постепенно внедрялись идеи объектно-ориентированного программирования, в конечном итоге они стали писаться как классы.

В JavaScript, по сути, все写成 классы являются конструкторами + прототипами. Далее обсудим несколько способов записи классов в JavaScript:

Метод конструктора

/**
* Класс Person: определяет человека, у него есть атрибут name и метод getName
  */
<script>
  function Person(имя) {
    this.имя = имя;
    this.getName = function(){
      return this.имя;
    }
  }
  // Здесь мы создаем несколько объектов
  var p1 = new Person("trigkit4");
  var p2 = new Person("mike");
  console.log(p1 instanceof Person); // true
  console.log(p2 instanceof Person); // true
</script>

Как можно увидеть из вывода в консоли, p1 и p2确实是Person класса объектов.

Преимущества этого метода заключаются в том, что мы можем создавать различные экземпляры объектов в зависимости от параметров, но недостатком является то, что каждый раз при создании экземпляра объекта генерируется метод getName, что вызывает浪费 памяти.

Мы можем использовать внешнюю функцию для замены классового метода, что позволяет каждому объекту делиться одним и тем же методом. Переписанный класс будет выглядеть так:

// Внешняя функция
<script>
  function getName() {
    return this.имя;
  }
  function Person(имя) {
    this.имя = имя;
    this.getName = getName;
  }
</script>

Метод прототипа

<script>
  function Person() {};
  Person.prototype.имя = "trigkit4"; // Свойства класса располагаются на прототипе
  Person.prototype.getName = function() {
    return " I'm " + this.имя;
  }
  var p1 = new Person();
  var p2 = new Person();
  console.log(p1.имя); // trigkit4
  console.log(p2.getName()); // I'm trigkit4
</script>

Недостатком метода прототипа является то, что объекты не могут быть созданы с помощью параметров (обычно свойства каждого объекта различаются), а его преимуществом является то, что все объекты делят метод getName (по сравнению с методом конструктора), что не приводит к浪费у памяти.

Конструктор + прототип
Используя优点 первых двух методов:
a) Определение свойств класса (поля) с помощью конструктора.
b) Определение методов класса с помощью прототипа.

<script>
  function Person(имя) {
    this.имя = имя;
  }
  // Свойства прототипа позволяют объектам делиться методом getName
  Person.prototype.getName = function() {
    return " I'm " + this.имя;
  }
</script>

Таким образом, мы можем создавать объекты с различными свойствами и делить методы между экземплярами объектов, что не приводит к浪费у памяти.

Чтобы сделать код JavaScript более компактным, мы помещаем код методов prototype в фигурные скобки function Person.

<script>
  function Person(имя) {
    this.имя = имя;
    Person.prototype.getName = function() {
      return имя; // не рекомендуется использовать this.имя
    }
  }
  var p1 = new Person('trigkit4');
  console.log(p1.getName()); // trigkit4
</script>

Здесь нам нужно знать несколько способов определения класса, помимо上面的 конструктора, таких как:

Метод Object.create()
С помощью этого метода, "класс" является объектом, а не функцией.

 var Person = {
    имя : "trigkit4",
    возраст : 21,
    run: function() {
      alert("Мне нравится бегать");
    }
  }

Затем, напрямую используйте Object.create() для создания экземпляров, не needing new.

var p1 = Object.create(Person);
  alert(p1.age); // 21
  p1.run(); // Мне нравится бегать

Этот метод проще, чем "метод конструктора", но он не может реализовать частные свойства и частные методы, объекты экземпляра также не могут делиться данными, имитация класса не полна.

Метод createNew()
Этот метод не требует использования this и prototype, его суть заключается в том, чтобы использовать объект для имитации класса, затем определить конструктор createNew() в классе, а затем определить объект экземпляра в createNew(), и вернуть этот объект экземпляра в качестве значения возвращения.

<script>
  var Person = {
    createNew : function () {
      var person = {};
      person.name = "trigkit4";
      person.run = function() {
        alert("Мне нравится бегать");
      };
      return person;
    }
  }
</script>

При использовании вызывайте метод createNew(), чтобы получить объект экземпляра.

 var p1 = Person.createNew();
  p1.run(); // Мне нравится бегать

Этот способ на самом деле очень похож на способ записи литерального объекта, только одно различие - это разделители,一个是 запятая, а другой точка с запятой.

Вот и все, что есть в этой статье, надеюсь, это поможет вам в изучении. Также希望大家多多支持呐喊教程。

Заявление: содержание этой статьи взято из Интернета, авторские права принадлежат соответствующему автору. Контент предоставлен пользователями Интернета, загружен самостоятельно, сайт не обладает правами собственности, не undergone人工编辑处理, nor assumes any related legal liability. Если вы обнаружите спорное содержимое, пожалуйста, отправьте письмо по адресу: notice#oldtoolbag.com (при отправке письма, пожалуйста, замените # на @) для сообщения о нарушении, и предоставьте соответствующие доказательства. При подтверждении факта нарушения, сайт немедленно удаляет спорное содержимое.