Основные методы работы с массивами в JavaScript стали проще!

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

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

1. фильтр()

Метод filter() — один из самых важных методов, который вам нужно знать как разработчику. Это встроенная функция в JavaScript, которая позволяет вам фильтровать массив, предоставляя условие. Он выполняется для каждого элемента массива и возвращает новый массив.

Вот пример:

const numbers = [5, 9, 12, 3, 17, 4, 1, 18, 6]

const tenPlus = numbers.filter((num) => {
 return num > 10;
});

console.log(tenPlus); // Output: [12, 17, 18]

В этом примере у нас есть массив случайных чисел. Мы используем метод filter() для создания нового массива с именем tenPlus, состоящего только из чисел больше 10.

2. карта ()

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

Вот пример использования метода map():

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

const decupleNumbers = numbers.map((num) => {
 return num * 10;
})

console.log(decupleNumbers); // Output: [10, 20, 30, 40, 50]

В этом примере у нас есть массив чисел. Мы используем метод map() для создания нового массива с именем decupleNumbers, который содержит каждое число из исходного массива, умноженное на 10. Функция обратного вызова берет каждое число из исходного массива, умножает его на 10, возвращает результат и сохраняет его. в новом массиве.

Эксклюзивно для читателей моего блога!

Ищете свежие и интересные советы и рекомендации по веб-разработке? Не смотрите дальше! Подпишитесь на мой еженедельный информационный бюллетень и получайте последние тенденции, бесплатные инструменты и ресурсы, а также эксклюзивный контент прямо на ваш почтовый ящик. Присоединяйтесь к нашему сообществу опытных веб-разработчиков, которые идут впереди игры. Не пропустите — зарегистрируйтесь прямо сейчас!



Повысьте свои навыки веб-разработки с помощью нашего еженедельного информационного бюллетеня — присоединяйтесь сейчас!

3. найти()

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

Метод find() — это встроенная функция JavaScript, которая позволяет найти первый элемент в массиве, удовлетворяющий заданному условию. В качестве аргумента он принимает функцию обратного вызова, которая выполняется для каждого элемента массива до тех пор, пока не будет найден элемент, удовлетворяющий условию.

Вот простой пример того, как работает метод find():

const numbers = [5, 3, 2, 7, 4, 8]

const evenNumber = number.find((num) => {
 return num % 2 === 0;
})

console.log(evenNumber); // Output: 2

В этом примере у нас есть массив смешанных чисел, который включает как четные, так и нечетные числа. Мы используем метод find(), чтобы найти первое четное число в массиве. Функция обратного вызова принимает каждое число в массиве в качестве аргумента, проверяет, является ли оно четным, проверяя, равен ли остаток от деления на 2 0, и возвращает true, если оно четное.

Обратите внимание, что метод find() не возвращает результат в виде массива.

4. для каждого()

forEach() немного отличается от предыдущих методов, которые мы обнаружили. Возможно, вы также использовали или слышали об этом методе раньше и использовали его в циклах. Так же, как циклы for, метод forEach() также перебирает элементы массива и выполняет действие над каждым элементом. В качестве аргумента требуется функция обратного вызова, которая выполняется один раз для каждого элемента массива.

Вот пошаговое руководство по использованию этого метода:

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

numbers.forEach((num) => {
 console.log(num); // Output: 1, 2, 3, 4, 5
})

Этот метод ничего не возвращает; он просто перебирает элементы массива и выполняет функцию обратного вызова для каждого элемента. Этот метод может стать отличной заменой времени и места, которые занимают циклы.

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

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

Это было завершение. Надеюсь, оно вам понравилось и вы что-то извлекли из него. Не забудьте поделиться им с другими, кто любит раскрывать свои навыки программирования. 💛

Не забудьте подписаться на мою рассылку (эксклюзивную рассылку только для читателей моего блога): 👇



— Вы также можете следить за мной в Twitter, где я буду делиться короткими и невероятными вещами, так что не пропустите их. 🚀

Купи мне кофе