Приведение типов в JavaScript — это хорошо?

Многие опытные разработчики программного обеспечения обычно съеживаются, когда сталкиваются с JavaScript (добровольно или нет) и такими особенностями его родного языка, как приведение типов, понятия «правдивости» и «ложности» и т. д. И иногда справедливо. Но что, если эта открытость, свобода свободно типизированного языка на самом деле является отличным инструментом в вашем наборе инструментов, когда дело доходит до написания чистых и элегантных решений?

Паника от незнания побочных эффектов, артефактов, которые производит язык из-за того, что он не является строго типизированным, довольно распространена, особенно среди «новичков» в вышеперечисленных концепциях. Неопределенность хуже всего для разработчиков! Но в большинстве случаев неуверенность возникает из-за отсутствия определенного опыта.

Давайте взглянем на пример задачи, традиционный подход и подход с приведением типов.

Задание.

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

Максимальное количество элементов равно 3. Если у нас есть только 2 элемента, то каждый из них должен иметь ширину 50%, если у нас есть 3 элемента, то ширина каждого элемента должна быть 33%. Конечно, один элемент должен занимать полную, 100% ширину.

Мы знаем, что элемент присутствует по соответствующему логическому флагу.

CSS-решение было бы самым элегантным, верно? Но для примера давайте представим, что CSS застрял в 1996 году.

Традиционный подход.

Вот-вот станет некрасиво!

Ну вот:

Boolean FIRST_ELEMENT;
Boolean SECOND_ELEMENT;
Boolean THIRD_ELEMENT;

String width;


// If all elements are present
if (FIRST_ELEMENT && SECOND_ELEMENT && THIRD_ELEMENT) {
    width = '33%';
}

// If 2 elements are present
if (FIRST_ELEMENT && SECOND_ELEMENT && !THIRD_ELEMENT) {
    width = '50%';
}

if (FIRST_ELEMENT && !SECOND_ELEMENT && THIRD_ELEMENT) {
    width = '50%';
}

if (!FIRST_ELEMENT && SECOND_ELEMENT && THIRD_ELEMENT) {
    width = '50%';
}

// if only one element is present
if (!FIRST_ELEMENT && !SECOND_ELEMENT && THIRD_ELEMENT) {
    width = '100%';
}

if (FIRST_ELEMENT && !SECOND_ELEMENT && !THIRD_ELEMENT) {
    width = '100%';
}

if (!FIRST_ELEMENT && SECOND_ELEMENT && !THIRD_ELEMENT) {
    width = '100%';
}

Этот код выполняет свою работу. Но о боже... что-то умерло во мне, когда я вставил это.

Можем ли мы добиться большего успеха при традиционном подходе? Я так думаю. Давайте сделаем небольшое и очевидное улучшение, по умолчанию и избавимся от последних 3 условий:

String width = '100%';


// If all elements are present
if (FIRST_ELEMENT && SECOND_ELEMENT && THIRD_ELEMENT) {
    width = '33%';
}

// If 2 elements are present
if (FIRST_ELEMENT && SECOND_ELEMENT && !THIRD_ELEMENT) {
    width = '50%';
}

if (FIRST_ELEMENT && !SECOND_ELEMENT && THIRD_ELEMENT) {
    width = '50%';
}

if (!FIRST_ELEMENT && SECOND_ELEMENT && THIRD_ELEMENT) {
    width = '50%';
}

Этот код все еще имеет характерный запах. Мы можем пойти дальше с «оптимизациями», ввести побитовое XOR, добавить больше логики, уменьшить количество условий. Вопрос в том, будет ли это читаться? Или это будет одна из тех вещей, которые потребуют от вас оставить комментарий для будущих поколений, чтобы понять, что на самом деле происходит? Все равно звучит плохо.

Теперь давайте возьмем один из инструментов в нашем наборе инструментов и посмотрим, может ли он быть полезен здесь: Type Coercion.

Тип Принуждение.

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

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

False преобразуется в 0;

True превращается в 1;

Вот как это может быть полезно в этом конкретном примере:

String width = '100%';
Int TOTAL_ELEMENTS = FIRST_ELEMENT + SECOND_ELEMENT + THIRD_ELEMENT;

if (TOTAL_ELEMENTS === 2) {
    width = '50%';
}

if (TOTAL_ELEMENTS === 3) {
    width = '33%';
}

Читабельность значительно улучшилась!

В наши дни, когда удобочитаемость и мгновенное понимание кода, написанного другими, является одним из самых важных (если не самым важным) ингредиентов для производительности команды, мы должны использовать все уловки, которые у нас есть в рукавах, чтобы соответствовать требованиям. Приведение типов явно является одним из них.

В отличие от закона заголовков Беттриджа, на этот нельзя ответить словом нет.