15 удивительных трюков, которые вы можете сделать с помощью простого JavaScript
Давайте рассмотрим некоторые из удивительных трюков, которые вы могли бы сделать с помощью ванильного JavaScript.
В этом посте дана справочная информация по некоторым методам и операторам языка Javascript. Информация будет полезна тем, кто изучает Javascript и в качестве напоминания уже более опытным программистам.
console.log(!! 0) // output: false
console.log(!! 1) // output: true
console.log(Boolean(1)) // output: true
console.log(Boo
Преобразование строки в число:
const string = '101'
console.log(+string) // output: 101
console.log(Number(string)) // output: 101
Используйте обратный метод для изменения порядка элементов массива. Обратите внимание, что обратный метод изменяет исходный массив.
const numbers = ['1', '2', '3']
console.log(numbers.reverse()) // output: [ "3", "2", "1" ]
Найдите минимальные или максимальные значения из массива с помощью функции 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
Используйте оператор spread для объединения массивов:
const fruits = ['яблоки', "бананы']
const vegetables = ['картофель', 'морковь']
const food = [...fruits, ...vegetables]
console.log(food) // output: [ "яблоки", "бананы" , "картофель", "морковь" ]
В языке javascript есть девять ложных значений.
undefined , null , NaN , 0 , 0n (BigInt 0), -0 ""(empty string),false,document.all
Тернарный оператор позволяет писать оператор 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");
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 [ "яблоки", "мандарины" ]
Попробуйте использовать метод 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]
Чтобы проверить, содержит ли массив определенное значение или нет, используйте метод includes().
const hearts = ['красный', 'синий', 'белый']
console.log(hearts.includes('красный')) // output: true
console.log(hearts.includes('оранжевый')) // output: false
Фильтр массивов на основе условий Метода filter() принимает функцию в качестве аргумента и выполняет эту функцию для каждого элемента массива и возвращает новый массив:
const numbers = [1, 5, 6, 7, 4]
const filteredArray = numbers.filter(element => element > 4)
console.log(filteredArray) // output: [ 5, 6, 7 ]
const button = document.querySelector('button')
button.addEventListener('click', function () {
window.scrollTo(0,0)
})
На этом всё. Удачи вам!
Если у вас есть вопросы по статье или нужна помощь в создании сайта, пишите нам в чат на сайте или Вконтакте. Не забудьте оставить свой e-mail и мы ответим в самое ближайшее время.Другие статьи по теме:
Давайте рассмотрим некоторые из удивительных трюков, которые вы могли бы сделать с помощью ванильного JavaScript.
Сценарии JavaScript блокируют загрузку файлов, следующих за ними. Но имеется несколько приемов, предотвращающих это…
Регулярные выражения, вероятно, являются наиболее неправильно понимаемой особенностью большинства языков.
Многие разработчики пытаются понять их с помощью плохих руководств или старых книг, и когда они разочаровываются, они предпочитают игнорировать их до конца своей карьеры.
Как вы думаете, насколько хорошо вы знаете JavaScript? Вы, вероятно, знаете, как писать функции, понимать простые алгоритмы и даже можете написать класс. Но знаете ли вы, что такое типизированный массив?
Те из вас, кто верстает сайты, прекрасно знают, как удобно читать код, когда он свёрстан в удобочитаемом виде. Это упрощает и его понимание и визуальное выявление ошибок до запуска.
В этой статье мы рассмотрим операторы в JavaScript один за другим. Мы объясним их функции и продемонстрируем их использование, помогая вам понять их роль в построении более сложных выражений.