- Как удалить элемент массива
- Как удалить массив
- Как добавить элемент в массив
- Как вывести массив
- Как создать пустой массив
- Как очистить массив
- Как объединить массивы
- Как узнать является ли объект массивом
- Как узнать индекс элемента в массиве
- Как найти максимальное значение массива
- Как найти минимальное значение массива
- Как заполнить массив с помощью метода fill
- Перемешать массив
- Скопировать массив
- Сортировка числового массива по убыванию
- Сортировка числового массива по возрастанию
- Как проверить существование элемента в массиве
- Сумма значений элементов массива
- Как создать двумерный и многомерный массивы в JavaScript
- Комментарии
Работа с массивами в JavaScript
Статья, в которой рассмотрены различные моменты, связанные с использованием массивов в JavaScript.
Как удалить элемент массива
Удаление элемента (ов) из массива осуществляется одним из следующих методов:
.pop()
- предназначен для удаления последнего элемента массива..shift()
- предназначен для удаление первого элемента массива..splice()
- может использоваться для удаления одного или нескольких элементов из массива, начиная с указанного.
Например:
var myArray = ["Газета", "Журнал", "Книга"];
myArray.pop(); // ["Газета", "Журнал"]
myArray.shift(); // ["Журнал"]
var display = ["19 inch", "21 inch", "22 inch", "27 inch"];
display.splice(2,1); //удалить один элемент начиная с элемента, имеющего индекс равный 2.
// -> ["19 inch", "21 inch", "27 inch"]
display.splice(0,2); //удалить два элемента начиная с элемента, имеющего индекс, равный 0.
// -> ["27 inch"]
Как удалить массив
Для того чтобы удалить массив, хранящейся в некоторой переменной, достаточно присвоить ей другое значение.
Например:
var myList = ["Газета", "Журнал", "Книга"];
// присвоим переменной myList значение null
myList = null;
Как добавить элемент в массив
Для добавления элемента в массив можно воспользоваться одним из следующих методов:
.push()
- предназначен для добавления элемента в конец массива..unshift()
- предназначен для добавления элемента в начало массива..splice()
- может использоваться для добавления одного или нескольких элементов в массив, начиная с указанного.
var display = ["19 inch", "21 inch", "22 inch", "27 inch"];
display.push("30 inch"); // ["19 inch", "21 inch", "22 inch", "27 inch", "30 inch"]
display.unshift("17 inch"); // ["17 inch", "19 inch", "21 inch", "22 inch", "27 inch", "30 inch"]
display.splice(3, 0, "24 inch", "26 inch"); // добавляет элементы "24 inch" и "26 inch" в массив после элемента, имеющего индекс 3.
Как вывести массив
Для того чтобы вывести массив в некоторый элемент на веб-странице его предварительно необходимо преобразовать в строку.
Например, вывести содержимое некоторого массива в элемент с id="array"
:
<p id="array"></p>
<script>
var display = ["19 inch", "21 inch", "22 inch", "27 inch"];
document.getElementById("array").textContent = display.join(", ");
</script>
Как создать пустой массив
Создание пустого массива осуществляется следующими конструкциями:
// 1 способ
var имя_массива = new Array();
// 2 способ
var имя_массива = [];
Как очистить массив
Для того чтобы удалить все элементы из некоторого массива можно воспользоваться одним из следующих способов:
var display = ["19 inch", "21 inch"];
// 1 способ
display = [];
// 2 способ
display.length = 0;
// 3 способ
display.splice(0,display.length);
// 4 способ
while(display.length > 0) {
display.pop();
}
Как объединить массивы
Для того чтобы объединить 2 или больше массивов можно воспользоваться методом concat()
. Этот метод не изменяет существующие массивы, он создаёт новый массив, содержащий элементы объединяемых массивов.
var namesRussia = ["Иван", "Сергей"];
var namesEnglish = ["John", "Leo", "Bob"];
var names = namesRussia.concat(namesEnglish);
Как узнать является ли объект массивом
Для того чтобы узнать какой тип данных содержит переменная можно воспользоваться одной из следующих конструкций:
var namesRussia = ["Иван", "Сергей"];
//1 способ - метод isArray
if (Array.isArray(namesRussia)) {
console.log("является массивом");
} else {
console.log("не является массивом");
}
//2 способ
if( Object.prototype.toString.call( namesRussia ) === '[object Array]' ) {
// является массивом
} else {
// не является массивом
}
Как узнать индекс элемента в массиве
Для того чтобы найти некоторый элемент в массиве можно воспользоваться методом indexOf()
. Значение, которое надо найти у элемента указывается в качестве первого параметра (valueElement
). Данный параметр является обязательным. Кроме этого при необходимости можно указать индекс элемента (startIndex
) в качестве 2 параметра данного метода, чтобы поиск элемента осуществлялся не с начала, а с указанного элемента.
var listOrder = ["Бритва", "Сумка", "Утюг"]
// "Утюг" - valueElement
// 1 - startIndex
listOrder.indexOf("Утюг",1 );
//без указания начального индекса
listOrder.indexOf("Утюг");
В качестве результата метод indexOf()
возвращает индекс найденного элемента или значение -1
. В том случае если указанное значение имеют несколько элементов, то данный метод возвращает индекс первого найденного элемента.
Примечание: Если вы хотите осуществлять поиск элемента в массиве начиная с конца, то используйте метод lastIndexOf()
.
var fruits = ["Банан", "Яблоко", "Апельсин", "Манго"];
var apple = fruits.indexOf("Яблоко"); //1
Как найти максимальное значение массива
Для того чтобы найти максимальное значение массива можно воспользоваться следующей конструкцией:
//создание числового массива
var numberArray = [32, 1, 4, 17, 50, 9];
//максимальное значение массива
var maxValue = Math.max.apply(null,numberArray);
Как найти минимальное значение массива
Для того чтобы найти минимальное значение массива можно воспользоваться следующей конструкцией:
//создание числового массива
var numberArray = [32, 1, 4, 17, 50, 9];
//минимальное значение массива
var minValue = Math.min.apply(null,numberArray);
Как заполнить массив с помощью метода fill
Метод fill()
предназначен для заполнения массива или его части с помощью указанного значения:
//создадим массив, состоящий из 20 элементов
var myArray = new Array(20);
//установим все элементам массива значение 0
myArray.fill(0);
//заполним первые 10 элементов массива случайные числами от 0 до 10
myArray.fill( Math.floor(Math.random() * myArray.length), 0, 9);
//заполним элементы, имеющие индекс от 11 до 15 числом 55
myArray.fill( 55, 11, 15 );
//заполним элементы, имеющие индекс больше 17 числом 3
myArray.fill( 3, 17 );
Перемешать массив
Для того чтобы перемешать элементы в массиве можно воспользоваться следующей функцией:
function shuffle(myArray) {
var index, valueIndex;
for (var i=0; i<=myArray.length-1; i++) {
index = Math.floor(Math.random()*i);
valueIndex = myArray[index];
myArray[index] = myArray[i];
myArray[i] = valueIndex;
}
return myArray;
}
// массив
var display = ["19 inch", "21 inch", "22 inch", "27 inch"];
// перемешаем элементы в массиве
shuffle(display);
// выведем массив в консоль
console.log(display.join());
Скопировать массив
Для того чтобы скопировать массив используйте следующий код:
var display = ["19 inch", "21 inch", "22 inch", "27 inch"];
var displayCopy = display.slice();
Сортировка числового массива по убыванию
Для сортировки числового массива по убыванию можно использовать метод sort()
:
var numberArray = [32, 1, 4, 17, 50, 9];
numberArray.sort(function(a, b){
return a-b
});
// Результат: 50, 32, 17, 9, 4, 1
Сортировка числового массива по возрастанию
Для сортировки числового массива по возрастанию можно использовать метод sort()
:
var numberArray = [32, 1, 4, 17, 50, 9];
numberArray.sort(function(a, b){
return b-a;
});
// Результат: 1, 4, 9, 17, 32, 50
Как проверить существование элемента в массиве
Для того чтобы проверить есть ли указанный элемент в массиве или нет можно воспользоваться методом indexOf()
.
var modelPrinters= ["Xerox", "HP", "Canon", "FX"];
if(modelPrinters.indexOf("Canon")!=-1) {
//элемент существует в массиве
} else {
//элемент не существует в массиве
}
Сумма значений элементов массива
Определение суммы элементов числового массива:
var arrayNumbers= [10, 30, 25, 32];
var sumNumbers = 0;
for (var i=0; i<=arrayNumbers.length-1; i++) {
sumNumbers += arrayNumbers[i];
}
console.log("Сумма элементов массива: " + sumNumbers);
Как создать двумерный и многомерный массивы в JavaScript
Готовых функций для создания и работы с двумерными и многомерными массивами в JavaScript нет. Их создание осуществляется посредством того, что каждый элемент первоначального массива в свою очередь тоже должен является массивом.
Например, создадим массив 5x5:
var myArray = new Array(5);
for (var i=0; i<=myArray.length-1; i++) {
myArray[i] = new Array(5);
}
myArray[3][2] = 35;
Например, создадим массив 3x2:
var myItems = [[51,22],[42,87],[55,16]];
//выведем в консоль содержимое элемента myItems, имеющего индекс 1, а в нём элемента, имеющего индекс 0.
console.log(myItems[1][0]);
Например, создадим пустой двумерный массив:
var myArray = [[]];
Например, спроектируем функцию arrayTable, предназначенную для создания табличного массива:
function arrayTable( rows, cols, defaultValue){
// создаём строки
var newArray = new Array(rows);
for(var i=0; i < rows; i++) {
// создаём столбцы
newArray[i] = new Array(cols);
//инициализируем ячейки значением
for(var j=0; j < cols; j++) {
newArray[i][j] = defaultValue;
}
}
return newArray;
}
// например создадим табличный массив с помощью функции arrayTable
var matrix = arrayTable( 3 , 4, ''); // 3 строки и 4 столбца, заполненные пустыми строками
var numbersArray = arrayTable( 10, 10, 25);// 10 строк и 10 столбцов, заполненные числом 25
Например, создадим трехмерный массив 3×3×3:
var newArray = new Array(3);
for (var i = 0; i < 3; i++) {
newArray[i] = new Array(3);
for (var j = 0; j < 3; j++) {
newArray[i][j] = new Array(3);
for(var k=0; k < 3; k++) {
newArray[i][j][k] = Math.floor(Math.random()*100);
}
}
}
//выведем значение элементов массива в консоль браузера:
for(var i=0; i < 3; i++) {
for(var j=0; j < 3; j++) {
for(var k=0; k < 3; k++) {
console.log( "[" + i + "," + j + "," + k + "] = " + newArray[i][j][k] );
}
}
}