📌  相关文章
📜  必须使用 JavaScript 数组函数 – 第 3 部分

📅  最后修改于: 2021-10-19 04:51:25             🧑  作者: Mango

必须使用 JavaScript 数组函数 – 第 1 部分

必须使用 JavaScript 数组函数 – 第 2 部分

在本文中，我们将讨论以下 JavaScript 数组函数

  1. 原型.reduce()
  2. 原型.concat()
  3. 原型.sort()
  4. 原型.反向（）

1. Array.Prototype.reduce()

描述： Array.prototype.reduce()函数在程序员需要遍历 JavaScript 数组并将其缩减为单个值时使用。从左到右为数组中的每个值调用一个回调函数。回调函数返回的值可用于下一个元素作为其回调函数的参数。在不设置初值情况下，减少的回调函数直接调用上2次elementwith第一元件作为PREVIOUSVALUE被传递。如果数组为空且未提供初始值，则会抛出 TypeError。

句法：

arr.reduce(callback[, initialValue])

参数：

callback：为数组 arr 的每个元素调用的回调函数

  • previousValue：前一个函数调用返回的值或初始值。
  • currentValue：当前正在处理的数组元素的值
  • currentIndex:当前正在处理的数组元素的索引
  • 数组：调用reduce的原始数组。

initialValue（可选）：第一次调用回调函数时用作 previousValue 的初始值。

示例用例：

  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

在上面的示例中，在 arr 上调用 Array.reduce() 时提供了初始值 0。在这种情况下，有必要提供一个初始整数值。这是因为对于回调函数的每次迭代，变量 previousValue 必须具有整数值而不是整个对象。如果我们不将 initialValue 传递为 0，那么对于第一次迭代，前一个值将成为整个对象并尝试向其添加一个整数值，从而产生垃圾输出。

2. Array.prototype.concat()

描述： Array.prototype.concat() 用于将一个数组与另一个数组/值连接起来。它不会更改任何现有数组，而是返回修改后的数组。它接受新数组和新值作为参数，它与调用函数的数组连接并返回结果数组。

句法： 

NewArray = Array1.concat(value1[, value2[, ...[, valueN]]])

参数：
 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 个参数，即被比较的值。如果 value1 较小，则比较函数应返回负值。如果 value2 较小，compareFunction 应返回正值。如果未提供 compare函数，默认 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 值进行比较。由于 Unicode 中的 30 < 5，因此排序顺序不正确。
使用 sort函数对整数数组进行排序： 

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

在这里，顺序是正确的，因为我们没有使用默认的 sortFunction，而是我们自己的 sortFunction，它比较整数值来决定排序顺序。
使用 sort函数对对象数组进行排序： 

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

关于作者：

“Harshit 是一名技术爱好者，对编程有着浓厚的兴趣。他拥有技术学士学位。在诺伊达 JIIT 获得计算机科学学位，目前在 SAP 担任前端开发人员。他还是国家级乒乓球运动员。除此之外，他喜欢通过看电影和英语情景喜剧来放松。他在德里工作，您可以通过 https://in.linkedin.com/pub/harshit-jain/2a/129/bb5 与他联系

如果您还想在这里展示您的博客，请参阅 GBlog，了解 GeeksforGeeks 上的客座博客写作。