Javascript
18.6K subscribers
804 photos
117 videos
2 files
1.24K links
По всем вопросам - @workakkk

@itchannels_telegram -🔥лучшие ИТ-каналы

@ai_machinelearning_big_data - машинное обучение

@JavaScript_testit- js тесты

@pythonl - 🐍

@ArtificialIntelligencedl - AI

@datascienceiot - ml 📚

РКН: № 5153160945
Download Telegram
🖥 Полезная статья о функциях высшего порядка в Javascript

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

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

Функции высшего порядка полезны по нескольким причинам:

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

Композиция: Функции высшего порядка позволяют создавать сложные операции путём объединения простых функций. Это делает ваш код более модульным, гибким и лёгким для понимания.

Лаконичность: Функции высшего порядка могут сделать код более лаконичным и выразительным, сократив объем кода, который вам нужно написать. Это облегчает написание и понимание сложной логики, а также отладку кода.

📎 Статья

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥13👍8🥰1👏1
🖥 Понимание среды выполнения JavaScript

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

Некоторые факты из статьи:

JavaScript имеет уникальную модель выполнения, основанную на движке.

В среде выполнения JavaScript есть два основных компонента: куча (Heap) и стек вызовов (Call Stack).

Куча предоставляет место для хранения переменных и экземпляров, создаваемых программой.

Стек вызовов играет важную роль в выполнении кода, записывая точку в программе, где выполняются операции.

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

Web API, Очередь Обратных Вызовов и Цикл Событий обеспечивают неблокирующее поведение JavaScript.

📎 Статья

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
👍192🔥1
🔥 Monolith - это инструмент CLI для сохранения полных веб-страниц в виде отдельных HTML-файлов. Он объединяет все ресурсы в один файл, обеспечивая автономный доступ и простое архивирование.

Github

@javascriptv
👍12🔥41
🖥 Создание приложения Node.js с TypeScript

Полезная статья о том, как настроить TypeScript для создания приложений Node.js с pnpm, Node.js, TypeScript и ES Modules для удобной разработки.

План статьи
Понимание инструментов
Добавление файлов конфигурации
package.json
"type": "module" в package.json
— Зависимости
— Конфигурация TypeScript
.gitignore
— Каталог src
Добавление скриптов
— Скрипт build
— Скрипт start
— Скрипт dev
—— tsc --watch
—— node --watch
—— run "/dev:/"

📎 Статья

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍102🔥2
Объект URL в JavaScript: полный разбор

Итак, создать объект URL можно 2 способами:

— Конструктор URL():
const url = new URL("https://www.example.com/path?query=123#hash");


— Использование window.location:
const currentUrl = new URL(window.location.href);



Из чего состоит URL
Вот некоторые составляющие URL :
href: полный URL.
protocol: протокол, например https:.
host: хост (доменное имя и порт).
hostname: только доменное имя.
port: только порт.
pathname: путь после доменного имени и порта.
search: строка запроса, начинающаяся с ?.
hash: якорь, начинающийся с #.
origin: протокол + домен + порт.

Допустим, у нас есть такой URL, включающий все эти части:
https://www.example.com:8080/path/page.html?query=123#section


Тогда объект URL для него будет выглядеть так:
const url = new URL("https://www.example.com:8080/path/page.html?query=123#section");


А если мы попытаемся вывести значения разных свойств, получим следующее:
console.log(url.href);     // https://www.example.com:8080/path/page.html?query=123#section
console.log(url.protocol); // https:
console.log(url.host); // www.example.com:8080
console.log(url.hostname); // www.example.com
console.log(url.port); // 8080
console.log(url.pathname); // /path/page.html
console.log(url.search); // ?query=123
console.log(url.hash); // #section
console.log(url.origin); // https://www.example.com:8080


Ещё вы можете изменить любую часть URL, изменяя соответствующее свойство.
url.search = "?newquery=456";
console.log(url.href);
// https://www.example.com:8080/path/page.html?newquery=456#section


Объект URLSearchParams в сочетании с объектом URL упрощает работу с параметрами запроса.
const params = new URLSearchParams(url.search);
params.set("newparam", "value");
url.search = params.toString();
console.log(url.href);
// https://www.example.com:8080/path/page.html?newquery=456&newparam=value


@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
👍246🔥3
🖥 Сравнение Bun.js и Node.js

Держите полезную статью, в которой сравнивается Bun.js и Node.js
А перед этим давайте немного поговорим о Bun.js

Вот основные преимущества Bun.js:
— Почти полная совместимость с Node.js/Deno.
— В десятки раз быстрее Node.js и Deno.
— Нативная поддержка JavaScript.
— Богатый набор встроенных Web API.
— Самый эффективный менеджер пакетов.
— Встроенный dev-сервер.
— Встроенный раннер тестов.
— Встроенный бандлер.
— Возможность почти моментального перехода с Node на Bun.

Откуда такая скорость? В первую очередь это современные технологии и тонны большого труда при профилировке и оптимизации.

За счет чего достигается эффект Blazingly Fast, которым так известен Bun.js сегодня?
— Bun написан на языке Zig. Это альтернатива C++ и Rust. Zig предоставляет низкоуровневые возможности для ручной работы с памятью, за счет чего появляется возможность оптимизировать вообще все элементы платформы. К слову, это и было сделано: более 80% составных частей Bun, которые так или иначе уже были реализованы в Node, были переписаны на Zig с максимальной оптимизацией обращений к памяти.

— Bun использует движок JSCore. Конечно, напрямую на производительность это не влияет, поскольку многие бенчмарки вам скажут, что JSC почти идентичен по скорости V8. Однако в данном случае дело вовсе не в производительности. JSCore предоставляет более открытую и удобную платформу для выполнения JS-кода, в отличие от V8, который изолирует этот процесс, поэтому накладные расходы на многие процессы снижаются.

📎 Статья

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥17👍5👎21👏1😁1
🖥 Хорошо ли ты знаешь JavaScript? Проверь себя

Кто-то думает, что JavaScript — это простой язык для несложных скриптов на странице. Но на самом деле современный JS умеет куда больше, чем это было раньше.
Проверь себя, насколько ты знаешь возможности JavaScript.

📎 Ссылка на тест

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
7👎3👏3🔥2
🖥 Асинхронность в JS

Хорошая статья о том, как реализована асинхронность в JavaScript, когда и для чего её использовать

Содержание статьи:
Синхронный код и его проблемы
Асинхронный код
Стек вызовов
Цикл событий
Колбэки
Промисы (Promise)
Асинхронные функции
— Связка async/await
— Плюсы async/await

Пару фактов из статьи:
Асинхронный код включает функции обратного вызова (колбэки), которые вызываются в ответ на события.

Ад колбэков — проблема, связанная с использованием большого количества обратных вызовов в асинхронном коде.

Промисы — объект-обёртка для асинхронного кода, который содержит состояние и работает аналогично колбэкам.

Асинхронные функции — функции, которые возвращают промисы и могут быть вызваны с помощью ключевого слова await.

Связка async/await позволяет писать более чистый и короткий код, а также обрабатывать ошибки с try-catch.

В Node.js и некоторых браузерах есть setImmediate(), который выполняет почти то же, что и setTimeout() с нулевым таймером.

Promise.all() и Promise.race() используются для ожидания выполнения всех запросов или ожидания выполнения первого запроса из списка.

Для обхода асинхронных итерируемых сущностей можно использовать for await...of.

📎 Статья

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍165🔥2👏2
🚀 fetch-event-stream` 🥳

Крошечная утилита (745b) для обработки событий, отправляемых сервером через API "fetch" и/или WebStreams

🔹 Поддерживает все среды выполнения JS
🔸 Позволяет использовать WebWorker / ServiceWorker
🔹 Принимает AbortController для потоков, которые можно отменить

GitHub: https://github.com/lukeed/fetch-event-stream

@javascriptv
👍143🔥3
🖥 Какие темы освещаются в статье?

Вы же знаете про HTMX?
HTMX — это небольшая, свободная от зависимостей библиотека JavaScript, позволяющая создавать передовые пользовательские интерфейсы с лёгкостью языка разметки. Она предоставляет доступ к AJAX, CSS Transitions, WebSockets и Server Sent Events напрямую в HTML с помощью атрибутов. Это стало переломным моментом для разработчиков, поскольку позволяет им добиться интерактивности (которую даёт JS), но непосредственно из HTML разметки.

И вот как раз о HTMX и идёт речь в этой статье

Вот темы, которые освещаются:
• Установка HTMX
• Ajax-запросы с помощью HTMX
• Триггер запроса
• Модификаторы триггеров
• Фильтры триггеров
• Логирование и события в HTMX
• и ещё много всего

📎 Статья

P.S: Как думаете, какие перспективы у этой технологии? Из каких сфер HTMX может полностью вытеснить JS?

@javascriptv
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍132🔥1