Введение

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

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

  1. Массив.прототип.карта()

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

Вот примеры метода .map():

// Example 1: Doubling the values in an array
const numbers = [1, 2, 3, 4, 5];

const doubledNumbers = numbers.map((num) => {
  return num * 2;
});

console.log(doubledNumbers);
// Output: [2, 4, 6, 8, 10]


// Example 2: Extracting names from an array of objects
const students = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' },
];

const studentNames = students.map((student) => {
  return student.name;
});

console.log(studentNames);
// Output: ['Alice', 'Bob', 'Charlie']

2. Массив.прототип.фильтр()

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

Вот примеры метода .filter():

// Example 1: Filtering even numbers from an array
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

const evenNumbers = numbers.filter((num) => {
  return num % 2 === 0;
});

const numbersGreaterThanFive= numbers.filter((num) => {
  return num > 5;
});

console.log(evenNumbers,numbersGreaterThanFive);
// Output: [ 2, 4, 6, 8, 10 ] [ 6, 7, 8, 9, 10 ]

// Example 2: Filtering students based on their grades
const students = [
  { id: 1, name: 'Alice', grade: 'A' },
  { id: 2, name: 'Bob', grade: 'B' },
  { id: 3, name: 'Charlie', grade: 'C' },
  { id: 4, name: 'David', grade: 'A' },
];

const highAchievers = students.filter((student) => {
  return student.grade === 'A';
});

console.log(highAchievers);
// Output: [{ id: 1, name: 'Alice', grade: 'A' }, { id: 4, name: 'David', grade: 'A' }]

3. Массив.прототип.сортировка()

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

Вот пример, демонстрирующий использование метода .sort():

// Example: Sorting an array of objects based on a property
const students = [
  { id: 1, name: 'Alice', grade: 'B' },
  { id: 2, name: 'Bob', grade: 'A' },
  { id: 3, name: 'Charlie', grade: 'C' },
];

students.sort((a, b) => {
  return a.grade.localeCompare(b.grade);
});

console.log(students);
/*
Output:
[
  { id: 2, name: 'Bob', grade: 'A' },
  { id: 1, name: 'Alice', grade: 'B' },
  { id: 3, name: 'Charlie', grade: 'C' }
]
*/

В этом примере у нас есть массив объектов students, представляющих учащихся со свойствами id, name и grade. Мы используем метод .sort() и передаем функцию сравнения (a, b) => { return a.grade.localeCompare(b.grade) } в качестве аргумента. Функция сравнения сравнивает свойство grade двух объектов, используя метод localeCompare(). Это гарантирует, что массив студентов отсортирован в порядке возрастания на основе их оценок.

Метод .sort() очень универсален и может использоваться для сортировки массивов данных различных типов или сложных объектов. Предоставляя пользовательскую функцию сортировки, вы можете определить свою собственную логику сортировки в соответствии с вашими конкретными требованиями.

4. Массив.прототип.shift():

Метод shift() удаляет первый элемент из массива и возвращает этот элемент. Он изменяет исходный массив, сдвигая все последующие элементы к более низкому индексу.

Вот пример метода .shift():

let fruits = ['apple', 'banana', 'orange'];
let removedFruit = fruits.shift();
console.log(removedFruit); // Output: 'apple'
console.log(fruits); // Output: ['banana', 'orange']

5. Массив.прототип.unshift():

Метод unshift() добавляет один или несколько элементов в начало массива. Он изменяет исходный массив и возвращает новую длину массива.

Вот пример метода .unshift():

let fruits = ['apple', 'banana', 'orange'];
fruits.unshift('grape');
console.log(fruits); // Output: ['grape', 'apple', 'banana', 'orange']

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