5 особенностей javascript, о которых вы должны были знать раньше

Нулевое слияние

Когда его левый операнд равен нулю или не определен, нулевой оператор объединения (??) возвращает свой правый операнд; во всех остальных случаях он возвращает свой левый операнд.
Это можно рассматривать как частный случай логического оператора ИЛИ (||), который возвращает правый операнд, если левый операнд содержит любое значение false, а не только null или undefined. Другими словами, если вы считаете, что некоторые ложные значения (например, « или 0) можно использовать, вы можете столкнуться с неожиданным поведением при использовании || предоставить некоторое значение по умолчанию для другой переменной foo.

> "string" || 20
'string'
> undefined || 20 // return 20 since undefined is on left
20
> "" || 30 // fails since "" is considered false
30
> "hello" ?? 20
'hello'
> "" ?? 20 // "" is not a null value
''
> undefined ?? 20 // undefined is on right so 20 is returned
20

Необязательная цепочка

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

При использовании с вызовами функций возвращает значение undefined, если данная функция не существует.

> object?.property // returns undefined if object is nullish otherwise returns the property
> object?.method?.() // calls the method if it is a method otherwise returns undefined instead of throwing an error

Сокращение объекта

Ключ и значения переменных будут указаны для создания объекта из существующей переменной. Поскольку этот шаблон продолжает встречаться в определенных типах проектов, в какой-то момент он может раздражать.

> let a = 10;
> let b = 20;
> let c = {a:a, b:b}; // creates {'a': 10, 'b': 20}

К счастью, сокращенный синтаксис объекта javascript решает эту проблему.

> let a = 10;
> let b = 20;
> let obj = {a, b} // create {'a': 10, 'b': 20}

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

операторы возведения в степень

Math.pow() обычно используется для поиска значений экспоненты. Однако это может быть неудобно при написании математических формул в виде выражений. В результате предпочтительнее использовать оператор ** вместо функции pow(), поскольку он более удобочитаем и прост в написании.

> Math.pow(4, 0.5)
2
> 4 ** 2
16

стили в журнале консоли

Большинство javascript-разработчиков не знают, что стили могут применяться к console.log(). Второй аргумент будет передан для применения стилей к выводам журнала консоли. Вы должны включить символ %c в первый аргумент, который указывает, где начинать применять стили. Любые допустимые стили CSS будут работать идеально.

> console.log(“%c Success! we got green message”, “color:green;font-weight:bold”);
> console.log("%cThe value is: %c20", "font-weight:bold", "font-weight:bold; color:green");