Найти в Дзене
Илья Дмитриев

JavaScript. Урок № 11 (работа с функциями для массивов)

Работа с функциями для массивов В данном уроке мы пройдем следующие функции и методы: Пожалуйста, напишите в комментариях хватило вам или не хватило в данном уроке информации. Все ли подробно изложено или есть какое-то непонимание. Метод reverse Метод reverseизменяет порядок элементов в массиве на обратный. Метод изменяет исходный массив (он станет перевернутым) и возвращает также перевернутый массив (можно пользоваться и так, и так). Синтаксис: Пример: Как видите массив стал перевернутым. Задача const str = '123456789'; Необходимо перевернуть строку через массив и вывести на экран. Решить обычным методом. Далее Решение данного упражнения написать в цепочку. Метод push Метод push добавляет неограниченное количество элементов в конец массива. Элементы передаются параметром метода. Метод изменяет исходный массив. Возвращает новую длину массива. Синтаксис: Пример: В примере в исходный массив добавлено 2 новых элемента и выведено содержимое нового массива: Задача Дан массив var arr = [
Оглавление

Работа с функциями для массивов

В данном уроке мы пройдем следующие функции и методы:

  • —reverse,
  • —push,
  • —unshift,
  • —shift,
  • —pop,
  • —slice,
  • —splice,
  • —sort,
  • —Object.keys,
  • —reverse

Пожалуйста, напишите в комментариях хватило вам или не хватило в данном уроке информации. Все ли подробно изложено или есть какое-то непонимание.

Метод reverse

Метод reverseизменяет порядок элементов в массиве на обратный.

Метод изменяет исходный массив (он станет перевернутым) и возвращает также перевернутый массив (можно пользоваться и так, и так).

Синтаксис:

-2

Пример:

-3

Как видите массив стал перевернутым.

Задача

const str = '123456789';

Необходимо перевернуть строку через массив и вывести на экран. Решить обычным методом.

Далее Решение данного упражнения написать в цепочку.

Метод push

Метод push добавляет неограниченное количество элементов в конец массива. Элементы передаются параметром метода.

Метод изменяет исходный массив. Возвращает новую длину массива.

Синтаксис:

-4

Пример:

В примере в исходный массив добавлено 2 новых элемента и выведено содержимое нового массива:

-5
Задача

Дан массив var arr = []. Необходимо заполнить массив числами от 1 до 25 с помощью цикла for и метода push

Метод unshift

Метод unshift добавляет любое количество новых элементов в начало массива.

Метод изменяет исходный массив.

Отличается от метода push тем что добавляет новые элементы в начало массива а не в конец.

Синтаксис:

-6

Пример:

—В примере добавляется два новых элемента в начало массива.

-7

Метод shift

Метод shiftудаляет первый элемент массива.

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

Синтаксис:

-8

Примеры:

-9

Метод pop

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

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

Синтаксис:

-10

Пример:

В данном примере из массива arr удален последний элемент.

-11
Задача

Удалить и вывести последний элемент исходного массива:

const arr = ['a', 'b', 'c', 'd', 'e'];

Метод slice

—Метод slice возвращает указанную часть массива.

—Первым параметром указывается номер элемента массива, с которого начинается вырезание, а вторым параметром - номер элемента, на котором закончится вырезание (при этом элемент с этим номером не включится в вырезанную часть).

—Второй параметр не является обязательным. Если его не указать - подмассив возьмется с указанного в первом параметре элемента до конца массива.

—Второй параметр также может принимать отрицательные значения. В этом случае отсчет элемента, на котором закончится обрезание, начинается с конца массива. Причем, последний элемент имеет номер "-1", предпоследний - "-2" и так далее.

—К примеру, если написать slice(1, -1), то вырезанная часть возьмется с первого элемента включительно по последний не включая его. Если вам нужно включить и последний элемент - нужно просто не задавать второй параметр для slice, вот так: slice(1).

—Метод не изменяет исходный массив.

—Напоминаю, что в массиве нумерация элементов начинается с нуля.

Синтаксис:

-12

Пример:

Вырежем из массива элементы с нулевого по второй не включительно (второй не вырежется):

-13

Задачи

1. Вырезать с первого элемента до конца массива. Для этого второй параметр не задаем:

const arr = ['a', 'b', 'c', 'd', 'e'];

2. Вырезать элементы со второго по предпоследний (-1 указывает на последний элемент и он не включится в извлеченную часть):

const arr = ['a', 'b', 'c', 'd', 'e'];

Метод splice

—Метод splice удаляет или добавляет элементы в массив. Можно только удалять элементы, только добавлять или делать и то и другое одновременно. Метод очень универсальный и сложный для понимания.

—Метод изменяет сам массив, и возвращает при этом массив удаленных элементов.

—Первым параметром идет номер элемента массива, который нужно удалить.

—Вторым параметром - сколько элементов массива следует удалить. Если его поставить в 0 - то элементы удалены не будут (только добавлены новые).

—Дальше через запятую идут элементы, которые нужно добавить в массив (являются необязательными параметрами). Эти элементы добавятся вместо удаленных элементов массива.

—Если удаления не было (когда второй параметр 0) - элементы вставятся в массив начиная с той позиции, которая указана первым параметром метода.

—Первый параметр может иметь отрицательное значение. В этом случае отсчет позиции начнется не с начала массива, а с конца. Причем, последний элемент имеет номер '-1', предпоследний - '-2' и так далее.

—Метод возвращает массив удаленных элементов.

Синтаксис:

-14

Пример:

В данном примере из массива будут удалены элементы со второго по 3 (это 'c', 'd' и 'e'):

-15
Задача

Удалить из массива предпоследний элемент «е»

const arr = ['a', 'b', 'c', 'd', 'e', 'f'];

Метод sort

—Метод sort производит сортировку массива в лексикографическом порядке.

—Также можно указать параметром собственную функцию для сортировки, но это необязательно

Лексикографический порядок — отношение линейного порядка на множестве слов длины n над некоторым упорядоченным алфавитом ∑. Своё название лексикографический порядок получил по аналогии с сортировкой по алфавиту в словаре.

"abc" == "abc" //true

"123" == "123" //true

"123" < "124" //true

"0999999" < "123" //true

"123" < "3" //true

"12" < "123" //true

"123" < "1234" //true

Синтаксис:

-16

Пример:

В данном примере в массиве была произведена сортировка по алфавиту и выведен отсортированный массив.

-17

Еще пример с цифрами. В данном примере произведена сортировка в соответствии с лексикографическим порядком:

-18
Задача

Дан массив [3, 4, 1, 2, 7]. Отсортируйте его.

Метод Object.keys

Метод Object.keys позволяет ключи объекта в виде массива.

Синтаксис:

-19

Пример:

Давайте получим ключи объекта в виде массива.

-20
Задача

Дан объект { js:'test', jq: 'hello', css: 'world' }. Получите массив его ключей.

Метод concat

Метод concat сливает указанные массивы вместе.

Метод применяется как метод к первому массиву, а в параметрах метода передаютсяостальные массивы для слияния.

При этом метод не изменяет исходный массив, а возвращает новый.

Синтаксис:

-21

Пример:

1. В данном примере 3 массива с помощью метода concat сольются в один.

-22

2. Можно передавать не только массивы, но и конкретные значение:

-23