JavaScript развивается быстрыми темпами, и новые возможности языка часто появляются именно для того, чтобы писать меньше кода и делать его более читаемым. Одной из таких возможностей стали логические операторы присваивания &&= и ||=, которые вошли в стандарт относительно недавно и уже поддерживаются во всех современных браузерах (статус Widely Available в Baseline с 16 марта 2023 года).

До появления этих операторов разработчики писали длинные конструкции с проверками:

let a = true;
if (a) {
  a = false;
}

Код был понятен, но избыточен. Новые операторы &&= и ||= позволяют объединить проверку и присваивание в одну строку.

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

Когда вы создаёте интерактивные веб-приложения, взаимодействие с клавиатурой пользователя становится важной частью. Хотите, чтобы ваш сайт реагировал на нажатие клавиши Enter для отправки формы? Или, может, мечтаете сделать простую браузерную игру, где персонаж движется при нажатии стрелок? Для этого в JavaScript есть события keydown и keyup. Они позволяют отслеживать, когда пользователь нажимает или отпускает клавишу. В этой статье мы разберём, как работают эти события, их историю, особенности и как безопасно использовать их в 2025 году.

Когда вы начинаете погружаться в веб-разработку, рано или поздно возникает задача: как программно оформить текст? Представьте, что вам нужно выделить часть текста жирным или курсивом прямо из JavaScript, не прибегая к ручному написанию HTML-тегов. Здесь на помощь приходят встроенные методы строк в JavaScript, такие как bold(), italics() и их менее известные собратья. Эти методы позволяют оборачивать строки в HTML-теги, возвращая новую строку с нужным форматированием. Давайте разберёмся, как они работают, откуда взялись, и стоит ли их использовать в 2025 году.

Числа — это основа многих программ, будь то расчёты в играх, обработка данных в формах или генерация случайных событий. В JavaScript числа представлены типом Number, который охватывает как целые, так и дробные значения. А для сложных математических операций есть встроенный объект Math, который предоставляет множество полезных методов. Если вы новичок в веб-разработке, понимание чисел и их возможностей в JavaScript — это ключ к созданию динамичных и функциональных приложений. В этой статье мы подробно разберём тип Number, объект Math, специальные значения вроде Infinity и NaN, а также покажем, как использовать их в реальных проектах.

Функции в JavaScript — это блоки кода, которые выполняют определённую задачу и могут быть вызваны многократно. Они помогают структурировать программу, делая код чище и удобнее для поддержки. В этой статье мы разберём, как создавать функции, какие их виды существуют, и как использовать параметры, возвращаемые значения и другие возможности. Всё с примерами, чтобы вы могли сразу начать применять знания!

Метод fetch() — это один из ключевых инструментов веб-разработки. Он появился как альтернатива устаревшему XMLHttpRequest и сразу изменил привычный подход к работе с данными в браузере. Сегодня трудно представить приложение без динамической подгрузки: комментарии в соцсетях, бесконечные ленты новостей, онлайн-магазины с фильтрацией товаров — всё это работает благодаря запросам к серверу, которые обрабатываются без перезагрузки страницы.

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

Функция находится в статусе ограниченной доступности в Baseline.

navigator.credentials — это интерфейс Web Authentication API, который позволяет браузеру управлять учётными данными пользователя. С его помощью можно безопасно получать, сохранять и автоматически подставлять данные для входа: пароли, токены или ключи. Это делает процесс аутентификации проще и безопаснее — особенно на сайтах, где важен пользовательский опыт и скорость входа.

Доступно в Baseline в статусе «Widely Available» с 2022-07-15

Как это работает

Вы можете запросить сохранённые данные с помощью navigator.credentials.get(). Например, при загрузке страницы входа можно попытаться автоматически получить логин и пароль пользователя, если он ранее их сохранил:

const cred = await navigator.credentials.get({
  password: true,
  mediation: 'optional' // чтобы не мешать потоку, если данных нет
});

if (cred) {
  console.log('Получен логин:', cred.id);
  console.log('Пароль:', cred.password);
  // Здесь можно автоматически отправить данные на сервер
}

Если учётные данные доступны, вы можете использовать их для входа без дополнительных действий от пользователя. Это особенно удобно на мобильных устройствах и в приложениях с частыми сессиями.

Можно ли сохранять логин и пароль вручную?

Да, через navigator.credentials.store() вы можете сохранить учётные данные, которые пользователь только что ввёл:

const cred = new PasswordCredential({
  id: 'user@example.com',
  password: '12345678'
});

await navigator.credentials.store(cred);

Теперь при следующем визите вы сможете использовать get(), чтобы получить эти данные без необходимости ручного ввода.

Безопасность

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

Поддержка и ограничения

• Поддерживается в Chrome, Edge, Android WebView.
• Safari и Firefox поддерживают только часть API или вовсе не поддерживают.
• Нельзя использовать на сторонних сайтах (только собственный домен).

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

Больше обзоров веб-функций — в телеграм-канале HTML Academy.

Нашли ошибку или опечатку? Напишите нам.

Новое свойство cause в объекте error позволяет узнать исходную причину сбоя и облегчить отладку, особенно при повторении ошибок. Оно помогает выстроить цепочку событий и лучше понимать, где возникла проблема. Свойство доступно в Baseline в статусе «Widely Available» с 20 марта 2024 года.