Обязательные к знанию методы работы с массивами в JavaScript

Добро пожаловать, кодеры, к моей второй части трюков, которых мы не заметили в Javascript. В части первая я рассказал о хитростях, которые мы не замечаем в JavaScript. В этой истории мы увидим важные методы Array в Javascript.

Ну давай же!!! Давайте познакомимся с некоторыми интересными методами Array, которые поддерживает JavaScript.

Откройте Visual Studio Code и давайте изучим методы Array.

1. Фильтр

Метод filter() создает массив, заполненный всеми элементами массива, прошедшими проверку, при этом не изменяет исходный массив,

Например, вот пример массива игроков в крикет с их лучшими результатами, если нам нужно отфильтровать лучших игроков, у которых более 180, можно сделать следующим образом.

const players = [
{name : ‘Ricky Ponting’, Best: 160},
{name : ‘Mathew Hayden’, Best: 180},
{name : ‘Adam Gilchrist’, Best: 183},
{name : ‘Saurav Ganguly’, Best: 183},
{name : ‘MS Dhoni’, Best: 183},
{name : ‘Virat Kohli’, Best: 183},
{name : ‘Sachin Tendulkar’, Best: 200},
{name : ‘Yuvaraj Singh’, Best: 150},
{name : ‘Rohit Sharma’, Best: 264},]
console.log(players)

консоль для приведенного выше фрагмента будет

[
{name : ‘Ricky Ponting’, Best: 160},
{name : ‘Mathew Hayden’, Best: 180},
{name : ‘Adam Gilchrist’, Best: 183},
{name : ‘Saurav Ganguly’, Best: 183},
{name : ‘MS Dhoni’, Best: 183},
{name : ‘Virat Kohli’, Best: 183},
{name : ‘Sachin Tendulkar’, Best: 200},
{name : ‘Yuvaraj Singh’, Best: 150},
{name : ‘Rohit Sharma’, Best: 264},]

Чтобы отфильтровать массив в соответствии с условием, выполните следующие действия.

const filter = players.filter((player) => {
return player.Best > 180;
});
console.log(filter);

следующий вывод регистрируется в консоли

[ { name: ‘Adam Gilchrist’, Best: 183 },
 { name: ‘Saurav Ganguly’, Best: 183 },
 { name: ‘MS Dhoni’, Best: 183 },
 { name: ‘Virat Kohli’, Best: 183 },
 { name: ‘Sachin Tendulkar’, Best: 200 },
 { name: ‘Rohit Sharma’, Best: 264 } ]

мы можем заметить, что исходный массив не изменился

2. Карта

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

Мы можем взять тот же массив, например, чтобы получить имена игроков в массиве,

const map = players.map((playerName) => {
return playerName.name;
});
console.log(map)

он возвращает следующее

[ 'Ricky Ponting',
  'Mathew Hayden',
  'Adam Gilchrist',
  'Saurav Ganguly',
  'MS Dhoni',
  'Virat Kohli',
  'Sachin Tendulkar',
  'Yuvaraj Singh',
  'Rohit Sharma' ]

мы можем получить значение с помощью ключа в элементах массива

3. найти

Метод find() возвращает значение первого элемента массива, прошедшего проверку (предоставляется как функция).

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

  • Если он находит элемент массива, где функция возвращает значение true, find() возвращает значение этого элемента массива (и не проверяет остальные значения).
  • В противном случае он возвращает undefined

Примечание. find() не выполняет функцию для пустых массивов.

Примечание. find() не изменяет исходный массив.

Например,

возьмем предыдущий пример, в котором массив элементов, содержащий лучшие результаты каждого игрока из разных стран

const score = players.find((value)=>{return value.Best === 183 })

он возвращает первый элемент в массиве, как показано ниже,

{name : ‘Adam Gilchrist’, Best: 183}

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

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

players.forEach((value) => {
//your logic goes here
})

Значение возвращается на основе логики, которую вы написали внутри метода forEach.

Спасибо, наслаждайтесь сценарием!!!!