CodeRoll | Frontend

👩‍💻 Используем принципы “Чистого кода” в контексте JavaScript

Функции

✏ Избегайте условных конструкций - один из самых странных принципов 🥺

Вы спросите: "Как так? Как я могу писать код без использования условий?"

➕ Сделать это можно, если вы разделите условную конструкцию на отдельные функциональности. И вместо вычисления вы просто будете запускать нужное. Это перекликается и с другими принципами, которые мы уже с вами разбирали. Например то, что функция/метод должны делать что-то одно

Это работает как в комплексных функциях, так и в классах за счет полиморфизма (см. примеры кода)

Coderoll | Frontend

Что такое динамический импорт в React?

Ответ:
Динамический импорт позволяет загружать модули асинхронно. В React это используется для ленивой загрузки компонентов, что улучшает производительность приложения. Пример:

const LazyComponent = React.lazy(() => import('./LazyComponent'));

Ставь ❤️ если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend

Как работает хук useState?

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

const [count, setCount] = useState(0);

Ставь ❤️ если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend

Что такое JSX?

Ответ:
JSX (JavaScript XML) — это синтаксический сахар для JavaScript, который позволяет писать HTML-подобный код внутри JavaScript. JSX превращается в обычный JavaScript с помощью компилятора, такого как Babel. Пример:

const element = <h1>Hello, world!</h1>;

JSX упрощает создание и чтение UI компонентов.

Ставь ❤️ если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend

⚡️ Бесплатное обучение фронтенд-разработке с нуля

Опыт в программировании не нужен.

На канале Интенсивный JavaScript действующий тимлид и опытный разработчик помогает изучить фронтенд на практических задачах, которые интересно кодить

С 6 марта стартует бесплтаное обучение, где он на практике поможет разобраться в основах — HTML/CSS и JavaScript

Вот проекты, которые создадите:
💡 сверстаете свой онлайн-кинотеатр
💡 и напишете фронтенд для сайта с аниме-сериалами

Обучение подойдёт, даже если у вас нет опыта в программировании — всё объясняют так, чтобы поняла даже ваша бабуля

🔖Ещё этот парень регулярно набирает новичков в свою команду и знает, как трудоустроиться джуну или стартовать на фрилансе без бирж

Помимо работы с кодом он даст пошаговый план изучения всего, что необходимо знать и уметь, чтобы зарабатывать на фронтенде в 2026 году

Расскажет, как взять свой первый заказ на фрилансе без фриланс-бирж с огромной конкуренцией

Подписывайтесь, чтобы участвовать, осталось 56 мест

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

🟠Участвовать бесплатно

❓ Что такое for...of?

Ответ:
for...of — это цикл, который итерируется по итерируемым объектам (массивы, строки, генераторы и т.д.), возвращая значения элементов.

Ставь ❤️ если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend

Как работает метод setState?

Ответ:

Метод setState используется для обновления состояния компонента в React. Когда состояние изменяется, React перерисовывает компонент и его дочерние элементы. Важно, что setState работает асинхронно, и обновления могут быть объединены.

this.setState({ counter: this.state.counter + 1 });

Ставь ❤️ если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend

Что такое JSX?

Ответ:
JSX (JavaScript XML) — это синтаксический сахар для JavaScript, который позволяет писать HTML-подобный код внутри JavaScript. JSX превращается в обычный JavaScript с помощью компилятора, такого как Babel. Пример:

const element = <h1>Hello, world!</h1>;

JSX упрощает создание и чтение UI компонентов.

Ставь ❤️ если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend

👩‍💻👩‍💻 Как выглядит алгоритм сортировки выбором на JavaScript?

❗ Один из самых распространенных алгоритмов, которые спрашивают на собеседованиях

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

function selectionSort(arr) {
    const n = arr.length;

    // Проходим по всем элементам массива
    for (let i = 0; i < n - 1; i++) {
        // Предполагаем, что текущий индекс i содержит минимальный элемент
        let minIndex = i;

        // Ищем минимальный элемент в оставшейся части массива
        for (let j = i + 1; j < n; j++) {
            if (arr[j] < arr[minIndex]) {
                minIndex = j; // Обновляем индекс минимального элемента
            }
        }

        // Если найден минимальный элемент не равен текущему, меняем их местами
        if (minIndex !== i) {
            [arr[i], arr[minIndex]] = [arr[minIndex], arr[i]];
        }
    }

    return arr; // Возвращаем отсортированный массив
}

Coderoll | Frontend

👩‍💻 Используем принципы “Чистого кода” в контексте JavaScript

Функции

✏ Создавайте отдельные объекты, а не модифицируйте их напрямую

⚠️ Так же это одно из правил иммутабельности, которое важно соблюдать при работе с продвинутыми инструментами

Если у вас есть необходимость изменить объект, то почти всегда надежнее будет создать его копию, и уже в ней проводить мутации

➕ Сейчас это можно делать за счет object spread operator (...obj) или по старинке через Object.assign()

Coderoll | Frontend