Your Name

Your Creative Subtitle


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

Давайте начнем с определения массива - это упорядоченный набор данных. Упорядоченный подразумевает то что у каждого элемента в массиве есть порядковый номер. В программирование с давних времен повелось что отсчет элементов начинается с 0, а не с 1 как принято считать в обычной жизни.

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

Можно создать массив с помощью вызова конструктора от объекта Array.

new Array();	// -> []

В конструктор можно передать один аргумент - число, который укажет сколько нужно зарезервировать мест под массив. По факту будет создан объект-массив со свойством length равным 3.

new Array(3);	// -> (3) [empty × 3]

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

new Array(1, 4, `Hello`, true)); // -> (4) [1, 4, "Hello", true]

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

[];						// -> []
[1, 4, `Hello`, true];	// -> (4)_[1, 4, `Hello`, true]

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

Доступ к элементу массива

Чтобы обратиться к элементу массива надо воспользоваться квадратными скобками [].

let array = [1,2,3,4,5,6]; 
console.log(array[4]);	// -> 5

Если вы обратитесь к элементу которого не существует в массиве то получите значение undefined. Нужно обратить к последнему элементу массива, воспользуемся свойством length.

let array = [1,2,3,4,5,6]; 
console.log(array[array.length - 1]); // -> 6

Перебор элементов массива

Самый простой и понятный способ это использовать цикл со счетчиком

let array = [`A`, `B`, `C`, `D`, `E`]; 
for(let i = 0; i < array.length; i++) {
	console.log(`array[${i}]`, array[i]);
}

Используя цикл со счетчиком можно менять порядок перебора, с конца по начало, через один элемент и т.д. Можно использовать цикл for…of, тогда запись будет более краткой.

let array = [`A`, `B`, `C`, `D`, `E`]; 
for(let item of array) {
	console.log(item);
}

Поиск элемента в массиве

Поиск позиции элемента в массиве - indexOf.

[0, 1, 2, 3].indexOf(2); // -> 3
[0, 1, 2, 3].indexOf(5); // -> -1

Поиск элемента в массиве - find.

let item = [1,2,3,4,5].find(x => x === 3);
console.log(item); // -> 3

Проверка на существование элемента в массиве - includes

let found = [1,2,3,4,5].includes(3);
let notFound = [1,2,3,4,5].includes(-1);
console.log(found); // -> true
console.log(notFound); // -> false

Изменение элементов массива

Добавление нового элемента в конец массива - push. [0,1,2,3,4].push(5); // -> [0, 1, 2, 3, 4, 5] Удаление элемента с конца массива - pop.

	let array = [0,1,2,3,4];
	let last = array.pop();		// -> 4
	array;	// -> [0, 1, 2, 3]

Удаление элемента с начала массива - shift.

	let array = [0,1,2,3,4];
	let first = array.shift();		// -> 0
	array;	// -> [1, 2, 3, 4]

Добавление элемента в начале массива - unshift.

	let array = [1, 2, 3, 4];
	array.unshift(0);
	array;	// -> [0, 1, 2, 3, 4]

Удаление элемента массива по номеру позиции - splice. Метод splice изменяет содержимое массива удаляя, либо заменяя существующие элементы в определенном месте массива. В результате работы метода возвращаются массив удаленных элементов. splice(start, deleteCount?, …items?). Разберём входные аргументы метода start - позиция с которой нужно начать изменение массива. deleteCount - количество элементов, которые нужно удалить. items - элементы которые нужно добавить

let x = [1,2,3]; 
x.splice(2, 1); // 3

Сортировка массива - sort

let numbers = [5,4,1,2];
console.log(numbers.sort()); // ->[1,2,4,5]

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

let numbers = [5,4,1,1,2];
numbers.sort((a,b) => b - a);

Итого

Мы рассмотрели основные операции над массивами. Когда вы начнете работать с массивами, ознакомьтесь с полным перечнем методов объекта Array. Возможно то что вы хотите сделать уже было реализовано, и вам нужно всего лишь вызвать нужный метод. В следующий раз мы рассмотрим три моих любимых метода объекта Array. - map, filter, reduce.