#reactjs #typescript #optimization #scope #constants
Вопрос:
Часть моего кода получила комментарий к обзору, в котором говорилось что-то вроде «переместить константу за пределы функции, чтобы избежать повторного объявления». Это был обычный функциональный компонент, что-то вроде этого:
export default function someComponent() {
const someString = 'A string';
///...
}
Меня смутила идея о том, что это приведет к повторному объявлению, потому что это не так, я знаю, что запись, содержащая переменные и константы, принадлежит области видимости, так что это не совсем так.
Но потом я вспомнил, что typescript не позволяет иметь константу внутри класса, не уверен в причине или это связано. Но затем ts добавил модификатор только для чтения в ts v2, так что путаница остается.
Должна ли const быть вне функциональных компонентов или нет? Я хотел бы узнать больше мнений.
Ответ №1:
У монеты есть 2 стороны. Во-первых, с точки зрения чистого кода и удобочитаемости я настоятельно предпочитаю локальные объявления, как в вашем примере. Я бы также хотел использовать больше вложенных функций.
Однако в JavaScript при каждом выполнении функции локальные определения будут объявляться повторно, даже если они являются константами или функциями. Так что это компромисс. Если функция вызывается много раз, это становится накладными расходами.
Я думаю, что компилятору, такому как TypeScript tsc
или какой-либо другой препроцессор, не составит труда извлечь эти определения во время компиляции, чтобы получить лучшее из обоих миров. Но вполне вероятно, что они не делают этого, чтобы оставаться полностью совместимыми. Я не знаю о таких инструментах, но было бы интересно, если бы они существовали.