Необходимо использовать функции массива JavaScript - Часть 3

Опубликовано: 15 Июля, 2021

Необходимо использовать функции для работы с массивами JavaScript - часть 1

Необходимо использовать функции для работы с массивами JavaScript - часть 2

В этой статье мы собираемся обсудить следующие функции массива JavaScript

  1. prototype.reduce ()
  2. prototype.concat ()
  3. prototype.sort ()
  4. prototype.reverse ()

1. Array.Prototype.reduce ()

Описание: функция Array.prototype.reduce () используется, когда программисту необходимо перебрать массив JavaScript и уменьшить его до одного значения. Функция обратного вызова вызывается для каждого значения в массиве слева направо. Значение, возвращаемое функцией обратного вызова, доступно следующему элементу в качестве аргумента его функции обратного вызова. В случае, если initialValue не указан, функция обратного вызова reduce вызывается непосредственно для 2- го элемента, причем 1- й элемент передается как previousValue. Если массив пуст и начальное значение также не указано, выдается ошибка TypeError.

Синтаксис:

arr.reduce (обратный вызов [, начальное значение])

Параметры:

callback: функция обратного вызова, вызываемая для каждого элемента массива arr

  • previousValue: значение, возвращенное предыдущим вызовом функции или начальным значением.
  • currentValue: значение текущего обрабатываемого элемента массива
  • currentIndex: индекс текущего обрабатываемого элемента массива
  • array: исходный массив, для которого вызывается сокращение.

initialValue (необязательно): начальное значение, которое будет использоваться как предыдущее значение при первом вызове функции обратного вызова.

Примеры использования:

  1. Чтобы найти сумму массива целых чисел.




function reduceFun1(previousValue, currentValue, index, array){
return previousValue + currentValue;
}
var result = [1,2,3,4,5].reduce(reduceFun1);
console.log(result); // Output : 15
  1. Учитывая массив объектов, содержащих адреса торговых точек, и найдите общий объем продаж, выполненных в Нью-Йорке.




var arr=[{name: "customer 1" , sales: 500, location: "NY" },
{name: "customer 1" , sales: 200, location: "NJ" },
{name: "customer 1" , sales: 700, location: "NY" },
{name: "customer 1" , sales: 200, location: "ORD" },
{name: "customer 1" , sales: 300, location: "NY" }];
function reduceFun2(previousValue, currentValue, index, array) {
if (currentValue.location === "NY" ) {
//console.log(previousValue.sales);
previousValue.sales = previousValue.sales + Number(currentValue.sales);
}
return previousValue;
}
var totalSalesInNY = arr.reduce(reduceFun2);
console.log(totalSalesInNY.sales); // Output: 1500

В приведенном выше примере начальное значение 0 предоставляется при вызове Array.reduce () для arr. В этом случае необходимо указать начальное целочисленное значение. Это связано с тем, что для каждой итерации функции обратного вызова переменная previousValue должна иметь целочисленное значение, а не весь объект. Если мы не передадим initialValue как 0, то для первой итерации предыдущее значение станет целым объектом и будет пытаться добавить к нему целочисленное значение, тем самым давая нежелательный вывод.

2. Array.prototype.concat ()

Описание : Array.prototype.concat () используется для объединения массива с другим массивом / значением. Он не изменяет какой-либо существующий массив, вместо этого он возвращает модифицированный массив. Он принимает как новые массивы, так и значения в качестве аргумента, который он объединяет с массивом, вызывающим функцию, и возвращает результирующий массив.

Синтаксис:

 NewArray = Array1.concat (значение1 [, значение2 [, ... [, значениеN]]])

Параметры:
valueN: новый массив или значение, которое будет объединено с массивом Array1.

Пример использования:
Объедините 2 целочисленных массива:




var arr1 = [1,2,3,4];
var arr2 = [5,6,7,8];
var arr3 = arr1.concat(arr2);
console.log(arr3); // Output : [1, 2, 3, 4, 5, 6, 7, 8]

Объедините 3 целочисленных массива:




var arr1 = [1,2,3,4];
var arr2 = [5,6];
var arr3 = [7,8];
var arr4 = arr1.concat(arr2,arr3);
console.log(arr4); // Output : [1, 2, 3, 4, 5, 6, 7, 8]

Объедините массив с отдельными целочисленными значениями:




var arr1 = [1,2,3,4];
var arr2 = arr1.concat(5,6,7,8);
console.log(arr2); // Output : [1, 2, 3, 4, 5, 6, 7, 8]

Объедините массив с другим массивом и другими множественными значениями:




var arr1 = [1,2,3,4];
var arr2 = [5,6];
var arr3 = arr1.concat(arr2, 7, 8);
console.log(arr3); // Output : [1, 2, 3, 4, 5, 6, 7, 8]

3. Array.prototype.sort ()

Описание: Array.prototype.sort () используется для сортировки массива. Он принимает необязательный аргумент compareFunction, который определяет критерии для определения того, какой элемент массива маленький, а какой больше. Функция compareFunction принимает 2 аргумента, то есть сравниваемые значения. Если значение1 меньше, функция сравнения должна вернуть отрицательное значение. Если значение2 меньше, функция compareFunction должна возвращать положительное значение. Если функция сравнения не предусмотрена, функция compareFunction по умолчанию преобразует элементы массива в строки, а затем сравнивает эти строки в порядке точек Unicode.

Синтаксис:

 arr.sort ([compareFunction])

Параметры:
compareFunction (необязательно): функция для определения порядка сортировки.

Пример использования:
Отсортируйте простой целочисленный массив:




var arr = [3, 1, 5, 4, 2].sort();
console.log(arr); // Output : [1, 2, 3, 4, 5]

Сортировка строкового массива:




var arr = [ "Orange" , "Apple" , "Banana" ].sort();
console.log(arr); // Output : ["Apple", "Banana", "Orange"]

Отсортируем еще один целочисленный массив:




var arr = [1, 30, 5].sort();
console.log(arr); // Output : [1, 30, 5]

Здесь порядок результирующего отсортированного массива неверен. Это связано с тем, что, поскольку мы используем функцию sortFunction по умолчанию, она преобразует все целые числа в строки, а затем сравнивает их на основе их значения Unicode. Поскольку 30 <5 в Юникоде, следовательно, неправильный порядок сортировки.
Отсортируйте целочисленный массив с помощью функции сортировки:




function sortFun(a,b){
return a - b;
}
var arr = [1, 30, 5].sort(sortFun);
console.log(arr); // Output : [1, 5, 30]

Здесь порядок правильный, потому что мы использовали не функцию sortFunction по умолчанию, а нашу собственную функцию sortFunction, которая сравнивает целочисленные значения для определения порядка сортировки.
Отсортируйте массив объектов с помощью функции сортировки:




var arr = [{name: "NY" , count: 20},
{name: "NJ" , count: 5},
{name: "JFK" , count: 60},
{name: "ORD" , count: 1}];
function sortFun(obj1, obj2){
return obj1.count - obj2.count;
}
arr.sort(sortFun);
console.log(arr); // Output [{name:"ORD", count: 1},
// {name:"NJ", count: 5},
// {name:"NY", count: 20},
// {name:"JFK", count: 60}]

4. Array.prototype.reverse ()

Описание : Array.prototype.reverse () используется для обращения массива JavaScript. Функция Reverse () изменяет сам вызывающий массив и возвращает ссылку на теперь перевернутый массив.

Синтаксис:

 array.reverse ()

Параметры:
Непригодный

Пример использования:




var arr = [1,2,3,4,5,6,7,8,9,10];
arr.reverse();
console.log(arr); //Output : [10, 9, 8, 7, 6, 5, 4, 3, 2, 1]

Все фрагменты кода, используемые в этой статье, доступны по адресу https://github.com/hjaintech/GeeksForGeeks/blob/master/Array_Functions_3.html.

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

  1. http://www.ecma-international.org/ecma-262/5.1/#sec-15.4.4.21
  2. http://www.ecma-international.org/ecma-262/5.1/#sec-15.5.4.6
  3. http://www.ecma-international.org/ecma-262/5.1/#sec-15.4.4.11
  4. http://www.ecma-international.org/ecma-262/5.1/#sec-15.4.4.8

Об авторе:

«Харшит является энтузиастом технологий и проявляет большой интерес к программированию. Он имеет степень бакалавра технических наук. получил степень в области компьютерных наук в JIIT, Нойда, и в настоящее время работает Front-end разработчиком в SAP. Он также является игроком в настольный теннис государственного уровня. Кроме того, он любит расслабляться, просматривая фильмы и английские комедийные сериалы. Он базируется в Дели, и вы можете связаться с ним по адресу https://in.linkedin.com/pub/harshit-jain/2a/129/bb5.

Если вы также хотите продемонстрировать здесь свой блог, пожалуйста, посетите GBlog, где можно писать в гостевом блоге на GeeksforGeeks.