Блог

В чем разница между функцией внутри функции конструктора класса и методом внутри класса, но вне функции конструктора (в js)?

Я пытался искать об этом и не нашел ничего понятного для меня!

Заранее спасибо!

   class Rectangle {
  constructor(height, width) {
    this.height = height;
    this.width = width;

    /* this function within the constructor what is it’s difference
      from the method(1) below */

    withinFunction = function () { console.log(“This is rectangle”)};
  }
  
  // Method(1)
  calcArea() {
    return this.height * this.width;
  }
}
  

В этом конкретном примере код становится жертвой того, что я называю Ужасом неявных глобалов. withinFunction является глобальной переменной (если только она не объявлена где-то, что вы не показали).

Более обычная версия такова:

 class Rectangle {
  constructor(height, width) {
    this.height = height;
    this.width = width;

    this.withinFunction = function () { console.log(“This is rectangle”)};
//  ^^^^^
  }
  
  // Method(1)
  calcArea() {
    return this.height * this.width;
  }
}
  

Разница в том, что withinFunction создается при каждом вызове конструктора и присваивается как «собственное» свойство создаваемому объекту. Напротив, calcArea (определяется с использованием синтаксиса метода) создается один раз, когда class конструкция вычисляется и помещается в объект, который назначен в качестве прототипа объектов, созданных с помощью constructor ( Rectangle.prototype ) . Таким образом, существует только одна копия calcArea , которая является общей для всех экземпляров, но withinFunction создается отдельно для каждого экземпляра.

Они оба имеют свое применение, особенно когда withinFunction создаются с использованием синтаксиса функции со стрелкой, а не традиционного синтаксиса функции.

Если вы используете class синтаксис, в целом лучше предпочесть синтаксис метода для аспекта совместного использования (хотя современные движки JavaScript очень эффективны при использовании нескольких функциональных объектов, совместно использующих один и тот же код), а также потому, что так проще имитировать прототипы функций для тестирования.