JavaScript Strict Mode: объясняем просто

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

Зачем это нужно? Представьте, что вы пишете код в команде или возвращаетесь к своему проекту через полгода. Строгий режим в JavaScript выступает в роли строгого, но справедливого наставника, который не позволяет вам совершать потенциально опасные действия. Он:

1. Указывает на ошибки, которые иначе прошли бы незамеченными (например, попытка записи в глобальную переменную через опечатку).
2. Запрещает синтаксис, который может сломаться в будущих версиях ECMAScript.
3. Повышает производительность, так как движок может оптимизировать код, будучи уверенным в отсутствии некоторых «опасных» конструкций.

Глобальное подключение strict mode

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

// Этот код выполняется в нестрогом режиме (sloppy mode)

'use strict';

// А вот этот код (ниже) уже будет строгим
let elementCounter = 10;
function calculateTotalSum(paramFirst, paramSecond) {
    // код функции также в строгом режиме
    return paramFirst + paramSecond;
}

Важный нюанс: если вы пишете не в модульной системе, а подключаете несколько JS-файлов на страницу, глобальное использование 'use strict' в одном файле повлияет только на него, но может создать проблемы при объединении (конкатенации) скриптов. Если один файл в строгом режиме, а другой — нет, при сборке директива может примениться ко всему файлу, что способно сломать старый код.

Локальное подключение внутри функции

Более безопасный и точечный способ — включить строгий режим внутри конкретной функции. Для этого директива помещается в самое начало тела функции.

function prepareUserProfile(userIdentifier, userAge) {
    'use strict';
    // Весь код внутри этой функции выполняется в строгом режиме
    let internalData = {};
    // ... логика
}

function oldLegacyFunction() {
    // А этот код выполняется в обычном, "небрежном" режиме
    totalGlobalVariable = 123; // Это создаст глобальную переменную (плохо!)
}

Этот подход идеален для постепенного рефакторинга больших проектов, где нельзя сразу переписать всё. Вы можете переводить отдельные функции на новые рельсы, не боясь сломать остальную кодовую базу. Локальное подключение strict mode часто встречается в старом коде, написанном до массового распространения ES6-модулей.

1. Превращение «тихих» ошибок в исключения

В нестрогом режиме некоторые ошибки просто игнорируются. Строгий режим делает их явными.

// Обычный режим
let myDescriptorObject = {};
Object.defineProperty(myDescriptorObject, 'fixedKey', { value: 42, writable: false, configurable: false });
delete myDescriptorObject.fixedKey; // Тишина, delete просто вернет false, объект не изменится
console.log(myDescriptorObject.fixedKey); // 42

// Строгий режим
'use strict';
let myStrictObject = {};
Object.defineProperty(myStrictObject, 'fixedKeyStrict', { value: 100, configurable: false });
delete myStrictObject.fixedKeyStrict; // Ошибка! TypeError: Cannot delete property 'fixedKeyStrict'

2. Запрет на неявное создание глобальных переменных

Это, пожалуй, самая частая причина головной боли новичков, которую строгий режим устраняет на корню.

// Обычный режим
function setProductPrice() {
    productPrice = 2500; // Забыли var/let/const! Создается глобальная переменная
}
setProductPrice();
console.log(productPrice); // 2500 (переменная утекла в глобальный объект window)

// Строгий режим
'use strict';
function setStrictProductPrice() {
    productPriceStrict = 3500; // Забыли объявить
    // Ошибка! ReferenceError: productPriceStrict is not defined
}
setStrictProductPrice();

3. Ограничения на использование this в функциях

В строгом режиме значение this больше не «упаковывается» в объект, если функция вызывается без контекста.

// Обычный режим
function showMyThis() {
    return this;
}
console.log(showMyThis() === window); // true (в браузере) - this ссылается на глобальный объект

// Строгий режим
'use strict';
function showMyThisStrict() {
    return this;
}
console.log(showMyThisStrict()); // undefined
console.log(showMyThisStrict() === window); // false

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

'use strict';
function DataProcessor(initialValue) {
    this.value = initialValue; // здесь this === undefined
}
let processorInstance = DataProcessor(10); // Забыли 'new'
// Ошибка! Cannot set property 'value' of undefined

4. Запрет дублирования параметров функции

В строгом режиме объявление функции с двумя одинаковыми именами параметров вызывает синтаксическую ошибку.

// Обычный режим
function buildRoute(parameter, parameter) {
    // Доступ будет только ко второму parameter
    return parameter + ' path';
}
console.log(buildRoute(5, 10)); // 10 path

// Строгий режим
'use strict';
function buildStrictRoute(argFirst, argFirst) { // Ошибка! SyntaxError: Duplicate parameter name not allowed in this context
    return argFirst + ' route';
}

5. Запрет на использование with() {}

Конструкция with(){} считается устаревшей и небезопасной. В строгом режиме она полностью запрещена.

// Обычный режим (не рекомендуется даже тут)
let customObject = { x: 1, y: 2 };
with (customObject) {
    console.log(x + y); // 3
}

// Строгий режим
'use strict';
let customStrictObject = { a: 10, b: 20 };
with (customStrictObject) { // Ошибка! SyntaxError: Strict mode code may not include a with statement
    console.log(a + b);
}

6. Изменение поведения eval()

В нестрогом режиме eval() может создавать переменные в текущей области видимости. В строгом режиме у eval() появляется своя собственная область видимости.

// Обычный режим
eval("let createdVar = 42;");
console.log(createdVar); // 42 (переменная просочилась наружу)

// Строгий режим
'use strict';
eval("let createdVarStrict = 100;");
console.log(createdVarStrict); // Ошибка! ReferenceError: createdVarStrict is not defined

7. Запрет на удаление обычных переменных

В строгом режиме нельзя использовать оператор delete для удаления обычных переменных, функций или аргументов.

// Обычный режим
let simpleVar = 15;
delete simpleVar; // false, операция просто игнорируется

// Строгий режим
'use strict';
let simpleStrictVar = 25;
delete simpleStrictVar; // Ошибка! SyntaxError: Delete of an unqualified identifier in strict mode.

8. Защита имен аргументов и свойств

В строгом режиме свойства arguments.callee и arguments.caller больше не используются и при попытке доступа к ним выбрасывают ошибку. Это сделано для оптимизации и безопасности.

'use strict';
function secureFunction(argValue) {
    // arguments.callee; // Ошибка! TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed
    return argValue * 2;
}

Строгий режим в JavaScript вводит список зарезервированных слов, которые нельзя использовать в качестве имен переменных или функций. Это сделано для совместимости с будущими версиями языка. К таким словам относятся: implements, interface, let, package, private, protected, public, static, yield.

'use strict';
// let private = 5; // Ошибка! SyntaxError: Unexpected strict mode reserved word
let publicData = 10; // А вот так можно, потому что это не ключевое слово в контексте имени переменной, но лучше избегать

Для веб-студии использование строгого режима — это не просто прихоть, а необходимость. Вот несколько реальных кейсов:

Разработка на фреймворках

Современные фреймворки (React, Vue, Angular) по умолчанию требуют строгого режима или используют его внутренне. Например, при сборке проекта с помощью Create React App, код автоматически транспилируется с подразумеваемым 'use strict'.

Классы и модули ES6

Весь код внутри классов и ES6-модулей (файлы с import/export) выполняется в строгом режиме автоматически. Вам даже не нужно писать директиву.

// Этот код уже в строгом режиме, даже без директивы
class ModernComponent {
    constructor(baseValue) {
        this.value = baseValue;
    }
    // ...
}

Отладка сложной логики

При работе с асинхронными запросами или обработчиками событий легко случайно потерять контекст this. Строгий режим, возвращая undefined вместо window, помогает быстро обнаружить такие проблемы.

Существует миф, что строгий режим замедляет выполнение кода. На практике все наоборот. Поскольку движок JavaScript может полагаться на то, что некоторые «опасные» возможности (например, with) отсутствуют, он генерирует более оптимизированный машинный код. Это часто приводит к незначительному, но все же приросту производительности.

Если вы пишете новый проект — всегда включайте строгий режим глобально. Если поддерживаете старый — начинайте с локального включения в новых функциях и модулях. Использование ‘use strict’ — это признак профессионализма и заботы о качестве конечного продукта. Внедрение этой директивы в рабочий процесс веб-студии минимизирует количество скрытых багов и ускорит онбординг новых разработчиков в проект. Пишите чистый код, и пусть ошибки будут явными, а не скрытыми в глубине консоли.

Если вы хотите не просто писать скрипты, а создавать сложные, надежные и масштабируемые проекты, обратите внимание на наш комплексный онлайн-курс «Обучение JavaScript с нуля до профи». Мы не просто учим синтаксису — мы закладываем правильную архитектуру мышления, учим работать с контекстом, асинхронностью и современными стандартами, включая все тонкости строгого режима.

А если для вашего бизнеса или стартапа нужен мощный инструмент «под ключ», и вы хотите получить безупречный код, который не сломается в самый неподходящий момент, — просто закажите создание сайта у нашей веб-студии. Мы воплотим вашу идею в реальность, используя все передовые практики JavaScript, чтобы ваш проект работал быстро, стабильно и безопасно.