Методы массивов

Методы массивов

Здравствуйте! В этом уроке продолжим изучение массивов, начатое в уроке по массивам и рассмотрим методы массивов. Некоторые из этих методов мы сами того не подозревая рассмотрели в прошлом уроке. Это такие методы как push, shift, unshift, pop и другие. А сегодня продолжим ведь у массивов есть еще очень много интересных методов. Итак пожалуй начнем.

Методы массивов

 

Метод split.

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

 var name = 'Маша, Нина, Ирина, Василий';
var mas = name.split(', ');//преобразуем строку в массив по разделителю ","
for (var i = 0; i < mas.length; i++) {
  document.write( 'Вам сообщение ' + mas[i] );

Просмотреть  пример

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

У метода split есть необязательный второй аргумент если он указан, то он ограничивает количество элементов в массиве и если его указать, то остаток массива будет отброшен.

  alert( "1,2,3,4".split(',', 2) ); // 1,2

Разбивка на буквы.

Еще одной интересно особенностью метода split является то, что если в качестве разделителя указать пустую строку то данный метод разобьет строку на буквы

 var str = "строка";
document.write(str.split('') ); // с,т,р,о,к,а

Метод join

Этот метод работает обратно методу split, то есть он массив преобразует в строку по разделителю, который надо указывать в самом методе.

 var mas = ['Миша', 'Петр', 'Мария', 'Вася'];
 var names  = mas.join(';');
document.write( names ); // Миша;Петр;Мария;Вася

Просмотреть  пример

Удаление элемента из массива метод delete.

Для удаления элемента из массива используется метод delete. Он удаляет и индекс элемента и сам элемент, при этом в массиве образуется дырка:

var mas = ["Мы", "едем", "отдыхать"];
delete mas[1]; // элемент с индексом 1 удален
// теперь mas = ["Мы", undefined, "отдыхать"];
document.write( mas[1] ); // undefined

Как видно delete удаляет пару индекс-элемент, при этом элементы не сдвигаются и длина массива не изменяется. Отсюда можно сделать вывод, что для корректного удаления элементов массива лучше использовать методы pop, unshift, рассмотренные нами ранее.

Читайте также  Приведение типов javascript.

Метод splice

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

Удаление элемента из массива.

var mas = ["Мы", "учим", "JavaScript"];
mas.splice(1, 1); // начиная с позиции 1, удалить 1 элемент
document.write( mas ); //  результат ["Мы", "JavaScript"]

Просмотреть  пример

Замена элементов на другие:

 var mas = ["груша", "банан", "апельсин", "мандарин"];
// удаляем 3 первых элемента и добавляем другие вместо них
mas.splice(0, 3, "авокадо", "арбуз", "дыня")
document.write( mas ) // теперь ["авокадо", "арбуз", "дыня", "мандарин"]

Просмотреть  пример

Вставка элементов без удаления.

 var mas = ["Мы", "изучаем", "JavaScript"];
// с позиции 2
// удалить 0
// вставить "язык", "программрования"
mas.splice(2, 0, "язык", "программрования");
document.write( mas ); // "Мы", "изучаем", "язык", "программирования", "JavaScript"

Просмотреть  пример

Метод slice

Метод slice копирует участок массива mas(start, end) начиная с позиции start, и до позиции end не включая ее причем сам исходный массив не изменяется. И опять будем разбираться на примерах.

var mas = ["Зачем", "нужно", "учить", "JavaScript"];
var mas2 = mas.slice(1, 3); // элементы 1, 2 (а вот 3 не будет включен)
document.write( mas2 ); // нужно, учить

Просмотреть  пример

Причем возможны варианты:

Если не указать второй аргумент копируется массив до конца.

var mas = ["Зачем", "нужно", "учить", "JavaScript"];
alert( mas.slice(1) ); // взять все элементы, начиная с номера 1

Можно указывать отрицательные индексы, тогда отсчет будет вестись с конца массива.

 var mas2 = mas.slice(-2); // копировать от 2-го элемента с конца и дальше

А вот если вообще не указать аргументов, то копируется весь массив.

 var polnaya_copia = mas.slice();

Сортировка массивов. Метод sort(fn)

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

var mas = [ 1, 2, 17 ];
mas.sort();
document.write( mas );  // 1, 17, 2

Просмотреть  пример

Читайте также  Локальные и глобальные переменные

Как видно из примера результат сортировки  немного не тот как мы ожидали, а все оттого что данный метод приводит числа к строкам и потом их уже сортирует. Этот момент следует учитывать.

Своя  сортировка

Для использования своей сортировки в методе sort в него надо передать функцию, которая будет сортировать элементы массива. Вот пример:

 function sortNumeric(num1, num2) {
  if (num1 > num2) return 1;
  if (num1 < num2) return -1;
}
var mas = [ 1, 2, 17 ];
mas.sort(sortNumeric);
document.write(mas);  // 1, 2, 17

Просмотреть  пример

Хочу обратить ваше внимание на одну деталь свою функцию  сортировки надо передавать в метод sort без круглых скобок, иначе будет ошибка.  Как нетрудно заметить из примера, передаваемая функция в метод sort имеет 2 аргумента и возвращает:

положительное значение, если num1>num2 и отрицательное значение если наоборот, а если числа равны то возвращается 0 и тут уже сортировка идет как надо, то есть сортируются именно числа, а не строки.

Метод reverse

Данный метод позволяет перевернуть массив  с конца наперед, при этом последний элемент будет первым, а первый последним.

var mas = [4, 5, 6];
mas.reverse();
document.write( mas ); // 6,5,4

Просмотреть  пример

Метод concat

Метод concat копирует исходный массив с массивом или элементами, которые передаются методу concat. Вот пример:

var mas = [3, 4];
var newMas = mas.concat(5, 6);
document.write( newMas ); // 3,4,5,6

Просмотреть  пример

Методы поиска элемента в массиве indexOf/lastIndexOf

Данные методы ищут в массиве указанный элемент если находят возвращают индекс этого элемента, а если нет то -1. Отличаются они только тем, что indexOf возвращает первую позицию, а lastIndexOf последнюю. Вот пример:

var mas =["Vasya", "petya", "Gerasim"];
if(mas.indexOf("Vasya") == -1){
  document.write("Элемента  нет в массиве");
}
else {
 document.write("Элемент есть в массиве");
}

Просмотреть  пример

Читайте также  Циклы while, for в JavaScript

Итоги:

 

Методы массивов:

  • push/pop, shift/unshift, splice – служат для добавления/удаления элементов массива.
  • join/split – для преобразования строки в массив и массив в строку соответственно.
  • slice –  используется для копирования части массива.
  • sort –  сортирует массив, если не передать свою функцию, то элементы будут отсортированы как строки.
  • reverse –  переворачивает массив вверх ногами.
  • concat –  склеивает или объединяет, как массивы так и отдельные элементы.
  • indexOf/lastIndexOf –  ищет и находит индекс массива, если не находит, то возвращает -1. Используется для проверки присутствует ли элемент в массиве.

Задания

Отсортируйте массив в обратном порядке.

var mas = [5, 2, 1, -10, 8];

Найти уникальные элементы в массиве.

var mas = [«дришна», «дришна», «маре», «маре», «харе», «харе», «кришна», «кришна», «10-()» ];

Должно получиться alert( (strings) ); //дришна, кришна, харе, 10-()

Замена элементов в массиве

Пусть дан массив с числами от 1 до 100 ваша задача состоит в следующем: надо пройтись по массиву и заменить число, если оно делится на 3 без остатка на слово «тузик», а если делится на 5 без остатка на «бобик».

Ну и в заключение смотрите видео по методам массивов в JavaScript.

 

Если вы нашли ошибку, пожалуйста, выделите фрагмент текста и нажмите Ctrl+Enter.

Плюсануть
Поделиться

Об авторе

admin administrator

Сообщить об опечатке

Текст, который будет отправлен нашим редакторам: