js中数组的方法

143 阅读6分钟

检测数组的方法

Array.isArray() 判断括号中的某个值是不是数组,返回boolean值

    var names = ['zhangsan','lisi','wangwu'];
    var n = null ;
    console.log(Array.isArray(names));      // true
    console.log(Array.isArray(n));      // false

数组添加的方法

push() 可以接收任意数量的参数,把它们逐个添加到数组末尾,返回 新数组的长度。会改变原数组

    var arr = ['one','two'];
    console.log( arr.push('three','four') );    // 4
    console.log( arr );             ['one','two','three','four']

pop() 从数组末尾移除最后一项,返回移除的项,会改变原数组

    var arr = ['one','two','three','four'];
    console.log( arr.pop() );       // four
    console.log( arr );             // ['one','two','three']

unshift() 能够在数组前面添加任意个项,返回新数组的长度,会改变原数组

    var arr = ['one','two'];
    console.log( arr.unshift('a','b','c') )     // 7
    console.log( arr )      // ['a','b','c',"one", "two"]

shift() 移除数组中的第一项,返回移除后的项 会改变原数组

    var arr=["one", "two", "three", "four"];
    console.log(arr.shift());      // one
    console.log(arr);              // ["two", "three", "four"]

数组的重排序方法

reverse() 反转数组项的顺序,会改变原数组

    var arr=["one", "two", "three", "four"];
    arr.reverse();
    console.log(arr);       //["four", "three", "two", "one"]

sort() 按Unicode编码进行排序( Unicode编码进行排序 0-9: 48-57 ; A-Z: 65-90 ; a-z: 97-122 ) 会改变原数组

    var arr1=["one", "two", "three", "four"];
    arr1.sort();
    console.log(arr1);  // ["four", "one", "three", "two"]

    var arr2 = [100, 5, 90, 34, 7, 4, 6, 8, 29,1000];
    arr2.sort();
    console.log(arr2)   //[100, 1000, 29, 34, 4, 5, 6, 7, 8, 90]

若要进行数字的大小排序,参数可以加入比较函数 function(a,b){return a-b}

    var arr1 = [100, 5, 90, 34, 7, 4, 6, 8, 29,1000];
    arr1.sort(function(a,b){return a-b;});
    console.log(arr1)       // 从小到大排序  [4, 5, 6, 7, 8, 29, 34, 90, 100, 1000]

    var arr2 = [100, 5, 90, 34, 7, 4, 6, 8, 29,1000];
    arr2.sort(function(a,b){return b-a;});
    console.log(arr2)       // 从大到小排序 [1000, 100, 90, 34, 29, 8, 7, 6, 5, 4]

操作方法

concat() 拼接,基于当前数组中的所有项创建一个新数组,参数可以是数组项或者是数组,不会改变原数组

    var arr=['apple','banana'];
    var newArr = arr.concat('orange',['a','b','c']);
    console.log(arr);       // ["apple", "banana"]
    console.log(newArr)     // ["apple", "banana", "orange", "a", "b", "c"]

slice() 截取,基于当前数组中的一个或多个项创建一个新数组。不会改变数组

参数:第一个参数:开始位置;第二个参数:结束位置

  • 没有参数时:表示截取全部值

    var arr=["a", "b", "c", "d", "e", "f", "g"];
    var newArr = arr.slice();
    console.log(arr)        //  ["a", "b", "c", "d", "e", "f", "g"]
    console.log(newArr);    //  ["a", "b", "c", "d", "e", "f", "g"]
    
  • 一个参数时:截取从开始位置之后的所有数组项

    var arr=["a", "b", "c", "d", "e", "f", "g"];
    var newArr = arr.slice(3);
    console.log(arr)            //  ["a", "b", "c", "d", "e", "f", "g"]
    console.log(newArr);        //  [ "d", "e", "f", "g"]
    
  • 两个参数时:表示截取开始位置到结束位置的所有数组项,但不包括结束位置

    var arr=["a", "b", "c", "d", "e", "f", "g"];
    var newArr = arr.slice(3,5);
    console.log(arr)            //  ["a", "b", "c", "d", "e", "f", "g"]
    console.log(newArr);        //  [ "d", "e",]
    
  • 参数可以为负数:表示从数组末尾向前数

    var arr=["a", "b", "c", "d", "e", "f", "g"];
    var newArr = arr.slice(3,-2);
    console.log(arr)            //  ["a", "b", "c", "d", "e", "f", "g"]
    console.log(newArr);        //  [ "d", "e",]
    
    var arr=["a", "b", "c", "d", "e", "f", "g"];
    var newArr = arr.slice(3,-6);
    console.log(arr)            //  ["a", "b", "c", "d", "e", "f", "g"]
    console.log(newArr);        //  []
    
    var arr=["a", "b", "c", "d", "e", "f", "g"];
    var newArr = arr.slice(-5,-2);
    console.log(arr)            //  ["a", "b", "c", "d", "e", "f", "g"]
    console.log(newArr);        //  [ "c", "d","e"]
    
    var arr=["a", "b", "c", "d", "e", "f", "g"];
    var newArr = arr.slice(-3,-5);
    console.log(arr)            //  ["a", "b", "c", "d", "e", "f", "g"]
    console.log(newArr);        //  []
    

splice() 对数组进行删除、插入、替换。返回截取的数组项,会改变原数组

参数:第一个参数:开始位置;第二个参数:截取的长度;第三个参数及之后的参数:表示要插入或者替换的值

  • 删除

    var arr=["a", "b", "c", "d", "e", "f", "g"];
    var newArr = arr.splice(2,3);
    console.log(arr);           //["a", "b", "f", "g"]
    console.log(newArr);        //["c", "d", "e"]
    
  • 插入

    var arr=["a", "b", "c", "d"];
    var newArr = arr.splice(2,0,"A","B","C");
    console.log(arr);           //["a", "b", "A","B","C","c", "d"]
    console.log(newArr);        //[]
    
  • 替换

    var arr=["a", "b", "c", "d"];
    var newArr = arr.splice(1,2,"B","C");
    console.log(arr);           //["a", "B", "C", "d"]
    console.log(newArr);        //["b", "c"]
    
    var arr=["a", "b", "c", "d"];
    var newArr = arr.splice(1,1,"B","C");
    console.log(arr);           //["a", "B", "C","c", "d"]
    console.log(newArr);        //["b"]
    

转换方法

join() 将数组转换成对应的字符串。参数就是连接符。不会改变原数组

    var arr=["a", "b", "c", "d", "e", "f", "g"];
    var str = arr.join('#');
    console.log(str);       //a#b#c#d#e#f#g
    console.log(arr);       //["a", "b", "c", "d", "e", "f", "g"]

ES5 新增的方法

indexOf() 返回要查找的数组项在数组中的索引位置,找到目标后立即停止并返回索引,如果没有该数组项返回-1;

参数:第一个参数为目标值;第二个参数(可选):表示要查找的索引起始位置。可为负数,表示从数组末尾向前多少位后,开始查找。

    var arr=['haha','100','true',200,'haha','100','true'];
    console.log(arr.indexOf('hehe'));       //  -1
    console.log(arr.indexOf('100'));        //  1   
    console.log(arr.indexOf('haha',1));     //  4
    console.log(arr.indexOf('true',-3));    //  6  

lastIndexOf() 从数组末尾开始向前查找,参数和用法与 indexOf() 类似

every() 对数组中的每一项运行给定函数,如果该函数对每一项都返回true,则结果返回true;否则返回false。类似逻辑与运算

方法参数是回调函数,回调函数有三个参数分别为:数组项,索引,数组本身

    var arr=[1,2,3,4,5,6,7,8,9,10];
    var result = arr.every( function( value,index,array ) {
    return value > 0 });
    alert(result);      //  true

some() 对数组中的每一项运行给定函数,如果函数对任意一项返回true,则结果返回true,否则返回false。类似逻辑或运算。

    var arr=[1,2,3,4,5,6,7,8,9,10];
    var result = arr.some( function( value,index,array ){
    return value > 9 });
    console.log(result);        // true

filter() 对数组中的每一项运行给定函数,返回该函数结果为true的项,组成一个新的数组。

    var arr=[1,2,3,4,5,6,7,8,9,10];
    var result = arr.filter( function( value,index,array ){
    return value > 5 });
    console.log(result);    //  [6,7,8,9,10]

map() 对数组中的每一项运行给定函数,返回每次函数的结果,组成一个新的数组。不考虑函数结果是true还是false。

    var arr=[100,200,300,400,500];
    var result = arr.map( function( value,index,array ){
    return value * 1.3 });
    console.log(result);    //  [130, 260, 390, 520, 650]

forEach() 对数组中的每一项运行给定函数。这个方法没有返回值。对数组进行遍历,性能比for循环好。

reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终为一个值。

array.reduce(function(previousValue, currentValue, index, array){}, [initialValue])

  • callback: (执行数组中每个值的函数,包含四个参数)

  • previousValue:必须 (上一次调用回调返回的值,或者是提供的初始值(initialValue))

  • currentValue:必须 (数组中当前被处理的元素)

  • index:可选 (当前元素在数组中的索引)

  • array:可选 (调用 reduce 的数组)

  • initialValue (作为第一次调用 callback 的第一个参数。)

    // reduce没有第二个参数
    var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
    var result=arr.reduce(function (prev, current, index, array) {
        return prev + current }); 
        
    //prev:第一个代表数组的第一项值,后面的每一次都是迭代的结果。
    //current:代表数组从第二项开始的值。
    
    console.log(result);    //  55
    
     // reduce有第二个参数
     var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
     var result=arr.reduce(function (prev, current, index, array) {
     return prev + current;
    },100); 
    
    // prev:第一次代表迭代的初始,后面的每一次都是迭代的结果。
    // current:代表数组从第一项开始的值。
    // 100:迭代的初始值
    
    console.log(result);     // 155