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)
})

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

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

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

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

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

JavaScript: сила замыканий
JavaScript: сила замыканий

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

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

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

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

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

Добавляем Видео в качестве фона страницы сайта
Добавляем Видео в качестве фона страницы сайта
Тема уже не новая, но хочется еще раз ее затронуть, т.к. она набирает обороты. Хотя и очень медленно. Возможно, проблема создания таких сайтов в связана с созданием или поиском подходящего видео. Лично мне такие сайты вполне симпатичны, привлекают внимание, а главное, задерживают посетителя на сайте, тем самым улучшая поведенческие факторы...
Как создать сайт?
Как создать сайт?

Многие начинающие пользователи интернета задают себе данную фразу. Но не у всех выходит добиться желаемого... Всё связано с различными стереотипами, например, о том, что для создания сайта или личной странички в интернете требуются навыки и знание программирования... Прочитайте статью и создайте свой сайт.

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