javascriptv | Unsorted

Telegram-канал javascriptv - Javascript

18174

По всем вопросам - @workakkk @itchannels_telegram -🔥лучшие ИТ-каналы @ai_machinelearning_big_data - машинное обучение @JavaScript_testit- js тесты @pythonl - 🐍 @ArtificialIntelligencedl - AI @datascienceiot - ml 📚 РКН: № 5153160945

Subscribe to a channel

Javascript

Использование FileReader для чтения файлов в JavaScript

Нашли для вас туториал о том, как использовать FileReader для чтения содержимого файлов в браузере. Автор статьи на практике рассмотрел несколько примеров, как с использованием элемента input, так и Drag'n'Drop:

https://itchief.ru/javascript/filereader

#javascript #туториал

@javascriptv

Читать полностью…

Javascript

🔥 Дайджест полезных материалов из мира : Javascript за неделю

Почитать:
— Натальная травматология фронтенда S1 E1-14
— Митапы PiterJS вернулись
— Rematch — Redux без шаблонного кода
— Утечки памяти в SSR: причины, поиск, устранение
— Скрытие POI за зданиями
— Что нового в Chrome 117?
— Видеоредактор, работа с видео и зачем там Canvas
— Kysely.js типизированный sql builder
— Измерение размеров объектов на фотографии
— Find the best herbal chamomile tea - junglesting
— 10 'Aha' Moments: Navigating React's New Documentation!
— GitHub Decoded: Your Beginner's Guide
— Web workers in ReactJs
— 🚀Learn Next.js 13 Within 2 Hours🚀
— Latest Newsletter: Wonderfull and Strange Nerdy Discussions (Issue #132)
— 🚀Mastering Performance Optimisation in React Applications🚀
— How Does Nerve Regen Formula Work?
— What Is Bun 1.0? A Game-Changer in JavaScript Development
— Mastering object manipulation in JavaScript

Посмотреть:
🌐 Learning To Code Is Easy (⏱ 08:59)
🌐 NEW React Hooks Saves 1K+ Lines Of Code (⏱ 01:00)

Хорошего дня!

@javascriptv

Читать полностью…

Javascript

7 дней бесплатного обучения frontend-разработке!

🔥 Организовали для тебя бесплатный онлайн-интенсив по frontend-разработке с практикой, обратной связью и куратором.

За 7 дней ты:
- Сверстаешь веб-сайт на HTML + CSS;
- Реализуешь функционал на JavaScript;
- Используешь фронтенд-фреймворк Angular;
- Подключишь Backend и загрузишь сайт на хостинг.

В итоге ты сверстаешь качественный сайт, который не стыдно добавить в портфолио или продать, освоишь азы работы с фреймворком Angular и получишь море бесценного опыта в вёрстке сайтов.

Ухватить бесплатно такой ценный материал можешь по ссылке 👉 Frontend Start

После подтверждения участия мы вышлем тебе в подарок чек-лист: «45 мест для поиска работы», где собраны все ресурсы, на которых разработчики находят работу в престижных IT-компаниях.

Стартуем 18 сентября.

Реклама. ИП Чернова О. А., ИНН:771399721044, erid:LjN8KGsup

Читать полностью…

Javascript

Попасть фронтендером в Яндекс за выходные — реально

23–24 сентября приходите на Wekeend Offer Frontend. Для этого нужно зарегистрироваться и решить фронтенд-квиз. После вы сможете за 2 дня пройти технические секции, познакомиться с нанимающими командами и получить офер в интересный проект.

В мероприятии участвуют 17 команд: HR Tech, Поиск, Рекламные продукты, Yandex Cloud, 360, Яндекс Браузер, Бизнес-приложения, Умный дом, Yandex Infrastructure, Лавка, Еда, Недвижимость, Аренда, Авто.ру, CM.Expert, Путешествия и Буткемп. Вы сможете поговорить с ребятами и узнать, как работается в проектах. Если всё сложится хорошо — сразу же получите офер.

Помогаем релоцироваться по РФ, нанимаем в офисы по всей стране.

Узнать подробности и зарегистрироваться можно здесь.

Реклама. ООО "Яндекс". erid: 2Vtzqx6jEoJ

Читать полностью…

Javascript

🖥 Diagonal Layouts - анимация заднего фона с изменения по ползунку, реализована с помощью CSS и JS

https://codepen.io/enbee81/pen/yLyrmyg

@javascriptv

Читать полностью…

Javascript

Responsive Social Platform UI — красивый адаптивный интерфейс социальной платформы, реализованный с помощью Alpine.js

https://codepen.io/TurkAysenur/pen/RwWKYMO

@javascriptv

Читать полностью…

Javascript

🖥 Landing page with swiper - Карточки с прокруткой.

https://codepen.io/kristen17/pen/GRXgqaB

@javascriptv

Читать полностью…

Javascript

💬 10 ключевых концепций JavaScript

1. Замыкания
▪️Замыкания обычно используются в JavaScript для создания частных переменных и инкапсуляции. Определяя переменные во внешней функции и возвращая внутреннюю функцию, которая обращается к этим переменным и изменяет их, можно контролировать видимость и манипуляции с данными. Это позволяет добиться сокрытия информации и избежать загрязнения глобального пространства имен.

▪️Когда outerFunction вызывается и присваивается замыканию, создается замыкание, которое сохраняет ссылку на outerVariable. В дальнейшем при вызове замыкания оно будет иметь доступ к outerVariable и может регистрировать ее значение.

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

2. Промисы
▪️Промис представляет собой конечный результат асинхронной операции, который может быть либо разрешенным значением, либо причиной отказа. Промис бывает в трех состояниях: ожидающий, выполненный, отклоненный.

▪️Для создания промиса используется конструктор Promise, который принимает функцию обратного вызова с двумя параметрами: resolve и reject. Внутри этого обратного вызова выполняется асинхронная задача с вызовом либо resolve(value) для выполнения промиса со значением, либо reject(reason) для отклонения его с указанием причины (обычно это объект error).

▪️Метод then() используется для обработки выполнения промиса. Он принимает функцию обратного вызова, которая получает разрешенное значение в качестве аргумента. Можно объединить несколько вызовов then() в цепочку для выполнения последовательных операций или преобразований разрешенного значения.

▪️Метод catch() используется для обработки отказа от выполнения промиса. В качестве аргумента он принимает функцию обратного вызова, которая получает причину отказа (ошибку). Обычно он используется в конце цепочки промисов для обработки ошибок, возникших во время асинхронной операции.

▪️Промисы также предоставляют дополнительные методы, такие как finally(), позволяющий указать обратный вызов, который будет вызван независимо от того, выполнен промис или отклонен, и Promise.all(), который можно использовать для ожидания выполнения нескольких промисов.

3. Прототипы и прототипное наследование
▪️Прототип — это объект, от которого другие объекты наследуют свойства и методы. При обращении к свойству или методу объекта JavaScript сначала проверяет, есть ли это свойство у самого объекта. Если нет, он просматривает цепочку прототипов в поисках прототипа объекта, затем прототипа прототипа и так далее, пока не найдет свойство или не достигнет конца цепочки.

В этой программе используются функции-конструкторы Animal и Dog.

▪️Функция-конструктор Animal принимает параметр name и присваивает его свойству name вновь создаваемого объекта с помощью this.name.

▪️Добавляем метод greet в Animal.prototype, который будет общим для всех экземпляров, созданных с помощью функции-конструктора Animal.

▪️Функция-конструктор Dog расширяет Animal с помощью Animal.call(this, name) для наследования свойств от конструктора Animal.

▪️Образуем цепочку прототипов, создав новый объект с помощью Object.create(Animal.prototype) и присвоив его Dog.prototype. Это связывает прототип экземпляров Dog с Animal.prototype, обеспечивая наследование.

▪️Добавляем в Dog.prototype метод bark, который предназначен для экземпляров, созданных с помощью конструктора Dog.

▪️Создаем экземпляры Animal и Dog с помощью ключевого слова new. Экземпляр animal использует метод greet, унаследованный от Animal.prototype, а экземпляр dog использует как метод greet, унаследованный от Animal.prototype, так и метод bark, определенный в Dog.prototype.

📌Читать

@javascriptv

Читать полностью…

Javascript

Glassmorphing card - Карточка в стиле стекломорфизма с плавным 3D-наклоном при наведении, созданная с помощью библиотеки Tilt.js.

https://codepen.io/pieter-biesemans/pen/QWKmXEE

@javascriptv

Читать полностью…

Javascript

⭐️ Обзор 10 приемов JavaScript для эффективного программирования

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

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

Рассмотрим пример форматирования валюты:
let num = 100;

let RupeeFormatter = new Intl.NumberFormat("en-IN",
{style: "currency", currency: "INR"})

let RupeeFormatted = RupeeFormatter.format(num);

console.log(RupeeFormatted)
//
₹100

let USDFormatter = new Intl.NumberFormat("en-IN",
{style: "currency", currency: "USD"})

let USDFormatted = USDFormatter.format(num)

console.log(USDFormatted)
// $100


2. Оператор ??
Оператор ?? присваивает переменной значение по умолчанию, если она null или undefined.

Используйте данный оператор, если сомневаетесь в существовании у объекта того или иного свойства. Если свойство отсутствует, переменной присваивается значение по умолчанию.

Пример:
let user = {}

let name = user.name ?? "Anonymous"

console.log(name)
// "Anonymous"


3. Object.fromEntries()
Метод Object.fromEntries() преобразует массив пар “ключ-значение” в объект.

Возьмем следующий массив и создадим из него объект, как показано ниже:
let arr = [["name", "Alice"], ["age", 25]]

let obj = Object.fromEntries(arr);

console.log(obj)
// {name: "Alice", age: 25}


4. Array.flat()
Метод Array.flat() преобразует вложенный массив в один единственный.

Поскольку вложенными массивами сложно управлять, то данный метод помогает уменьшать их вложенность.

Пример:
let arr = [1, [2, [3, [4]]]];

let flat = arr.flat(Infinity)

console.log(flat)
// [1, 2, 3, 4]


5. Оператор ?
Оператор ?. обеспечивает доступ к свойствам объекта без проверки, является ли он null или undefined.

Используйте его, когда не знаете, существует ли объект или нет.

Пример:
let user = null

let age = user?.age

console.log(age)
// undefined


6. Array.reduce()
Метод Array.reduce() применяет функцию к каждому элементу массива и суммирует результат в одно значение.

Пример сложения всех чисел массива:
let arr = [1, 2, 3, 4, 5]

let sum = arr.reduce((a, b) => a + b)

console.log(sum)
// 15


7. String.repeat()
Метод String.repeat() создает новую строку, повторяя заданную строку указанное количество раз.

Пример:
let str = "js".repeat(10)

console.log(str)
// 'jsjsjsjsjsjsjsjsjsjs'


8. Array.from()
Метод Array.from() создает новый массив из массивоподобного или итерируемого объекта.

Пример:
let str = "Hello"

let arr = Array.from(str)

console.log(arr)
// ["H", "e", "l", "l", "o"]


9. Math.hypot()
Метод Math.hypot() находит квадратный корень из суммы квадратов его аргументов.

Так, сумма квадратов 3 и 4 равна 25, а квадратный корень из 25 равен 5. Следовательно, Math.hypot(3, 4) возвращает 5.

Пример:
let hyp = Math.hypot(3, 4);

console.log(hyp)
// 5


10. Object.assign()
Метод Object.assign() копирует значения всех перечисляемых собственных свойств из одного или нескольких исходных объектов в целевой объект.

Пример:
let obj1 = {a: 1, b: 2};

let obj2 = {c: 3, d: 4};

let obj3 = Object.assign(obj1, obj2)

console.log(obj3)
// {a: 1, b: 2, c: 3, d: 4}


@javascriptv

Читать полностью…

Javascript

Создайте крутой проект для портфолио

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

По итогу вы получите клон действующего сервиса по выбору цветов:

https://www.youtube.com/watch?v=OaNICHKM5KM

#javascript #туториал

@javascriptv

Читать полностью…

Javascript

⭐️CSS Diner

Интерактивная игра для прокачки и закрепления знаний о селекторах CSS. В игре даётся анимированная полка блюд, HTML форма и определённый элемент или элементы, которые надо выбрать.

https://flukeout.github.io/

@javascriptv

Читать полностью…

Javascript

Как сделать кастомный Semi Donut Chart с помощью SVG

Semi Donut Chart — это одна из форм представления отчётов в виде полукруглой диаграммы. Semi Donut Chart в том случае, когда важна не математическая точность, а наглядность.

Если вы хотите сделать интересный Semi Donut Chart без использования библиотек по типу Chart.js, то этот туториал для вас.

@javascriptv

Читать полностью…

Javascript

🔥 CSS Dots wave - анимированная сцена, выполненная с помощью SCSS, без использования JavaScript

https://codepen.io/amit_sheen/pen/vYpZBwP

@javascriptv

Читать полностью…

Javascript

⚡ Интересное исследование производительности анимации на основе скролла страницы

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

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

#javascript #api #css #web

@javascriptv

Читать полностью…

Javascript

⚡Creativity Now — 3D-текст, созданный на Blender. Анимация замены оформления реализована с помощью Tree.js.

#анимация #Blender #Treejs

https://codepen.io/ScavengerFrontend/pen/mdRrVVO

@javascript

Читать полностью…

Javascript

Архитектурные стили, которые вы должны знать в 2023 году

— REST (Representational State Transfer): REST - это архитектурный стиль, в котором используются преимущественно методы HTTP, - чемпион по простоте и повсеместности. Он обеспечивает простое взаимодействие с ресурсами, что делает его основным паттерном для множества приложений и современных API.

— SOAP (Simple Object Access Protocol): SOAP, претендующий на звание тяжеловеса на арене API, отличается сложностью и мощностью. Он использует XML для определения структурированного взаимодействия. Хотя для работы с SOAP требуется клиент и сервер, он компенсирует это своей прочностью и надежностью, подобно хорошо сконструированному внедорожнику, преодолевающему труднопроходимую местность.

— GraphQL: Восходящая звезда в мире API, GraphQL предлагает гибкость и точность. Он позволяет клиентам запрашивать именно то, что им нужно, сокращая избыточность и повышая производительность. Подумайте об этом как о персональном покупателе - вы получаете только то, что просили, ни больше, ни меньше.

— gRPC (Google Remote Procedure Call): gRPC - это самый быстрый из всех API. Работающий по протоколу HTTP/2 и использующий двоичные данные, он нацелен на производительность и скорость, особенно в архитектурах микросервисов. Он подобен скоростному поезду, обеспечивающему быструю и надежную связь.

— WebSockets: Если вам нужна связь в реальном времени и двунаправленная связь, то WebSockets - это то, что вам нужно. Они идеально подходят для чат-приложений, потокового вещания и обмена данными в реальном времени - это как открытая телефонная линия между клиентами и серверами.

— Webhooks: Webhooks - это глашатаи цифрового мира. Они уведомляют клиентов о наступлении определенных событий на стороне сервера, что делает их идеальным решением для архитектуры, управляемой событиями. Представьте себе, что это ваша персональная система оповещения, которая информирует вас о том, что важно.

#советы

Читать полностью…

Javascript

VideoCall App UI — изящный пользовательский интерфейс приложения VideoCall, реализованный с помощью jQuery.

https://codepen.io/aybukeceylan/pen/pobbEYB

@javascriptv

Читать полностью…

Javascript

📊Создание кольцевой диаграммы на JavaScript

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

(Предварительный обзор кольцевой диаграммы в изображении)

Создание кольцевой диаграммы на JavaScript в четыре этапа
Посмотрим, как быстро и легко создать визуально красивую и функциональную кольцевую диаграмму на JavaScript. Этот процесс можно разделить на четыре этапа:

1) Создание базовой HTML-страницы.
2) Включение необходимых JavaScript-файлов.
3) Добавление данных.
4) Написание JS-кода.

1. Создание базовой HTML-страницы
Для начала создадим базовую HTML-страницу с элементом <div> для размещения кольцевой диаграммы. Дадим ей идентификатор. Установим ширину и высоту на 100% без полей и отступов, чтобы диаграмма отображалась во весь экран.

<html>
<head>
<title>JavaScript Donut Chart</title>
<style type="text/css">
html, body, #container {
width: 100%; height: 100%; margin: 0; padding: 0;
}
</style>
</head>
<body>
<div id="container"></div>
</body>
</html>


2. Включение необходимых JavaScript-файлов

Далее

@javascriptv

Читать полностью…

Javascript

🔥 Дайджест полезных материалов из мира : Javascript за неделю

Почитать:
— Создатель Ruby on Rails: «Turbo 8 отказывается от TypeScript»
— Как отправлять пользовательский интерфейс по API
— Проблема код-ревью: ESLint — больше, чем просто «extend»
— Бот-сказочник, или как генерировать истории с помощью ChatGPT и Telegram
— 9 лучших консольных файловых менеджеров Linux
— Создаём с нуля своё BIM-приложение для просмотра моделей IFC формата в браузере на основе open-source библиотеки IFC.js
— Обертка для indexedDB / localStorage /…
— Как грамотный подход аналитиков может сэкономить бюджет компании за счет изменения подхода к реализации проекта
— Ускорение в 30 раз — requestIdleCallback
— Повышаем продуктивность разработки: магия общей ESLint конфигурации
— Создание приложения для распознавания текста с изображений и аудиофайлов
— Bun 1.0 got released, its Packager Manager is 10x faster then yarn
— Finally you can skip dotenv in Node
— Are you still using the ternary operator to dynamically apply Tailwind styles?
— The Fundamental Concept For JavaScript Beginners
— Latest Newsletter: Circles or Squiggles? (Issue #131)
— Node.js 20.6.0: Say Goodbye to 'dotenv'
— How to resolve the error "Unable to validate properties of null value"?
— Unlock $10 and the Future of OCR with Verifik's Scan-Prompt API!
— Set Minimum Height CK Editor/CK Editor rows="" Not Working
— SplideJS Revolutionize Your Website Design with Seamless Slider Integration

Посмотреть:
🌐 HTMX заменит Frontend?! WTF? (⏱ 12:12)
🌐 5+ CSS Features That Will Change How You Code (⏱ 17:58)
🌐 NEW Way To Create Variables In JavaScript (⏱ 01:00)

Хорошего дня!

@javascriptv

Читать полностью…

Javascript

Коротко и по работному делу!

→ Море IT вакансий на удалёнку разработчикам джунам, миддлам и сеньорам
→ Каждый день
→ Прямые контакты эйчаров! Без ссылок на х—ха ツ


Подписаться на канал 🤘


Реклама. ООО «Цифровые решения», ИНН: 7707469618, erid: LatgC5pWZ

Читать полностью…

Javascript

🔥 Дайджест полезных материалов из мира : Javascript за неделю

Почитать:
— react-query vs SWR и избавимся ли мы от Redux?
— Абстрактные типы данных. Изложение для начинающих
— Генерируем простой web интерфейс для просмотра таблиц PostgreSQL
— Паттерны реактивности в современном JavaScript
— Ликбез по распространенным Client-Side уязвимостям
— Подробная настройка Content Security Policy (CSP)
— RxJS: как операторы высшего порядка упрощают код
— Задачи про PEG-парсеры
— Просто о Deep #1
— Добавление server side Open Graph и прочего SEO в существующую SPA
— Why Use NodeJS Over Other Languages and Runtimes?
— Web End Projects
— Will JavaScript ever die? Can WebAssembly replace JS?
— JU Query: Web App for community based learning (Project)
— What Is NodeJS?
— JavaScript Functions and Events : A Comprehensive Guide
— React interactive Components | Tabs
— What Is A JavaScript Bundler?
— Event Loop - Javascript
— React Content Rendering

Посмотреть:
🌐 CSS Anchor Is The Best New CSS Feature Since Flexbox (⏱ 15:39)
🌐 New useFormStatus React Hook (⏱ 01:00)

Хорошего дня!

@javascriptv

Читать полностью…

Javascript

Video Sharing Platform UI

Пользовательский интерфейс платформы обмена видео, реализован с помощью CSS и JS

#анимация #css

https://codepen.io/TurkAysenur/pen/abvrNgx

@javascriptv

Читать полностью…

Javascript

🔥 Дайджест полезных материалов из мира : Javascript за неделю

Почитать:
— Под капотом анимаций в React Native. Часть 2/2: Reanimated and JSI
— Подборка VS Code-плагинов для Frontend-разработчиков и не только
— Рефлексия в JavaScript и TypeScript: обзор основных техник. Как сгенерировать CLI-интерфейс для класса
— Считаем «a=1; b=2; x=pi/3; abcos(x)»
— JavaScript повсюду или почему веб-технологии захватили мир
— DOM, DI и View: деревья в Angular
— Как уменьшали размер VS Code, используя name mangling — сокращение идентификаторов во время сборки
— Как показать миллион зданий на карте — и не сломать браузер
— Одно PWA, чтоб править всеми
— Как запретить разработчику делать не то что нужно?
— Introduction to Sets in JavaScript: A Comprehensive Guide
— Pune Escorts Services: Exploring a World of Connection and Luxury
— Cortexi Reviews 2023 - Ear Drops, Ingredients, Reviews, Benefits & Price?
— Latest Newsletter: Bingeing the Past and Building the Future (Issue #129)
— Web Application Debugging with Sentry Session Replay: Comprehensive Walkthrough 🚀🚀
— Elevate Your Buttons with CopyShareify-js: Copy, Share, and More!
— The Art of Earning with Amazon's Affiliate Program
— Introducing OTP Designer jQuery Plugin
— EasyCaptchaJS: Simplified reCAPTCHA Integration
— SysCorp Technology PVT LTD

Посмотреть:
🌐 NEW Way To Create Variables In JavaScript (⏱ 12:13)
🌐 Help Me Teach You TypeScript (⏱ 00:45)

Хорошего дня!

@javascriptv

Читать полностью…

Javascript

☕️ Tiling SVG Animation - красивая анимация состава разных кофейных напитков. Реализована с помощью CSS и JS.

https://codepen.io/RominaMartin/pen/KKgQmEW

@javascriptv

Читать полностью…

Javascript

🧑‍💻Техника каррирования в JavaScript: суть, преимущества, примеры

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

Начнем с базового примера.

• Рассмотрим функцию add, принимающую 2 аргумента и возвращающую их сумму:
function add(x, y) {
return x + y;
}

console.log(add(3, 4)); // Вывод: 7


• Функция add принимает 2 аргумента, x и y, и возвращает их сумму. Теперь выполним каррирование данной функции. Для этого воспользуемся техникой частичного применения:
function add(x) {
return function(y) {
return x + y;
};
}

console.log(add(3)(4)); // Вывод: 7


• В варианте с каррированием функция add принимает один аргумент x и возвращает другую функцию, которая принимает второй аргумент y, после чего выполняет сложение. Это позволяет вызвать add(3) и получить новую функцию, которую можно вызвать с оставшимся аргументом 4.

Каррирование обеспечивает ряд преимуществ.
▪Во-первых, оно позволяет создавать специализированные функции из более общих. Создадим переиспользуемую функцию addOne путем частичного применения функции add:
const addOne = add(1);
console.log(addOne(5)); // Вывод: 6
console.log(addOne(10)); // Вывод: 11


В примере addOne  — это новая функция, производная от add, которая всегда прибавляет 1 к своему аргументу. Эту функцию можно повсеместно переиспользовать в базе кода без дублирования логики.

▪ Во-вторых, каррирование делает возможным создание функций высшего порядка, улучшающих компонуемость. Рассмотрим функцию multiply, принимающую 3 аргумента и возвращающую их произведение:
function multiply(x, y, z) {
return x * y * z;
}

console.log(multiply(2, 3, 4)); // Вывод: 24


Выполняем каррирование функции multiply:
function multiply(x) {
return function(y) {
return function(z) {
return x * y * z;
};
};
}

console.log(multiply(2)(3)(4)); // Вывод: 24


Вариант с каррированием позволяет связать вызовы функций в цепочку, передавая по одному аргументу за раз. Это прием улучшает читаемость кода и упрощает композицию функций:
const multiplyByTwo = multiply(2);
const multiplyByThree = multiplyByTwo(3);

console.log(multiplyByThree(4)); // Вывод: 24
console.log(multiply(2)(3)(4)); // Вывод: 24


▪ В-третьих, каррирование способствует созданию более гибких функций. Создадим вариации функции, частично применив несколько аргументов и позднее предоставив другие:

▪ Продолжение

@javascriptv

Читать полностью…

Javascript

Holiday Feature Folding Cards [Pure CSS] - красивая анимация карточек с дополнительной информацией.

https://codepen.io/Maza-designDev/pen/KKdmyGb

@javascriptv

Читать полностью…

Javascript

About Us Pop-Out Effect - крутые виджеты для блока "О нас" с поп-ап жффектом.

https://codepen.io/ainalem/pen/QWGNzYm

@javascriptv

Читать полностью…

Javascript

UptimeSystem — мониторинг доступности веб-сайтов и серверов

UptimeSystem позволяет с лёгкостью отслеживать доступность ваших веб-сайтов, серверов и портов, а также контролировать выполнение ваших Cron-заданий

При этом вы можете получить мгновенные email-уведомления при изменении состояния отслеживаемых сервисов

Стоимость: #бесплатно (но есть платные тарифы)

@javascriptv

Читать полностью…

Javascript

Expanding Button - красивая анимированная кнопка с различными ссылками на медиа. Реализована с помощью SCSS, Pug и JavaScript.

https://codepen.io/abh1nash/pen/eYjQgEN

@javascriptv

Читать полностью…
Subscribe to a channel