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

Например, чтобы создать строку, содержащую значения переменных, можно использовать обычные строки и конкатенацию:

const name = 'Alice';
const age = 25;
const message = 'My name is ' + name + ' and I am ' + age + ' years old.';
console.log(message); // "My name is Alice and I am 25 years old."

С помощью шаблонных строк этот код можно записать короче и более читаемо:

const name = 'Alice';
const age = 25;
const message = My name is ${name} and I am ${age} years old.;
console.log(message); // "My name is Alice and I am 25 years old."

Шаблонные строки также позволяют использовать многострочный формат и вставлять выражения:

const message = My name is ${name} and I am ${age} years old. The square of my age is ${age * age}.;
console.log(message);
/*
"My name is Alice and I am 25 years old.
The square of my age is 625."
*/

#полезно

Особенности стрелочных функций

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

#статья

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

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

Нюансы использования push

При решении задач в массиве в JavaScript. Мы можем столкнуться с ошибками в методе push для добавления элемента. Здесь проблема возникает, когда мы создаем/разрабатываем что-то на JavaScript или React.

#статья

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

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

Промисы - это объекты, которые представляют собой асинхронную операцию, и имеют три состояния: ожидание (pending), выполнено (fulfilled) и отклонено (rejected). Промисы позволяют работать с асинхронными операциями более удобно, чем с колбэками, так как позволяют обрабатывать результаты асинхронной операции через методы then() и catch().

#полезно

Вот еще одна полезная заметка: в JavaScript есть два различных оператора сравнения: "==" и "===".

Оператор "==" сравнивает значения двух операндов и приводит их к одному типу данных, если они имеют разный тип. Например:

console.log(5 == "5"); // true

Значения сравниваются после приведения типов, поэтому "5" (строка) преобразуется в 5 (число).

Оператор "===" также сравнивает значения двух операндов, но не выполняет приведение типов. То есть, если операнды имеют разный тип, они будут считаться не равными. Например:

console.log(5 === "5"); // false

Значения не сравниваются после приведения типов, поэтому "5" (строка) и 5 (число) будут считаться разными значениями.

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

#операторы

tracking.js

Библиотека tracking.js привносит в среду браузера различные алгоритмы и методы компьютерного зрения. Используя современные спецификации HTML5, библиотека предоставляет возможность отслеживать цвета в реальном времени, распознавать лица и многое другое. Делимся статьей, где автор демонстрирует использование tracking.js.

#статья

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

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

Получить n последних элементов массива

Метод массива slice() может принимать отрицательные целые числа, и при наличии он будет принимать значения с конца массива, а не с начала.

let array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
console.log(array.slice(-1)); // Result: [9]
console.log(array.slice(-2)); // Result: [8, 9]
console.log(array.slice(-3)); // Result: [7, 8, 9]

#массивы

Генератор коротких CSS классов и id

Делимся статьей, где автор демонстрирует генерацию коротких css классов и id элементов в html верстке. Приведен алгоритм и требования к генератору, также присутствует ссылка на npm пакет.

#статья

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

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

Оператор || для задания значений по умолчанию

Одной из малоизвестных, но полезных заметок в JavaScript является то, что можно использовать логический оператор || для задания значений по умолчанию. Если переменная имеет значение null, undefined, false или 0, то можно использовать || для установки значения по умолчанию. Например, вместо записи:

if (x === undefined) {
  x = 'default';
}

можно записать:

x = x || 'default';

Эта конструкция работает так: если значение x равно null, undefined, false или 0, то будет использовано значение 'default'. Если значение x уже установлено и является истинным, то будет использовано это значение. Такой подход позволяет сократить код и упростить его чтение и понимание.

#операторы

Создание понга

Делимся статьей, где автор рассказывает про создание понга с помощью JavaScript. Продемонстрирована игровая логика, создание примитивов на 2D-канвасе. Присутствует ссылка на код в GitHub и видео-гайд.

#статья

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

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

Работа с аргументами функции

Вам не нужно определять параметры для функции. Вы можете просто использовать массиво-подобный объект функции argument.

#функции #полезно

Генератор коротких CSS классов и id

Делимся статьей, где автор демонстрирует генерацию коротких css классов и id элементов в html верстке. Приведен алгоритм и требования к генератору, также присутствует ссылка на npm пакет.

#статья

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

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

Операторы === и !==

Всегда используйте === и !== вместо == и !=.

== не является транзитивным. Если вы используете === , то оно как и ожидалось будет возвращать false для всех вышеперечисленных случаев.

#полезно

Управление страницей с помощью жестов

Делимся статьей, где автор демонстрирует управление страницей с помощью жестов. Для обнаружения и отслеживания руки и жестов используется MediaPipe. Для работы с зависимостями — Yarn.

#статья

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

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

Оператор in

Вы можете использовать оператор in для того чтобы проверить есть ли такой ключ у объекта.

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

#операторы

Heap out of memory

Распространенной проблемой при работе с Node.js является ошибка «heap out of memory». Эта ошибка обычно возникает, когда памяти по умолчанию, выделенной твоей системой для Node.js, недостаточно для запуска большого проекта. В данной статье автор демонстрирует, как можно решить эту проблему.

#статья

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

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

Свойства объекта

Вы можете получить доступ к свойствам объекта с помощью [] вместо '.'. Это позволяет найти свойство, которое соответствует переменной.

Также вы можете использовать это для получения/установки значения свойства, если его название неразрешенный идентификатор.

Некоторые люди не знают этого и заканчивают это использованием eval(),что по-настоящему плохая идея. Так код сложнее читать, сложнее находить ошибки(невозможно использование jslint), он медленнее выполняется и может привести к XSS.

#объекты

Шпаргалка по RegEx

Регулярное выражение — это последовательность символов, формирующая шаблон поиска. Шаблон поиска можно использовать для текстового поиска и операций замены текста. Делимся шпаргалкой для работы с RegEx.

#статья

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

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

Лайфхаки для улучшения кода

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

#статья

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

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

isInteger

Это аккуратный способ узнать, является ли значение целым числом. Встроенный в JavaScript API Number предоставляет для этого метод isInteger(). Очень полезная штука, о которой следует знать.

#методы