Главная страница » JavaScript » 30. Константы

30. Константы

Константы в JavaScript — это переменные, значения которых не могут быть изменены после их инициализации. Использование констант помогает сделать код более надежным и понятным. В этом уроке мы рассмотрим, как объявлять константы, их особенности и лучшие практики использования.

Основные концепции

Объявление констант

Для объявления констант используется ключевое слово const.
Константы должны быть инициализированы при объявлении, и их значение не может быть изменено позже.

				
					const PI = 3.14159;
const MAX_USERS = 100;

Особенности констант

Константы являются блочными (block-scoped), что означает, что они доступны только в том блоке, где были объявлены.
Константы не могут быть переопределены или повторно объявлены в пределах одного и того же блока.

				
					{
  const MY_CONSTANT = 'Hello';
  console.log(MY_CONSTANT); // 'Hello'
}
console.log(MY_CONSTANT); // Ошибка: MY_CONSTANT не определена

Константы и объекты

Константы могут содержать объекты и массивы. Хотя ссылка на объект не может быть изменена, внутренние свойства объекта или элементы массива могут быть изменены.

				
					const USER = {
  name: 'Alice',
  age: 25
};

// Можно изменить свойства объекта
USER.name = 'Bob';
console.log(USER.name); // 'Bob'

// Нельзя изменить саму ссылку на объект
// USER = {}; // Ошибка

Примеры

Пример с простыми значениями

				
					const MAX_HEIGHT = 180;
const MIN_HEIGHT = 150;

function isWithinHeightRange(height) {
  return height >= MIN_HEIGHT && height <= MAX_HEIGHT;
}

console.log(isWithinHeightRange(160)); // true
console.log(isWithinHeightRange(190)); // false

Пример с объектами

				
					const CONFIG = {
  apiUrl: 'https://api.example.com',
  timeout: 5000
};

function fetchData() {
  console.log(`Fetching data from ${CONFIG.apiUrl} with timeout ${CONFIG.timeout}`);
  // логика запроса данных
}

fetchData(); // Fetching data from https://api.example.com with timeout 5000

// Изменим свойство объекта
CONFIG.timeout = 10000;
fetchData(); // Fetching data from https://api.example.com with timeout 10000

Пример с массивами

				
					const COLORS = ['red', 'green', 'blue'];

function addColor(color) {
  COLORS.push(color);
}

console.log(COLORS); // ['red', 'green', 'blue']
addColor('yellow');
console.log(COLORS); // ['red', 'green', 'blue', 'yellow']

// Нельзя изменить саму ссылку на массив
// COLORS = ['pink', 'purple']; // Ошибка

Распространенные ошибки

Попытка изменить значение константы

				
					const PI = 3.14;
// PI = 3.14159; // Ошибка: Assignment to constant variable.

Попытка повторно объявить константу

				
					const MAX_VALUE = 100;
// const MAX_VALUE = 200; // Ошибка: Identifier 'MAX_VALUE' has already been declared

Неправильное использование констант с объектами

				
					const USER = {
  name: 'Alice',
  age: 25
};

// USER = { name: 'Bob', age: 30 }; // Ошибка: Assignment to constant variable.

Заключение

Использование констант в JavaScript помогает сделать код более надежным и понятным. Константы обеспечивают защиту от случайных изменений значений, что повышает стабильность и предсказуемость кода. Следование лучшим практикам при работе с константами позволяет создавать чистый и поддерживаемый код.

Тестовое задание

Объявите константу для хранения значения числа Пи и используйте ее для вычисления площади круга.
Создайте константу для объекта настроек с полями apiUrl и timeout, и измените значение timeout.
Объявите константу для массива цветов и добавьте новый цвет в этот массив.

Пример решения:

				
					// Задание 1
const PI = 3.14159;

function calculateCircleArea(radius) {
  return PI * radius * radius;
}

let area = calculateCircleArea(5);
console.log(area); // 78.53975

// Задание 2
const SETTINGS = {
  apiUrl: 'https://api.example.com',
  timeout: 5000
};

console.log(SETTINGS.timeout); // 5000
SETTINGS.timeout = 10000;
console.log(SETTINGS.timeout); // 10000

// Задание 3
const COLORS = ['red', 'green', 'blue'];
console.log(COLORS); // ['red', 'green', 'blue']

COLORS.push('yellow');
console.log(COLORS); // ['red', 'green', 'blue', 'yellow']

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

Регистрация

Вход

Поиск