Обязательные к знанию методы работы с массивами в 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.
Спасибо, наслаждайтесь сценарием!!!!