12 приемов работы с JavaScript, которых нет в большинстве туториалов

[netcat-na-diary]

https://habr.com/ru/company/skillbox/blog/446770/

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

const array = [1, 1, 2, 3, 5, 5, 1];
const uniqueArray = [ ...new Set(array)];

console.log(uniqueArray);

// (4) [1, 2, 3, 5]

Работает только для примитивных типов - undefined, null, boolean, string, number

2. Кэширование длины массива в циклах

При такой записи цикл for повторно проверяет длину массива при каждой итерации

for (let i = 0; i < array.length; i++){
  console.log(i);
}

Можно задать переменную, в которую положить длину

const array = [1, 2, 3, 4, 5, 6];
for (let i = 0, length = array.length; i < length; i++) {
	console.log(array[i]);
}

3. Оценка короткого замыкания (оценка Маккарти)
Использование вместо тернарного оператора логических операторов && и ||

&& - вернет первое false значение; если каждый операнд равен true, то вернется последнее вычисленное выражение
||- вернет первое false значение; если каждый операнд равен false, то вернет последнее вычисленное выражение

let one = 1, two = 2, three = 3;

console.log(one && two && three); // result 3

console.log(0 && null); // result 0

console.log(one || two || three); // result 1

console.log(0 || null); // result null

Пример использования

return (this.state.data || "Fetching data");

Преобразование в boolean
Все значения в JS - truthy, за исключением 0, "", null, undefined, NaN и false - они являются falsy.

Можно использовать оператор !, который также преобразует тип в логический

const isTrue = !0;
console.log(isTrue);

const isFalse = !1;
console.log(isFalse);

const alsoFalse = !!0;
console.log(alsoFalse);

Преобразование в строку

const val = 1 + "";

console.log(val);
console.log(typeof val);

ПРЕОБРАЗОВАНИЕ В ЧИСЛО
Преобразование строки в число

let int = "15";
int = +int;

console.log(int);
console.log(typeof int); // number

Преобразование булевых значений в число

console.log(+true);
console.log(+false);

Использование двух тильд ~~

const int = ~~"15";
console.log(int);
console.log(typeof int); // number

Использование двух тильд для определения наличия элемента в массиве при помощи indexOf

const myArray = [1, 2, 3, 4, 5];

if (~myArray.indexOf(2)) {
	console.log("Найден");
} else {
	console.log("Не найден");
}

if (~myArray.indexOf(10)) {
	console.log("Найден");
} else {
	console.log("Не найден");
}

Возведение в степень **

console.log(2 ** 3);

Преобразование Float в целое число

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

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

Автоматическое связывание
Стрелочные обозначения ES6 можно использовать в методах класса, и при этом подразумевается привязка.

Обрезка массива
1 способ - переопределить длину length

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

console.log(array);

2 способ - более быстрый с использованием .slice()

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

console.log(array);

Вывод последнего значения (значений) массива с использованием .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]