JavaScript: Массивы

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

Ниже будут перечислены некоторые методы и свойства массивов в javascript. Заранее договоримся что у нас объявлена переменная arr и для нее или у нее будем вызывать методы/свойства.

// объявим массив
var arr = ["Огурец", "Кабачок", "Тыква"];

arr.length — возвращает общее число элементов в массиве. Тут есть нюанс, данный параметр возвращает не совсем количество элементов, а последний индекс + 1. Например:

// length
var arr = [];
arr[1000] = true;
alert(arr.length); // 1001

arr.pop() — удаляет последний элемент в массиве и возвращает его индекс.

arr.push(«Помидор») — добавляет элемент в конец массива. Можно добавлять несколько элементов сразу:

// добавление элемента
var fruits = ["Яблоко"];
fruits.push("Апельсин", "Персик");

arr.shift() — удаляет первый элемент из массива и возвращает его(работает медленней чем arr.pop()).

arr.unshift(«Помидор») — добавляет элемент в начало массива(работает медленней чем arr.push()) и возвращает его индекс. Можно добавлять несколько элементов сразу:

// добавление элемента
var fruits = ["Яблоко"];
fruits.unshift("Ананас", "Лимон");

arr.split(‘разделитель’,  long) — делает из строки — массив. Строка разбивается по разделителю, который указывается первым параметром(‘разделитель’). Так же у функции есть второй не обязательный аргумент long, который задает длину нового массива.

arr.join(‘разделитель’) — делает из массива — строку, слов(элементы массива)а в которой будет разделены с помощью разделителя.

delete arr[i] — удаляем элемент массива(как в объекте, массив — это объект). Минус — образуется пробел, индексы не пересчитываются, поэтому лучше использовать метод splice.

arr.splice(index[, deleteCount, elem1, …, elemN]) — splice может удалять, добавлять и заменять элементы массива. Логика работы следующая: удалить deleteCount элементов, начиная с номера index, а затем вставить elem1, …, elemN на их место. Возвращает массив из удалённых элементов.

var arr = ["Я", "изучаю", "JavaScript"];

arr.splice(1, 1); // осталось ["Я", "JavaScript"]
arr.splice(0, 3, "Мы", "изучаем"); // теперь ["Мы", "изучаем", "JavaScript"]
var removed = arr.splice(0, 2); // "Я", "сейчас" <-- array of removed elements
arr.splice(2, 0, "сложный", "язык"); // "Я", "изучаю", "сложный", "язык", "JavaScript"

var arr = [1, 2, 5]
arr.splice(-1, 0, 3, 4); // результат: 1,2,3,4,5

arr.slice(begin, end) — данный метод копирует часть массива начиная с begin и заканчивая end(не включая последний элемент). Функция работает аналогичным образом как в строках. Если не указывать параметры — копируется весь массив.

arr.reverse() — меняет порядок элементов в массиве на обратный.

arr.concat(value1, value2, … valueN)  — создаёт новый массив, в который копируются элементы из arr, а также value1, value2, … valueN.

var arr = [1, 2];

var newArr = arr.concat([3, 4], 5); // то же самое, что arr.concat(3,4,5)
alert( newArr ); // 1,2,3,4,5

arr.indexOf(value) — возвращает индекс элемента массива, если его значение равно value(первое совпадение). Поиск осуществляется с 0(можно указать 2й параметр fromIndex и поиск будет осуществлен с указанной позиции) элемента. Если элемент не найден возвращается -1.

arr.lastIndexOf(value) — возвращает индекс элемента массива, если его значение равно value(первое совпадение). Поиск осуществляется с последнего(можно указать 2й параметр fromIndex и поиск будет осуществлен с указанной позиции) элемента. Если элемент не найден возвращается -1.

Метод Array.isArray()

Для проверки типа на массив есть специальный метод: Array.isArray(arr). Он возвращает true только если arr – массив:

// проверка на массив

alert( Array.isArray([1,2,3]) ); // true
alert( Array.isArray("not array")); // false

Сортировка

arr.sort() — сортирует массив, по умолчанию все значения массива приравниваются к строкам и сортируются. Функция позволяет использовать свой порядок сортировки.

// стандартная сортировка
var arr = [ 1, 2, 15 ];
arr.sort();
alert( arr );  // 1, 15, 2

// своя сортировка
function compareNumeric(a, b) {
  if (a > b) return 1;
  if (a < b) return -1;
}

var arr = [ 1, 2, 15 ];
arr.sort(compareNumeric);
alert(arr);  // 1, 2, 15

Своя функция сортировки должна возвращать положительное число/отрицательное число/ноль.

arr.filter(callback) — фильтрует массив с помощью функции callback(item, i, arr), оставляя только те значения, для которых функция возвращает true.

var arr = [1, -1, 2, -2, 3];

var positiveArr = arr.filter(function(number) {
  return number > 0;
});

alert( positiveArr ); // 1,2,3

arr.map(callback) — создает новый массив, в котором все элементы arr буду обработаны функцией callback(item, i, arr)

var names = ['HTML', 'CSS', 'JavaScript'];

var nameLengths = names.map(function(name) {
  return name.length;
});

// получили массив с длинами
alert( nameLengths ); // 4,3,10

arr.every(callback) — возвращает true если callback вернет true для каждого элемента.

arr.some(callback) — возвращает true если callback вернет true хотя бы для одного элемента массива.

var arr = [1, -1, 2, -2, 3];

function isPositive(number) {
  return number > 0;
}

alert( arr.every(isPositive) ); // false, не все положительные
alert( arr.some(isPositive) ); // true, есть хоть одно положительное

arr.reduce(callback) — используется для последовательной обработки элементов массива с сохранение промежуточного результата. Функция callback(previousValue, currentItem, index, arr) = callback(промежуточный результат, текущий элемент массива, итератор, массив).

arr.reduceRight(callback) — работает также как и  arr.reduce(callback), только обходит массив с права на лева.

var arr = [1, 2, 3, 4, 5]

// для каждого элемента массива запустить функцию,
// промежуточный результат передавать первым аргументом далее
var result = arr.reduce(function(sum, current) {
  return sum + current;
}, 0);

alert( result ); // 15

Работа с массивами в javascript

Перебор элементов циклом FOR

// цикл for
var arr = ["Яблоко", "Апельсин", "Груша"];

for (var i = 0; i < arr.length; i++) {
  alert( arr[i] );
}

Не используйте for..in для массивов! Он работает медленней + выводит скрытые свойства объекта.

forEach

Метод forEach ничего не возвращает, его используют только для перебора, как более «элегантный» вариант, чем обычный цикл for.

var arr = ["Яблоко", "Апельсин", "Груша"];

arr.forEach(function(item, i, arr) { // item - элемент массива, i - итератор, arr - массив
  alert( i + ": " + item + " (массив:" + arr + ")" );
});

Трюки

Укорачиваем(обрезаем) массив

Если изменить значение length, то данные с индексами больше нового значения — удаляются. Например:

// обрезаем массив
var arr = [1, 2, 3, 4, 5];

arr.length = 2; // укоротить до 2 элементов
alert( arr ); // [1, 2]

arr.length = 5; // вернуть length обратно, как было
alert( arr[3] ); // undefined: значения не вернулись

Повторение строки 3 раза:

alert( new Array(4).join("ля") ); // ляляля

Источник:

https://learn.javascript.ru/array