JavaScript заметки
8.56K subscribers
2.75K photos
4 videos
1.27K links
Регулярные заметки по практическому JavaScript. Обучащию посты позволят прокачать навыки во Frontend-разработке.

Можно почитать пока компилируется проект :)

Сотрудничество: @noname_media

Канал на бирже: telega.in/channels/notesjs/card?r=Wj7h1mbl
Download Telegram
.add()

Метод add() добавляет значение в коллекцию Set. Если значение уже есть в коллекции, то вызов игнорируется.

#множества #add

Подробнее
🔥5👍21
.entries()

Возвращает итератор, который обходит массив пар [значение, значение] коллекции Set в порядке добавления этих значений в коллекцию.

Обычно метод entries() возвращает итератор с парой [ключ, значение] коллекции, но так как коллекции Set не имеют ключей, то для поддержки универсального интерфейса итератор возвращает пару из одного и того же значения.

Метод используется редко.

#множества #entries

Подробнее
👍101🔥1
.size

Свойство size содержит количество значений, находящихся в коллекции Set. Доступно только для чтения.

#множества #size

Подробнее
👍91🔥1
try...catch

Конструкция try...catch позволяет выполнить произвольный код, но если в нем произошла ошибка, то программа не остановит своё выполнение, а перейдёт в блок catch, где ошибку можно обработать.

#обработка_исключений #trycatch

Подробнее
👍82🔥1
Error и стандартные ошибки

Программа
может работать правильно, только если код написан корректно и не содержит ошибок. JavaScript умеет обрабатывать некорректный код и сообщать об ошибке в коде. Существует семь встроенных видов ошибок, также можно создать свои собственные. Встроенные ошибки генерируются самим движком JavaScript при выполнении программы, а пользовательские — создаются с помощью конструктора Error. Оба типа ошибок можно ловить в конструкции try...catch.

#обработка_исключений #errors

Подробнее
👍7
Объект Math

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

#Math #Math

Подробнее
👍61🔥1
Math.floor(), Math.round(), Math.ceil() и Math.trunc()

Объект Math содержит набор методов, который используется для округления чисел:

round() — округление по обычным правилам;
floor() — округление вниз;
ceil() — округление вверх;
trunc()отбрасывание дробной части, не обращая внимания на знак аргумента.

#Math #Math

Подробнее
👍92🔥2
Math.random()

Одна
из самых часто используемых функции объекта Math. Возвращает случайное число в диапазоне от 0 до 1, не включая 1.

#Math #Mathrandom

Подробнее
👍71🔥1
Браузерное окружение, BOM

Современный JavaScript используется не только в браузерах. Среда, в которой он запускается, будь то браузер, сервер или что-то ещё, называется окружением.

У разных окружений разные возможности и функциональность. В этой статье рассмотрим браузерное окружение и браузерную модель документа.

Окружение предоставляет языку дополнительные возможности и функции. Браузерное окружение, например, даёт возможность работать со страницами сайтов.

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

В случае с браузерным окружением — это объектная модель браузера (Browser Object Model, BOM). Она предоставляет доступ к navigator, location, fetch и другим объектам.

#Браузерное_окружение #Браузерное_окружение #BOM

Подробнее
👍10🔥21
DOM

DOM (Document Object Model) — это специальная древовидная структура, которая позволяет управлять HTML-разметкой из JavaScript-кода. Управление обычно состоит из добавления и удаления элементов, изменения их стилей и содержимого.

Браузер создаёт DOM при загрузке страницы, складывает его в переменную document и сообщает, что DOM создан, с помощью события DOMContentLoaded. С переменной document начинается любая работа с HTML-разметкой в JavaScript.

#Браузерное_окружение #DOM

Подробнее
👍81🔥1
console.log()

console.log() — это метод, предназначенный для печати в консоль браузера.

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

#Браузерное_окружение #consolelog

Подробнее
🔥3👍21
window.history

History API даёт доступ к управлению историей браузера в рамках текущей сессии. Браузер создаёт новую сессию, когда пользователь открывает новую вкладку или новое окно браузера.

С помощью History API можно переходить по истории вперёд, назад и управлять содержимым истории. Доступ к API осуществляется с помощью объекта window.history.

Основные методы:

back() перемещает пользователя по истории на страницу назад;
forward() перемещает пользователя по истории на страницу вперёд;
go() универсальный метод для перемещения по истории вперёд или назад;
pushState() добавляет новую запись в истории сессии;
replaceState() изменяет текущую запись в истории сессии.

#Браузерное_окружение #windowhistory

Подробнее
👍32🔥1
fetch()

С помощью функции fetch() можно отправлять сетевые запросы на сервер — как получать, так и отправлять данные. Метод возвращает промис с объектом ответа, где находится дополнительная информация (статус ответа, заголовки) и ответ на запрос.

#Браузерное_окружение #fetch

Подробнее
👍52🔥2
window.navigator

Свойство window.navigator возвращает объект описания приложения (user agent), которое выполняет скрипт. В подавляющем большинстве случаев это приложениебраузер. Объект содержит свойства, описывающие браузер, и методы для выполнения действий.

#Браузерное_окружение #windownavigator

Подробнее
👍21🔥1
FormData

FormData — это специальная коллекция данных, которая позволяет передавать данные в виде пар [ключ, значение] на сервер при помощи fetch() или XMLHttpRequest. При этом используется точно такой же формат данных, какой использует тег <form> с типом кодирования 'multipart/form-data'. Поэтому, значения в FormData, как и у обычной HTML формы, могут быть только строками или файлами.

#Браузерное_окружение #FormData

Подробнее
🔥82👍2
window.location

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

#Браузерное_окружение #windowlocation

Подробнее
👍42🔥2
Geolocation API

Geolocation API позволяет запросить у пользователя данные о географическом местоположении.

Работать с геопозицией пользователей можно только при защищённом соединении (HTTPS).

#Браузерное_окружение #GeolocationAPI

Подробнее
👍3🔥1
window.matchMedia

Интерфейс
в глобальной области видимости window.matchMedia, который позволяет получить доступ к медиавыражениям из JavaScript и подписываться на их срабатывание. Медиавыражения активно используются в CSS с помощью директивы @media.

#Браузерное_окружение #windowmatchMedia

Подробнее
👍2
URLSearchParams

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

#Браузерное_окружение #URLSearchParams

Подробнее
👍5
localStorage

Это объект, хранящийся в window, который позволяет долговременно сохранять данные в браузере. Работает как хранилище данных в формате ключ-значение — при сохранении данных мы указываем имя поля, в которое должны быть сохранены данные, и затем используем это имя для их получения.

Значения хранятся в виде строк. При попытке сохранения других типов данных, они будут приведены к строке. Например, если записать число, то при чтении нам вернётся число, записанное в строку.
Не имеет ограничений по времени хранения, может быть очищен пользователем вручную или браузером при переполнении автоматически (браузеры на основе движка WebKit, например Safari, очищают localStorage, если к нему не обращались в течение 7 дней).
Максимальный объем данных ограничен размером 5MB.

#Браузерное_окружение #localStorage

Подробнее
👍6