一. JavaScript数组常用方法

Posted 2020-11-01 hy-space

1.基础方法：
push：向数组的末尾增加一项 返回值是数组的新长度
unshift：向数组开头增加一项 返回值是数组的新长度
pop:删除数组的末尾项 返回值是删除的数组项
shift:删除数组开头项 返回被删除的开头项目
splice：增删改，功能强大
slice:复制数组 返回值是复制到的新数组 写上数值之后 不包含被复制的最后一项

2.拼接：
concat:把一个数组和另一个数组拼接在一起 返回拼接好的数组 
join:把数组中的每一项 按照指定的分隔符拼接成字符串

3.排序：
reverse:倒序数组 返回值倒序数组 原有数组改变
sort:根据匿名函数进行冒泡排序 b-a倒序 a-b升序

4.兼容性不好：
indexOf:返回获取项在数组中的索引
lastIndexOf:返回获取项在数组中出现的最后一次索引
forEach: 循环遍历数组 参数是一个匿名函数 默认返回为undefined
map：循环遍历数组 参数是一个匿名函数
filter：创建一个新的匹配过滤条件的数组
reduce：数组中的每个值（从左到右）开始合并，最终为一个值。

1.基础方法：

push：向数组的末尾增加一项 返回值是数组的新长度
unshift：向数组开头增加一项 返回值是数组的新长度

var array = ["a","b","c","d","e","f"];
var last = array.unshift("begin");
console.log(array)     // ["begin", "a", "b", "c", "d", "e", "f"]

 

pop:删除数组的末尾项 返回值是删除的数组项

var array = ["a","b","c","d","e","f"];
var last = array.pop();
console.log(array)    //["a", "b", "c", "d", "e"]

 

shift:删除数组开头项 返回被删除的开头项目

var array = ["a","b","c","d","e","f"];
var last = array.shift();
console.log(array)      // ["b", "c", "d", "e", "f"]

 

splice：增删改，功能强大

（1）删除：只需要提供两个参数，要删除的第一项的位置和要删除的个数,并返回删除的元素数组：
var num = [1,2,3,4,5];
var newNum = num.splice(1,2);
console.log(num);    //[1,4,5]
console.log(newNum); //[2,3]

（2）插入：提供多个参数，第一个参数是要插入的位置，第二个是0表示删除0个，后面是要插入的元素，可以是多个，因为删除0个，所以返回空数组；
*  四个参数，第二个为0代表插入
var num = [1,2,3,4,5];
var newNum = num.splice(1,0,"Tom","Jerry");
console.log(num);    //[1, "Tom", "Jerry", 2, 3, 4, 5]
console.log(newNum); //[]

（3）替换：提供多个参数，第一个参数是要插入的位置，第二个是删除的个数，后面是要插入的元素，可以是多个，返回删除的数组；
*   四个参数，第二个大于0代表替换，是多少表示替换掉多少，第一个参数代表从下标为几处开始替换
var num = [1,2,3,4,5];
var newNum = num.splice(1,2,"Tom","Jerry");
console.log(num);    //[1, "Tom", "Jerry", 4, 5]
console.log(newNum); //[2,3]

 

slice:复制数组 返回值是复制到的新数组，该方法并不会修改原数组

　　　　*  返回一个新的数组，包含从 start 到 end （不包括该元素）的 arrayObject 中的元素。

　　　　*  如果 end 未被规定，那么 slice() 方法会选取从 start 到数组结尾的所有元素。

var array = ["a","b","c","d","e","f"];
console.log(array.slice(-1))     //["f"]
console.log(array.slice(-2))     //["e","f"]
console.log(array.slice(1))      //["b", "c", "d", "e", "f"]
arrays.slice(1,4)                // ["b", "c", "d"]

 

2.拼接：

concat:把一个数组和另一个数组拼接在一起 返回拼接好的数组 

var array = ["a","b","c"];
var array1 = ["a","b","c"];
var array2 = array.concat(array1);
console.log(array2)    // ["a", "b", "c", "a", "b", "c"]

 

join:把数组中的每一项 按照指定的分隔符拼接成字符串

var array = ["a","b","c","d","e","f"];
var array1 = array.join("");   //"abcdef"
var array2 = array.join("_");  //"a_b_c_d_e_f"

 

3.排序：

reverse:倒序数组 返回值倒序数组 原有数组改变

var  arr = [1, 2, 3, 4, 5];
arr.reverse()     // [5, 4, 3, 2, 1]

 

sort:根据匿名函数进行冒泡排序 b-a倒序 a-b升序,但需要注意的是这个方法是按Ascii码排序(实用性不大)

var arr = [1,3,7,5,14,24];
arr.sort();
console.log(arr);　　==>[1,14,24,3,5,7]

 

4.常用方法：

indexOf:返回获取项在数组中的索引（第一次出现的索引）

var arr = [‘apple‘,‘orange‘,‘pear‘];
 
console.log("found:", arr.indexOf("orange")); // 返回索引  1

 

lastIndexOf:返回获取项在数组中出现的最后一次索引

var arr = [‘apple‘,‘orange‘,‘orange‘,‘pear‘];
 
console.log("found:", arr.lastIndexOf("orange"));// 返回索引2

 

forEach: 循环遍历数组 参数是一个匿名函数 默认返回为undefined

var array1 = [1,2,3,4,5,6];
var x = array1.forEach(function(value,index,array){
     array[index] = value+1;
     return array;
});
console.log("新数组"+x); //不管以上返回什么，x都为undefined
console.log("原数组"+array1); //[2,3,4,5,6,7]

 

map：循环遍历数组 参数是一个匿名函数

var array1 = [1,2,3,4,5,6];
var x = array1.map(function(value,index,array){
    return value+1;
});
console.log("新数组"+x);         //[2,3,4,5,6,7];
console.log("原数组"+array1);    //[1,2,3,4,5,6];

 

filter：创建一个新的匹配过滤条件的数组

var arr = [
  {"name":"apple", "count": 2},
  {"name":"orange", "count": 5},
  {"name":"pear", "count": 3},
  {"name":"orange", "count": 16},
];
   
var newArr = arr.filter(function(item){
  return item.name === "orange";
});
 
console.log("Filter results:",newArr); // [
　　　　　　　　　　　　　　　　　　　　　　　　　　{"name":"orange", "count": 5},
　　　　　　　　　　　　　　　　　　　　　　　　　　{"name":"orange", "count": 16}
　　　　　　　　　　　　　　　　　　　　　　　　　 ]

 

reduce：数组中的每个值（从左到右）开始合并，最终为一个值。

var arr = [1,2,3,4];
var newarr = arr.reduce(function(x, y) {
        return x * 10 + y;
    });
console.log(newarr)   // 1234

/**
*   reduce(callback, initialValue)会传入两个变量
*　　回调函数(callback)，初始值(initialValue)
*　　一般来讲prev是从数组中第一个元素开始的，next是第二个元素。
*　　但是当你传入初始值(initialValue)后，第一个prev将是initivalValue，next将是数组中的第一个元素。
*/

var arr = ["apple","orange"];
function noPassValue(){
  return arr.reduce(function(prev,next){
    console.log("prev:",prev);    //prev: apple
    console.log("next:",next);    //prev: orange
     
    return prev + " " +next;    //"apple orange"
  });
}
noPassValue();


var arr = ["apple","orange"];
function passValue(){
  return arr.reduce(function(prev,next){
    console.log("prev:",prev);    //  {}       {"apple"}
    console.log("next:",next);    //"apple"    "orange"
     
    prev[next] = 1;               //在此赋值{}["apple"]=1  -->{apple: 1}
    return prev;                  //{apple: 1, orange: 1}
  },{});
}
passValue();

//由此，可以实现：统计一个数组中有多少个不重复的单词
var arr = ["apple","orange","apple","orange","pear","orange"];
function getWordCnt(){
  return arr.reduce(function(prev,next){
    prev[next] = (prev[next] + 1) || 1;
    return prev;
  },{});
}
console.log(getWordCnt());   //{apple: 2, orange: 3, pear: 1}

某同学的期末成绩如下表示

var result = [{
        subject: ‘math‘,
        score: 88
    },
    {
        subject: ‘chinese‘,
        score: 95
    },
    {
        subject: ‘english‘,
        score: 80
    }];
如何求该同学的总成绩？
很显然，利用for循环可以很简单得出结论
var sum = 0;
for(var i=0; i<result.length; i++) {
    sum += result[i].score;
}
但是我们的宗旨就是抛弃for循环，因此使用reduce来搞定这个问题，以下相当于设置初始分为0，
var sum = result.reduce(function(prev, cur) {
    return cur.score + prev;
}, 0);