Манипулирование ЕС6 статическое свойство класса, который является массивом


Я пытаюсь найти способ, чтобы создать статические свойства на ES6 классы и нашли решение с помощью различных переполнение стека ответы (а именно этот один и этот один).

Однако, я также хотел бы взять это шаг далее и сделать статическое свойство массива, которые могут быть обновлены/добавлены, используя специальный статический метод. Мне удалось придумать что-то, что работает. Здесь находится полная демонстрация использования класса Яблоко и статическое свойство possibleColors:

    class Apple
    {
      constructor(args = {})
      {
        this.color = args.color || 'red';
        this.description = args.description || 'An apple.';
      }
      
      static get possibleColors()
      {
        if (!this._possibleColors)
          this._possibleColors = ['red', 'green', 'yellow'];
        return this._possibleColors;
      }

      static set possibleColors(arr)
      {
        if (Array.isArray(arr))
          this._possibleColors = arr;
        else
          console.log("Possible colors must be an array.")
      }

      static addPossibleColor(c)
      {
        if (!this._possibleColors)
          this._possibleColors = this.possibleColors;
        this._possibleColors.push(c);
      }

      get color()
      {
        if (!this._color)
          this._color = '';
        return this._color;
      }

      set color(c)
      {
        if (Apple.possibleColors.includes(c))
          this._color = c;
        else
        {
          console.log(`Color '${c}' is not a valid apple color.`);
          if (!this._color)
            this._color = 'red';
        }
      }
    }

В possibleColors собственность принадлежит к классу только и не будет частью новых экземпляров. Я также принял меры, чтобы убедиться, что его значение всегда массив. Он по умолчанию красный, зеленый, и желтый, но вы можете просматривать/изменять цвета, используя обычный геттер/сеттер:

Apple.possibleColors = ['color', 'othercolor'] 

Вы также можете добавить новый цвет, как это:

Apple.addPossibleColor('newcolor')

В этом примере вся суть оказывает possibleColors статическое свойство-это окончательный список допустимых цветов, хранящихся в основной класс и предотвратить любое Яблоко экземпляры установить цвет, который не в массиве. Конечно, я могу думать о других случаях применения для этого вида техники.

Например, сейчас я пытаюсь написать свой собственный базовый компонент системы, который использует шаблоны для рисования/визуализации каждого компонента в виде HTML на странице. Основной класс (компонент или аналогичного) будет иметь статическое свойство для хранения шаблонов в массив, и вы должны выбрать шаблон из этого массива при создании компонента (или выбрать по умолчанию, если не указан).

Что я хотел бы знать:

  1. Может такой подход вызовет никаких проблем у меня не предвидится (либо в данном конкретном случае или более сложных)?

  2. Существуют ли более эффективные способы делать все, что я здесь показал?

  3. Кстати я обработки статических свойств в целом считается хорошей практикой?



Комментарии
2 ответа

Это плохая идея, чтобы изменить значения в статическом контексте, статические означает, что это ничего не меняет

static get possibleColors(){
if (!this._possibleColors){
this._possibleColors = ['red', 'green', 'yellow'];
}
return this._possibleColors;
}

Вы хотите изменить это значение в другом месте. Может быть, получив цветы от localStorage или базы данных и т. д. Позволяет сделать это с localStorage


Я использую верблюжьего и синтаксис Java, а затем обновить, где он может быть улучшен

class Apple{
//If the values are undefined, then it will default to these values
constructor({color = "red", description = "An apple"}){
this._color = color;
this._description = description;
}

//getters and setters

get color(){
return this._color; // Always has a colour
}

set color(color){ //Don't shorten parameters
if (Apple.possibleColors.includes(color)){
this._color = color;
}else{
console.log(`Color '${c}' is not a valid apple color.`);
//Don't set the color if it isn't applicable
}
}

//added
get description(){
return this._description;
}

//Static methods

static get possibleColors(){
const possibleColors = localStorage.getItem('possibleColors');
if(possibleColors){
return JSON.parse(possibleColors);
}
return ['red', 'green', 'yellow'];
}

static set possibleColors(colorArray){
if (Array.isArray(colorArray)){
localStorage.setItem('possibleColors', JSON.stringify(colorArray));
} else {
console.log("Possible colors must be an array.");
}
}

static addPossibleColor(color){
const possibleColors = Apple.possibleColors;
possibleColors.push(color);
Apple.possibleColors = possibleColors;
}
}

Инициирование класс такой же

const greenApple = new Apple({color:"green"});
console.log(greenApple.color); //green
console.log(greenApple.description); //An apple

Обратите внимание, что геттеры и сеттеры перед статическими методами. Как правило, они приходят первыми, потом пришли после других методов.

Также вы должны, вероятно, иметь статические методы в другой класс, потому что Apple это похоже на объектную модель, которая содержит только данные.

this.color -> this._color в противном случае он столкнется с get/set, то вы можете видеть в коде, что вам думает, что цвет undefined первый раз вам называется

0
ответ дан 5 февраля 2018 в 02:02 Источник Поделиться

Защитой государства требуют исполнения..

Почему бы вам использовать возможности цвета и сложный процесс проверка цвета яблоко, когда нет никакого требования в код, чтобы сделать так?

Вы используете статический список (массив) в целях защиты государства от Apple или ассоциированных государств, которые полагаются на яблоках быть определенные цвета.

Сохранение доверия в государствах-объект важен и позволяет делать предположения и упрощения кода. Он также является одним из важнейших методов кодеры управления нашего главного врага.. ошибка!

Но цепи определяется ее слабейшим звеном. Даже если поставить большой знак над ним говоря: "не дергай это ничтожно слабое звено!" вы не можете доверять кодеров, даже не себя, за один день визита является слишком заманчивым, и в то время как в спешке, чтобы удовлетворить все вы дергаете цепь.

const myApple = new Apple();  // Needs to be "Reddish" not "red"
myApple._color = "Reddish"; // Done, so much easier than wrangling the
// possibleColors static and its dificult siblings

И просто нравится, что все работы положить на защиту государства своего яблока в окно.

Программисты ленивы, они не будут мириться с осложнениями, если есть простой способ. Кодеры код производительным, и они не собираются использовать геттеры и сеттеры, когда есть прямой доступ. Поставив знак "не использовать" (_ как метафорический знак "частная") не мешает использовать.

Если вы хотите управлять цветом яблоком вы должны сделать это невозможно изменить без процесса проверки, или это бессмысленно, и бессмысленно-код-это плохой код.

0
ответ дан 5 февраля 2018 в 03:02 Источник Поделиться