Практическое руководство по Javascript Proxy

Proxy - мощный инструмент метапрограммирования в JS, обеспечивающий полный контроль при доступе к объекту. Он умеет отслеживать все основные операции (запрос значения свойства и его обновление, вызов метода, итерация, удаление свойств и т. д.)

Чтобы отслеживать какую-либо операцию, объект Proxy должен реализовать соответствующую "ловушку": метод get, set, deleteProperty и т. д.

Proxy может использоваться для реализации множества концепций:
- перегрузка операторов
- "настоящие" приватные свойства
- возвращения "нулевого значения"
- мокирование объектов
- кэширование данных и синхронизация состояний
- гибкие перечисления
- использование отрицательных индексов для поиска в массивах
- удобная работа с cookies
- реактивное изменение свойств

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

Подробнее о Proxy: https://webdevblog.ru/prakticheskoe-rukovodstvo-po-javascript-proxy/

#javascript #core

Полное руководство по ES10

Вспоминаем недавно добавленные JS-фичи - вдруг вы еще не начали их использовать 🤨

Речь пойдет о:
- больших числах
- плоских массивах
- стабильной сортировке
- стандартизированном глобальном объекте
- удалении пробелов из строк
- String.matchAll()
- Object.fromEntries()
- новых членах классов
- и еще многом другом

Читать: https://prglb.ru/5tkkz

#javascript #core

Замыкания, каррирование и крутые абстракции

Разбираемся в непростых концепциях JavaScript на практике

Читать: https://prglb.ru/1r4xj

#javascript #core

Сортировка по умолчанию в JavaScript осуществляется в лексикографическом порядке, то есть элементы сравниваются как строки.

Узнать больше о методе sort: https://prglb.ru/48baz

#javascript #core

Объяснение

Метод Object.seal запрещает добавление новых свойст к объекту и конфигурацию существующих свойств. Однако не мешает изменять их значения.

Документация MDN: https://prglb.ru/1gt4m

Вместе с Object.freeze этот метод может служить для обеспечения иммутабельности данных.

Подробнее: https://prglb.ru/qgo8

#javascript #core

​Правильный ответ: 1

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

😲 Почти любой код на JS можно написать с помощью всего лишь 6 символов:

[]()!+

Не верите? Смотрите сами: https://javascript.christmas/2019/17

#javascript #coersion #core

Правильный ответ: 3 из приведенных реализаций некорректны

Реализация #1. Цикл for-in перебирает индексы массива, а не значения.
Реализация #6. Оператор in также работает с индексами (ключами), а не со значениями
Реализация #8. Результатом работы метода findIndex является порядковый индекс элемента, который может быть равен 0. Поэтому некорректно преобразовывать это значение в булево.

Многие операции в JS можно выполнить несколькими способами. Обычно мы выбираем самый понятный, самый короткий или самый производительный из них.

25 полезных сокращений, которые пригодятся любому разработчику: https://www.sitepoint.com/shorthand-javascript-techniques/

#javascript #core #bestpractices

Итераторы, генераторы и протокол итерации в JavaScript

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

Читать: https://prglb.ru/pe6e

#javascript #core

Коллекции JavaScript – Set, Map, WeakMap и WeakSet

Обычные массивы уже всем надоели - давайте посмотрим на свежее пополнение в JavaScript: сеты, мапы и их "слабые" версии.

Читать: https://prglb.ru/57wxq

В статье описан интерфейс каждой коллекции и приведены полезные кейсы использования.

#javascript #core

​Петля событий, асинхронный JavaScript, ES6 и коллбеки

Перевод четвертой статьи из цикла How JavaScript works - сразу в двух частях.
Начало: https://prglb.ru/5ojcs
Продолжение: https://prglb.ru/1ku87

Все об асинхронности в JavaScript - от истоков до современности.

#javascript #core

Правильный ответ: true false

Конструктор new Number() создает не примитивное значение, а объект, так что строгое равенство не выполняется.

Еще больше вопросов для проверки JavaScript здесь: https://prglb.ru/326j8

#javascript #core

Что за… «замыкание»?

Дэн Абрамов объясняет замыкания в JavaScript на множестве примеров: https://whatthefuck.is/closure

#javascript #core