01:04
Урок 7: Массивы

Курс по программированию на JavaScript

Урок 7: Массивы

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

Создание массивов

Массивы в JavaScript можно создавать несколькими способами. Наиболее распространенные методы включают использование литералов массива и конструктора Array.

// Создание массива с использованием литерала массива
let fruits = ['apple', 'banana', 'cherry'];
console.log(fruits); // ['apple', 'banana', 'cherry']

// Создание массива с использованием конструктора Array
let numbers = new Array(1, 2, 3, 4, 5);
console.log(numbers); // [1, 2, 3, 4, 5]

Литералы массива заключают элементы массива в квадратные скобки [], разделенные запятыми. Конструктор Array используется для создания массива с указанными элементами.

Манипуляции с массивами

После создания массива его элементы можно изменять, добавлять новые или удалять существующие.

// Доступ к элементам массива
let fruits = ['apple', 'banana', 'cherry'];
console.log(fruits[0]); // 'apple'
console.log(fruits[2]); // 'cherry'

// Изменение элементов массива
fruits[1] = 'blueberry';
console.log(fruits); // ['apple', 'blueberry', 'cherry']

// Добавление новых элементов
fruits.push('date');
console.log(fruits); // ['apple', 'blueberry', 'cherry', 'date']

// Удаление элементов
fruits.pop();
console.log(fruits); // ['apple', 'blueberry', 'cherry']

Методы push и pop используются для добавления и удаления элементов в конце массива соответственно. Для добавления и удаления элементов в начале массива используются методы unshift и shift.

Основные методы массивов

В JavaScript существует множество методов для работы с массивами. Рассмотрим некоторые из наиболее часто используемых методов.

forEach

Метод forEach выполняет указанную функцию один раз для каждого элемента массива.

// Пример использования forEach
let fruits = ['apple', 'banana', 'cherry'];
fruits.forEach(function(fruit, index) {
 console.log(index + ': ' + fruit);
});
// 0: apple
// 1: banana
// 2: cherry

map

Метод map создает новый массив с результатами вызова указанной функции для каждого элемента массива.

// Пример использования map
let numbers = [1, 2, 3, 4, 5];
let squares = numbers.map(function(num) {
 return num * num;
});
console.log(squares); // [1, 4, 9, 16, 25]

filter

Метод filter создает новый массив со всеми элементами, прошедшими проверку, задаваемую в передаваемой функции.

// Пример использования filter
let numbers = [1, 2, 3, 4, 5];
let evenNumbers = numbers.filter(function(num) {
 return num % 2 === 0;
});
console.log(evenNumbers); // [2, 4]

reduce

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

// Пример использования reduce
let numbers = [1, 2, 3, 4, 5];
let sum = numbers.reduce(function(accumulator, currentValue) {
 return accumulator + currentValue;
}, 0);
console.log(sum); // 15

Результат выполнения

['apple', 'banana', 'cherry']
[1, 2, 3, 4, 5]
'apple'
'cherry'
['apple', 'blueberry', 'cherry']
['apple', 'blueberry', 'cherry', 'date']
['apple', 'blueberry', 'cherry']
0: apple
1: banana
2: cherry
[1, 4, 9, 16, 25]
[2, 4]
15

Упражнения

Упражнение 1: Обход массива

Создайте массив colors с элементами 'red', 'green', 'blue'. Используйте метод forEach для вывода каждого цвета и его индекса в консоль.

Решение:

// Объявление массива
let colors = ['red', 'green', 'blue'];

// Использование метода forEach
colors.forEach(function(color, index) {
 console.log(index + ': ' + color);
});
// 0: red
// 1: green
// 2: blue

Объяснение: Мы объявили массив colors с тремя элементами и использовали метод forEach для вывода каждого цвета и его индекса в консоль.

Упражнение 2: Фильтрация массива

Создайте массив чисел и используйте метод filter для создания нового массива, содержащего только четные числа. Выведите новый массив в консоль.

Решение:

// Объявление массива чисел
let numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

// Фильтрация четных чисел
let evenNumbers = numbers.filter(function(num) {
 return num % 2 === 0;
});

console.log(evenNumbers); // [2, 4, 6, 8, 10]

Объяснение: Мы объявили массив numbers и использовали метод filter для создания нового массива evenNumbers, содержащего только четные числа. Затем вывели новый массив в консоль.

Категория: JavaScript | Просмотров: 12 | Добавил: Admin | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email *:
Код *: