FrontEnd_Xpert

🔮 Полифил Promise.allSettled Если браузер не поддерживает Promise.allSettled, для него легко сделать полифил: Promise.allSettledFake = function(promises) { return Promise.all(promises.map(promise => { return new Promise(resolve=>(resolve(promise))) .then( result => ({status: 'fulfilled', value: result})) .catch ( error => ({status: 'rejected', reason: error})) })) }; Promise.allSettledFake([ Promise.resolve(1), Promise.reject(2), Promise.resolve(3) ]).then(console.log) Получим: [ { status: 'ful...

💟 Promise API В классе Promise есть 4 статических методов для управления несколькими промисами: 🔮 Promise.all Допустим, нам нужно запустить множество промисов параллельно и дождаться, пока все они выполнятся. Для этого как раз и пригодится Promise.all. Метод Promise.all принимает массив промисов (может принимать любой перебираемый объект, но обычно используется массив) и возвращает новый промис. Новый промис завершится, когда завершится весь переданный список промисов, и его результатом будет ...

🚀 Цепочка промисов в JavaScript — это последовательность промисов, которые связаны между собой, позволяет обрабатывать результаты асинхронных операций последовательно. Каждый промис в цепочке выполняется после завершения предыдущего, что делает возможным переиспользование результата предыдущего промиса в следующей операции и передавать данные между асинхронными операциями. Ошибки в любом промисе в цепочке могут быть перехвачены с помощью одного .catch(). Пример цепочки промисов: function exampl...

🌊 Что такое промисы? В JavaScript промис — это объект, представляющий результат асинхронной операции. Он позволяет работать с результатами асинхронных функций, не прибегая к колбэкам, что делает код более читабельным и управляемы Промис может находиться в одном из трех состояний: 1. Ожидание (Pending): начальное состояние, операция еще не завершена. 2. Выполнено (Fulfilled): операция завершена успешно. Промис возвращает результат. 3. Отклонено (Rejected): операция завершилась с ошибкой. Промис ...

❤️‍🔥 Callback Hell (или "ад коллбеков") — это термин, используемый для описания ситуации, когда использование коллбеков приводит к глубокой вложенности функций, вызывая снижение читабельности и сложности кода. 👎 Проблемы Callback Hell Сложность чтения: Вложенные коллбеки могут выглядеть громоздко и сложно воспринимаются. Каждый уровень вложенности делает код более трудным для понимания. Трудности отладки: Из-за глубокой вложенности становится сложнее отследить, где и как происходит ошибка. Есл...

🚀 Как управлять асинхронностью через колбеки 🍀 Асинхронная функция в JavaScript — это функция, которая позволяет выполнять асинхронные операции, такие как запросы к серверу, чтение файлов, таймер и любые другие действия, которые могут занять длительное время. Основная идея асинхронности заключается в том, что выполнение таких операций не блокирует выполнение остального кода. Это позволяет вашему коду оставаться отзывчивым и эффективным. Это функции выполнение которых будет завершено не сейчас,...

А как иначе ? 😀 #javascript #angular #frontend #programming 🐱 FrontEnd_Xpert

🍀 Оператор опциональной цепочки (?.) 1. Что это?: Это специальный оператор в JavaScript, который позволяет безопасно проверять, существует ли объект или его свойство перед тем, как к нему обратиться. 2. Как работает? : - Если объект или свойство не существует, он просто возвращает undefined, вместо того чтобы вызывать ошибку. - Пример: let user = { name: 'Аня', address: { city: 'Москва' } }; console.log(user.address?.city); // 'Москва' console.log(user.phone?.number); // undefined (не вызовет о...

🍀 FormData API FormData API — это интерфейс JavaScript, который упрощает работу с данными форм, позволяя отправлять их на сервер, включая поддержку файлов. 🚀 Основные методы: 1. Создание объекта: const formData = new FormData(formElement); // или new FormData() 2. Методы: - append(name, value): Добавляет новое значение. - set(name, value): Устанавливает значение, перезаписывая существующее. - delete(name): Удаляет указанное значение. - get(name): Получает первое значение для ключа. - getAll(na...

🍀 Какой будет ответ и почему ? console.log(1); console.log(2); setTimeout(() => console.log(3)); setTimeout(() => console.log(4), 0); 🚀 Вывод будет: 1 2 3 4 🚀 Объяснение: 1. Синхронные операции: console.log(1); → выведет 1 console.log(2); → выведет 2 2. Таймеры: setTimeout(() => console.log(5)); добавляет 5 в очередь выполнения, которая будет обработана после текущего стека. setTimeout(() => console.log(4), 0); также добавляет 4 в очередь, но с нулевой задержкой. Однако, в большинстве браузер...