Курс по JavaScript для начинающих: Модуль 5. Работа с массивами. Урок 2. Базовые методы

Введение

Массивы в JavaScript предоставляют множество встроенных методов для работы с элементами массива. Эти методы позволяют добавлять, удалять и находить элементы массива. В этом уроке мы рассмотрим основные методы работы с массивами, такие как push, pop, shift, unshift, indexOf и includes.

Метод push

Метод push добавляет один или несколько элементов в конец массива и возвращает новую длину массива.

Пример использования push:

let fruits = ["яблоко", "банан"];
fruits.push("вишня");
console.log(fruits); // ["яблоко", "банан", "вишня"]
console.log(fruits.length); // 3

Метод pop

Метод pop удаляет последний элемент из массива и возвращает этот элемент.

Пример использования pop:

let fruits = ["яблоко", "банан", "вишня"];
let lastFruit = fruits.pop();
console.log(fruits); // ["яблоко", "банан"]
console.log(lastFruit); // "вишня"

Метод shift

Метод shift удаляет первый элемент из массива и возвращает этот элемент. Остальные элементы смещаются на один индекс влево.

Пример использования shift:

let fruits = ["яблоко", "банан", "вишня"];
let firstFruit = fruits.shift();
console.log(fruits); // ["банан", "вишня"]
console.log(firstFruit); // "яблоко"

Метод unshift

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

Пример использования unshift:

let fruits = ["банан", "вишня"];
fruits.unshift("яблоко");
console.log(fruits); // ["яблоко", "банан", "вишня"]
console.log(fruits.length); // 3

Метод indexOf

Метод indexOf возвращает первый индекс, по которому данный элемент может быть найден в массиве, или -1, если элемент не найден.

Пример использования indexOf:

let fruits = ["яблоко", "банан", "вишня"];
let index = fruits.indexOf("банан");
console.log(index); // 1

let notFoundIndex = fruits.indexOf("манго");
console.log(notFoundIndex); // -1

Метод includes

Метод includes проверяет, содержит ли массив определенный элемент, и возвращает true или false.

Пример использования includes:

let fruits = ["яблоко", "банан", "вишня"];
let hasBanana = fruits.includes("банан");
console.log(hasBanana); // true

let hasMango = fruits.includes("манго");
console.log(hasMango); // false

Заключение

Методы работы с массивами, такие как push, pop, shift, unshift, indexOf и includes, предоставляют мощные инструменты для управления и манипулирования элементами массива. Понимание этих методов и умение их использовать эффективно поможет вам в создании более гибких и динамичных программ.

Контрольные вопросы

Какой метод добавляет один или несколько элементов в конец массива?

• pop
• push
• shift
• unshift

Какой метод удаляет последний элемент из массива и возвращает его?

• pop
• push
• shift
• unshift

Какой метод удаляет первый элемент из массива и возвращает его?

• pop
• push
• shift
• unshift

Какой метод добавляет один или несколько элементов в начало массива?

• pop
• push
• shift
• unshift

Какой метод возвращает первый индекс, по которому данный элемент может быть найден в массиве, или -1, если элемент не найден?

• includes
• find
• indexOf
• lastIndexOf

Какой метод проверяет, содержит ли массив определенный элемент, и возвращает true или false?

• includes
• indexOf
• find
• some

Упражнения

Упражнение 1: Добавление элементов в массив

Создайте массив из нескольких строковых элементов. Используйте метод push для добавления элементов в конец массива. Выведите результат.

let fruits = ["яблоко", "банан"];
fruits.push("вишня", "манго");
console.log(fruits); // ["яблоко", "банан", "вишня", "манго"]

Упражнение 2: Удаление последнего элемента из массива

Создайте массив из нескольких строковых элементов. Используйте метод pop для удаления последнего элемента из массива. Выведите результат.

let fruits = ["яблоко", "банан", "вишня"];
let lastFruit = fruits.pop();
console.log(fruits); // ["яблоко", "банан"]
console.log(lastFruit); // "вишня"

Упражнение 3: Удаление первого элемента из массива

Создайте массив из нескольких строковых элементов. Используйте метод shift для удаления первого элемента из массива. Выведите результат.

let fruits = ["яблоко", "банан", "вишня"];
let firstFruit = fruits.shift();
console.log(fruits); // ["банан", "вишня"]
console.log(firstFruit); // "яблоко"

Упражнение 4: Добавление элементов в начало массива

Создайте массив из нескольких строковых элементов. Используйте метод unshift для добавления элементов в начало массива. Выведите результат.

let fruits = ["банан", "вишня"];
fruits.unshift("яблоко", "манго");
console.log(fruits); // ["яблоко", "манго", "банан", "вишня"]

Упражнение 5: Нахождение индекса элемента в массиве

Создайте массив из нескольких строковых элементов. Используйте метод indexOf для нахождения индекса определенного элемента в массиве. Выведите результат.

let fruits = ["яблоко", "банан", "вишня"];
let index = fruits.indexOf("банан");
console.log(index); // 1

Упражнение 6: Проверка наличия элемента в массиве

Создайте массив из нескольких строковых элементов. Используйте метод includes для проверки наличия определенного элемента в массиве. Выведите результат.

let fruits = ["яблоко", "банан", "вишня"];
let hasBanana = fruits.includes("банан");
console.log(hasBanana); // true

let hasMango = fruits.includes("манго");
console.log(hasMango); // false

Упражнение 7: Комбинирование методов массива

Создайте массив из нескольких числовых элементов. Используйте методы push, pop, shift, и unshift для манипулирования массивом. Выведите результат.

let numbers = [10, 20, 30];
numbers.push(40); // Добавляем элемент в конец
let lastNumber = numbers.pop(); // Удаляем последний элемент
numbers.unshift(5); // Добавляем элемент в начало
let firstNumber = numbers.shift(); // Удаляем первый элемент
console.log(numbers); // [20, 30]
console.log(lastNumber); // 40
console.log(firstNumber); // 5

Упражнение 8: Проверка наличия нескольких элементов

Создайте массив из нескольких строковых элементов. Используйте метод includes для проверки наличия нескольких элементов в массиве. Выведите результат.

let fruits = ["яблоко", "банан", "вишня"];
let hasApple = fruits.includes("яблоко");
let hasCherry = fruits.includes("вишня");
let hasMango = fruits.includes("манго");
console.log(`Имеется яблоко: ${hasApple}, Имеется вишня: ${hasCherry}, Имеется манго: ${hasMango}`);
// Имеется яблоко: true, Имеется вишня: true, Имеется манго: false

Упражнение 9: Нахождение индекса отсутствующего элемента

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

let fruits = ["яблоко", "банан", "вишня"];
let index = fruits.indexOf("манго");
console.log(index); // -1

Упражнение 10: Длина массива после манипуляций

Создайте массив из нескольких строковых элементов. Используйте методы push, pop, shift, и unshift для манипулирования массивом. Выведите итоговую длину массива.

let fruits = ["яблоко", "банан"];
fruits.push("вишня");
fruits.pop();
fruits.unshift("манго");
fruits.shift();
console.log(fruits.length); // 2