Можно ли так решить проблему с глобальными переменными?

Question

[Артем Андреев]

Написав функцию создания графика у меня остались глобальные переменные:

let currentChart;
    let currentResponse;
    const createChart = (response) => {
   //Остальной код
}

Услышав здесь на Тостере,что за глобальные переменные сжигают на костре, решил вызвать анонимную функцию внутри этой, но правильно ли я сделал?:

const createChart = (response) => {
      try
         let currentChart;
         let currentResponse;
         ((response) => {
             //Очень много кода
          })(response)
        }
      catch(e) {
        console.log(e)
      }

Answer 1

[Антон Спирин]

1. Почитайте о современных модульных возможностях JavaScript.
2. Если пишите внешнюю библиотеку, то почитайте о том как правильно организуют универсальные подключаемые модули.

Comments

[Артем Андреев]

Нет нет, тут построение графика по Charts.js. эта функция просто принимает данные и строит график

[Антон Спирин]

Артем Андреев, тогда остается загадкой, зачем возникла необходимость в использовании переменных за ее пределами.

[Артем Андреев]

Антон Спирин, Там хранятся состояния. График обновляется и предыдущие данные удаляются.

onst createChart = (response) => {
  try {
    let currentChart;
    let currentResponse;
       ((response) => {
          if (typeof currentChart != 'undefined') {
             currentChart.destroy();
        }
        currentResponse = response;
} catch (e) {
console.log(e);
}
})(response);
}

[Антон Спирин]

Артем Андреев, вы похоже не понимаете, что у вас модуль, который работает с состоянием. Тут надо полностью менять подход к реализации.

class MyChart {
  constructor() {}
  update() {}
  onUpdate() {}
  render() {}
}

[Артем Андреев]

Антон Спирин,

onst createChart = (response) => {
  try {
    let currentChart;
    let currentResponse;
       ((response) => {
          if (typeof currentChart != 'undefined') {
             currentChart.destroy();
        }
        currentResponse = response;
        //даже если он здесь так создается?
         currentChart = new Chart(chart, {
          type: 'line',
          data: dataChart,
          options: chartOptions,
      })
} catch (e) {
console.log(e);
}
})(response);
}

[Антон Спирин]

Артем Андреев, сейчас ваша функция называется createChat, а на деле это createNewOrDestroyOldAndCreateNewChatWithGlobalStateUsing. Так код лучше не писать. Делайте обертку с явным интерфейсом.

[Артем Андреев]

Антон Спирин, хорошо. Значит лучше сделать класс?

[Антон Спирин]

Артем Андреев, вам надо организовать модуль. Каким образом это лучше сделать зависит от вашего стиля кода. Можно использовать для этого класс.

[Артем Андреев]

Антон Спирин, большое спасибо, у меня просто еще мало знаний, но вроде я начинаю видеть, когда все плохо)
Хорошего вам дня)