JavaScript: Рекомендации и советы

JavaScript: Рекомендации и советы

В этом посте дана справочная информация по некоторым методам и операторам языка Javascript. Информация будет полезна тем, кто изучает Javascript и в качестве напоминания уже более опытным программистам.

1. Оператор !! (двойной восклицательный знак)

Чтобы проверить, является ли значение истинным или !! ложным, вы можете вызвать оператор двойной восклицательный знак:
console.log(!! 0)             // output: false
console.log(!! 1)            // output: true

console.log(Boolean(1))     // output: true
console.log(Boo

2. Конвертировать string → number (строку в число)

Преобразование строки в число:

const string = '101'

console.log(+string)          // output: 101
console.log(Number(string))   // output: 101

3. Обратный метод (reverse method)

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

const numbers = ['1', '2', '3']

console.log(numbers.reverse())   // output: [ "3", "2", "1" ]

4. Математические операции Math.min() и Math.max()

Найдите минимальные или максимальные значения из массива с помощью функции Math.min и Math.max:

const numbers = [1, 2 ,3, 4, 5]

console.log(Math.min(...numbers)) // output: 1
console.log(Math.max(...numbers)) // output: 5

5. Объединить массивы

Используйте оператор spread для объединения массивов:

const fruits = ['яблоки', "бананы']
const vegetables = ['картофель', 'морковь']
const food = [...fruits, ...vegetables]
console.log(food) // output: [ "яблоки", "бананы" , "картофель", "морковь" ]

6. Ложные значения

В языке javascript есть девять ложных значений.

undefined , null , NaN , 0 , 0n (BigInt 0), -0 ""(empty string),false,document.all

7. Тернарный оператор

Тернарный оператор позволяет писать оператор if...else более компактно.

let number = 1

if (number == 1) {
console.log('number is one')
} else {
console.log('number is not one')
}

// Syntax: condition ? exprIfTrue : exprIfFalse (MDN)
console.log(number === 1 ? "number is one" : "number is not one");

8. Удалить дубликаты из массива

const fruits = ['яблоки', 'мандарины', 'яблоки', 'мандарины']

// Method 1:
const filteredFruits = Array.from(new Set(fruits))
console.log(filteredFruits) // output: Array [ "яблоки", "мандарины" ]

// Method 2:
const filteredFruits = [...new Set(fruits)]
console.log(filteredFruits) // output: Array [ "яблоки", "мандарины" ]

9. Метод Map()

Попробуйте использовать метод map(), если вы хотите манипулировать элементами массива. Метод map() выполняет данную функцию для каждого элемента массива и возвращает новый массив на основе исходного массива:

const numbers = [1, 2, 3, 4, 5]
const mapedNumbers = numbers.map(element => element + 1)
console.log(mapedNumbers) // output: [2, 3, 4, 5, 6]

10. Метод includes()

Чтобы проверить, содержит ли массив определенное значение или нет, используйте метод includes().

const hearts = ['красный', 'синий', 'белый']
console.log(hearts.includes('красный')) // output: true
console.log(hearts.includes('оранжевый')) // output: false

11. Метод filter() 

Фильтр массивов на основе условий Метода filter() принимает функцию в качестве аргумента и выполняет эту функцию для каждого элемента массива и возвращает новый массив:

const numbers = [1, 5, 6, 7, 4]
const filteredArray = numbers.filter(element => element > 4)
console.log(filteredArray) // output: [ 5, 6, 7 ]

12. Кнопка "Прокрутите вверх"

const button = document.querySelector('button')

button.addEventListener('click', function () {
window.scrollTo(0,0)
})

На этом всё. Удачи вам!

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

Другие статьи по теме:

15 удивительных трюков, которые вы можете сделать с помощью простого JavaScript
15 удивительных трюков, которые вы можете сделать с помощью простого JavaScript

Давайте рассмотрим некоторые из удивительных трюков, которые вы могли бы сделать с помощью ванильного JavaScript.

Как устанавливать, получать и обновлять файлы cookie с помощью JavaScript
Как устанавливать, получать и обновлять файлы cookie с помощью JavaScript

Файлы cookie — это небольшие фрагменты данных, хранящиеся в браузере клиента и часто используемые для управления сеансами, пользовательских предпочтений и отслеживания.

33 Концепции JavaScript, которые должен знать каждый разработчик
33 Концепции JavaScript, которые должен знать каждый разработчик

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

Для верстальщиков. Украшаем код JavaScript
Для верстальщиков. Украшаем код JavaScript

Те из вас, кто верстает сайты, прекрасно знают, как удобно читать код, когда он свёрстан в удобочитаемом виде. Это упрощает и его понимание и визуальное выявление ошибок до запуска.

Динамические элементы JavaScript для безостановочной загрузки сценариев
Динамические элементы JavaScript для безостановочной загрузки сценариев

Сценарии JavaScript блокируют загрузку файлов, следующих за ними. Но имеется несколько приемов, предотвращающих это…

Демистифицирующие операторы JavaScript: что означает этот символ?
Демистифицирующие операторы JavaScript: что означает этот символ?

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

Мы используем cookie-файлы, чтобы получить статистику, которая помогает нам обеспечивать вас лучшим контентом. Вы можете прочитать подробнее о cookie-файлах или изменить настройки браузера. Отключение cookie-файлов может привести к неполадкам в работе сайта. Продолжая пользоваться сайтом без изменения настроек, вы даете согласие на использование ваших cookie-файлов. Это совершенно безопасно!