Как писать переменную если не знаешь изменится ли она?

Выбор между const, let и var

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

Основное правило

// 1. Используй const по умолчанию
// 2. Если переменная изменяется, используй let
// 3. НИКОГДА не используй var

const vs let

const - для константных значений

// Правильное использование const:

// Примитивные типы (никогда не изменяются)
const PI = 3.14159;
const MAX_USERS = 100;
const APP_NAME = 'PrepBro';

// Объекты и массивы (сама ссылка не изменяется)
const user = { name: 'John', age: 30 };
const items = [1, 2, 3];

// Функции (никогда не переприсваиваются)
const calculateSum = (a, b) => a + b;

// Важно: const означает, что ссылка не изменяется,
// но содержимое объекта/массива может меняться!
user.name = 'Jane'; // Разрешено!
user.age = 31;       // Разрешено!
items.push(4);       // Разрешено!

// Но само присваивание запрещено:
user = {};           // ОШИБКА!
items = [];          // ОШИБКА!
PI = 3.14;           // ОШИБКА!

let - для изменяющихся переменных

// Используй let когда переменная ТОЧНО будет изменяться

// Счетчики
let count = 0;
count++; // Нормально

// Переменные в циклах
let sum = 0;
for (let i = 0; i < 10; i++) {
  sum += i;
}

// Переменные состояния
let isLoading = false;
isLoading = true;  // Нормально

// Аккумуляторы
let result = [];
result.push('item'); // Нормально

// Условные присваивания
let userStatus = 'inactive';
if (authenticated) {
  userStatus = 'active'; // Нормально
}

var - ЗАПРЕЩЕН!

// НИКОГДА не используй var!
// Причины:

// 1. Function scope вместо block scope
for (var i = 0; i < 5; i++) {
  // i доступно ВНЕ цикла (неожиданно!)
}
console.log(i); // 5 (может быть неприятным сюрпризом)

// 2. Hoisting (поднятие переменных)
console.log(x); // undefined (не ошибка, но странно)
var x = 5;

// 3. Можно переобъявить в одной области видимости
var x = 5;
var x = 10; // Разрешено (может быть ошибкой)

// 4. Присваивается глобальному объекту
function test() {
  var x = 5;
}
var y = 10;
console.log(window.y); // 10 (загрязнение глобального объекта)

Правильное решение: Когда const не подходит

// Ситуация 1: Заранее не известно, изменится ли переменная
// Решение: начни с const, если потребуется изменение, переделай на let

const userData = fetchUser(); // Начинаем с const
// Если позже нужно переприсвоить:
let userData = null;
if (condition1) {
  userData = fetchUser();
} else if (condition2) {
  userData = getDefaultUser();
}

// Ситуация 2: Переменная может измениться в будущем
// Решение: всё равно начинай с const и меняй при необходимости

const config = { debug: false };
// Позже:
config.debug = true; // Это OK, мы изменяем содержимое

// Если нужно переприсвоить сам объект:
let config = { debug: false };
config = { debug: true, verbose: true };

Лучшая практика: ESLint правило

// Настроить в .eslintrc:
{
  "rules": {
    "prefer-const": "error",
    "no-var": "error"
  }
}

// ESLint автоматически предложит использовать const вместо let,
// если переменная не переприсваивается

Практические примеры

// Пример 1: React компонент
function UserCard({ user }) {
  const [isEditing, setIsEditing] = useState(false);
  const [name, setName] = useState(user.name);
  
  const handleEdit = () => {
    setIsEditing(true);
  };
  
  const handleSave = async () => {
    await updateUser(name);
    setIsEditing(false);
  };

  return (
    <div>
      {isEditing ? (
        <input value={name} onChange={(e) => setName(e.target.value)} />
      ) : (
        <p>{user.name}</p>
      )}
      <button onClick={isEditing ? handleSave : handleEdit}>
        {isEditing ? 'Сохранить' : 'Редактировать'}
      </button>
    </div>
  );
}

// Пример 2: Обработка данных
const items = [1, 2, 3, 4, 5];
const filtered = items.filter(x => x > 2);
const mapped = filtered.map(x => x * 2);
const result = mapped.reduce((sum, x) => sum + x, 0);

// Все переменные используют const, потому что не переприсваиваются

Итоговая рекомендация

• const - для всех переменных по умолчанию
• let - только если переменная явно будет изменяться
• var - никогда не используй
• ESLint - используй для автоматической проверки