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

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

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

Канал на бирже: telega.in/channels/notesjs/card?r=Wj7h1mbl
Download Telegram
Расширения Chrome

Делимся статьей, где автор рассказывает про полезные расширения для Chrome. Есть как и общие расширения для всех, так и более специфические. Например, для определения фреймворка, шрифтов. Также есть список расширений для GitHub.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
2
Преобразование в строку

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

#типы
👍31
Web Speech API

Web Speech API позволяет использовать голосовые данные в веб-приложениях. Web Speech API состоит из двух частей: SpeechSynthesis (преобразование текста в речь) и SpeechRecognition (асинхронное распознавание речи). Благодаря этой статье ты познакомишься с Web Speech API.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
2👍2
Преобразование в целое число

Этот способ может быть использован и для преобразования логического типа данных boolean в обычные числовые значения, как показано ниже:

console.log(+true); // Return: 1
console.log(+false); // Return: 0

#типы
👍6
Задачи на Promise

Объект Promise представляет возможное завершение (или сбой) асинхронной операции и ее результирующее значение. В данной статье продемонстрированы основные задачи на Promsie, которые часто спрашивают на собеседованиях. Присутствует код с подробными комментариями.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
4
Float в целое число

При
необходимости преобразовать float в целое число можно воспользоваться Math.floor(), Math.ceil() или Math.round(). Но есть и более быстрый путь, для этого используем |, то есть оператор OR.

console.log(23.9 | 0); // Result: 23
console.log(-23.9 | 0); // Result: -23

#полезно
🔥4
Как работает браузер

Между моментом, когда пользователь запрашивает веб-страницу, и временем, когда она отображается в его браузере, происходит несколько шагов. Делимся статьей, где автор подробно рассказывает про эти шаги.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
3
Убираем замыкающие числа

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

let str = "1553";
Number(str.substring(0, str.length - 1));

Вместо этого просто прописываем:

console.log(1553 / 10 | 0) // Result: 155
console.log(1553 / 100 | 0) // Result: 15
console.log(1553 / 1000 | 0) // Result: 1

#полезно
👍8
Использование ESLint

ESLint — это инструмент для выявления шаблонов, обнаруженных в коде ECMAScript/JavaScript, и составления отчетов о них. Во многом он похож на JSLint и JSHint. Благодаря этой статье ты узнаешь, как правильно пользоваться ESLint.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
2
Автоматическое связывание

Стрелочные обозначения ES6 можно использовать в методах класса, и при этом подразумевается привязка. Благодаря этому можно попрощаться с повторяющимися выражениями, такими как this.myMethod = this.myMethod.bind (this)!

#классы
👍21
Шаблоны загрузки данных

Современные фронтенд-приложения становятся все больше и больше. Неудивительно, что индустрия все больше заботится об оптимизации. Шаблоны загрузки данных являются важной частью твоего приложения, поскольку они определяют, какие части могут быть непосредственно использованы посетителями. Делимся статьей, где автор рассказывает про шаблоны загрузки данных.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
1
Обрезка массива

Если вам необходимо убрать значения из массива, то есть более быстрые методы, чем splice().

К примеру, если вы знаете размер оригинального массива, то можете переопределить его свойство length следующим образом:

let array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
array.length = 4;

console.log(array); // Result: [0, 1, 2, 3]

Но есть и еще один метод, причем более быстрый. Если для вас имеет значение именно скорость, то вот наш выбор:

let array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
array = array.slice(0, 4);

console.log(array); // Result: [0, 1, 2, 3]

#массивы
🔥6👍2
Создание QR-кода

Библиотека QRCode.js позволяет создавать QR-коды. Делимся статьей, где автор демонстрирует настройку и генерацию QR-кода. Также продемонстрировано использования кода в ванильном JS.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
4
Вывод последнего значения (значений) массива

Этот прием требует использования метода slice().

#массив
👍7
Сравнение элементов двух массивов

Благодаря этой статьей ты научишься сравнивать элементы двух массивов. Рассмотрено два метода решения этой задачи: использование объектов Set; применение функций высшего порядка.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
👍5
Форматирование JSON-кода

Возможно, вы уже использовали JSON.stringify. Знаете ли вы, что он помогает форматировать ваш JSON?

Метод stringify() принимает два необязательных параметра: функцию replacer, которую можно использовать для фильтрации отображаемого JSON, и значение space.

#полезно
👍9
Преобразование чисел

Делимся статьей, где автор демонстрирует преобразование шестнадцатеричного числа в десятичное. Для этого используется ParseInt. Для наглядности приведен пример преобразования шестнадцатеричного кода цвета в его эквивалент в формате RGB.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
webpack

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

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
1
Быстрый способ создать маску для числа методами slice и padStart

#полезно
👍12
Оператор с запятой

Вновь простой вопрос, что будет выведено в консоль?

console.log((2,5 - 2) * 2);

Совершенно верно, 6. Но почему?

Всё дело в том, что тут написано не число два с половиной, а число два, запятая, число 5. Что делает запятая? Она выполняет слева направо каждый из операндов и возвращает значение последнего, в данном примере число 5.

#операторы
👍9
Чтение документации API

Лучшая документация по API — это справочник, в котором кратко объясняется, что возможно, а что нет, и с чего начать. Он также служит местом, к которому пользователи могут обращаться с вопросами о синтаксисе или функциональности. В данной статье рассказано, как читать и понимать документацию API.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью
👍1