数组的一些常见方法:数组基本方法

  01、数组的一些常见方法 02、数组的四个基本方法(数组元素的添加和删除)

  push()

  push():向数组的最后面插入一个或多个元素,返回结果为该数组新的长度。

  语法

  例子

   var arr = ["王一","王二","王三"];

    var result1 = arr.push("王四"); //末尾插入一个元素
    var result2 = arr.push("王五","王六"); //末尾插入多个元素
    console.log(result1); //打印结果: 4
    console.log(resu1t2); //打印结果: 6
    console.log(JSON.stringify(arr)); //打印结果: ["王一","王二”,"王三”,"王四","王五","王六"]

  pop()

  pop():删除数组中的最后一个元素,返回结果为被删除的元素。

  语法:

  例子:

   var arr = ["王一","王二","王三"];

    var result1 = arr.pop();
    console.log(resu1t1); //打印结果:王三
    console.log(JSON.stringify(arr)); //打印结果: ["王一","王二"]

  unshift()

  unshift():在数组最前面插入一个或多个元索,返回结果为该数组新的长度。插入元索后,其他元索的索引会依次调整。

  语法:

  例子:

   var arr = ["王一","王二”,"王三"];

    var result1 = arr.unshift("王四"); //最前面插入- -个元素
    var result2 = arr.unshift("王五","王六"); //最前面插入多个元素
    console.log(resu1t1); //打印结果: 4
    console.log(resu1t2); //打印结果: 6
    console.log(JSON.stringify(arr)); //打印结果: ["王五","王六","王四","王一","王二","王三"]

  shift()

  shift():删除数组中的第一个元素,返回结果为被删除的元素。

  语法:

  例子:

   var arr = ["王一","王二","王三"];

    var result1 = arr.shift();
    console.log(resu1t1); //打印结果:王一
    console.log(JSON.stringify(arr)); //打印结果: ["王二", "王三"] 

  03、数组的常见方法

  slice()

  slice():从数组中提取指定的一个或者多个元素,返回结果为新的数组(不会改变原来的数组)。

  PS:该方法不会改变原数组,而是将截取到的元素封装到一个新数组中返回。

  语法:

  例子:

   var arr = ["a", "b", "c", "d", "e", "f"];

    var result1 = arr.slice(2); //从第二个值开始提取
    var result2 = arr.slice(-2); //提取最 后两个元素
    var result3 = arr.s1ice(2,4); //提取从第二个到第四个之间的值(不包括第四个值)
    var result4 = arr.s1ice(4,2); //空
    console.log("arr:" + JSON.stringify(arr));
    console.log("resu1t1:" + JSON.stringify(resu1t1));
    console.log("resu1t2:" + JSON.stringify(result2));
    console.log("resu1t3:" + JSON.stringify(result3));
    console.log("resu1t4:" + JSON.stringify(resu1t4));

  补充:

  很多前端人员会使用slice()将伪数组转化为真数组,写法如:

   array = Array.prototye.slice.ca11 (arrayLike)

    或者
    array = [].slice.call(arrayLike)

  但在ES6中有一个新的API来处理这种情况:(专门用来将伪数组转化成真数组)

   array = Array.from(arrayLike)

  splice()

  splice():从数组中添加/删除指定的一个或多个元素,返回结果为新的数组(会改变原来的数组)。

  备注:该方法会改变原数组,会将指定元素从原数组中删除;被删除的元素会封装到一个新的数组中返回。

  语法:

  上方语法中,第三个及之后的参数,表示:向原数组中添加新的元素,这些元素将会自动插入到开始位置索引|的前面。

  例1:

   var arr1= ["a", "b","c","d", "e", "f"];

    var result1 = arr1.splice(1); //从第 index为1的位置开始,删除元素
    console.log("arr1:"+ JSON.stringify(arr1)); //输出结果:["a"]
    console.log("resu1t1: " + JSON.stringify(result1));//输出结果:["b","c","d","e", "f"]

  例2:

   var arr2 = ["a","b","C","d","e","f"];

    var result2 = arr2.splice(-2); //删除最后两个元素
    console.log("arr2:"+ JSON.stringify(arr2)); //输出结果:["a","b","c","d"]
    console.log("resu1t2: " + JSON.stringify(resu1t2));//输出结果:["e","f"]

  例3:

   var arr3 = ["a","b","c","d","e","f"];

    var result3 = arr3.splice(1, 3); //从第index为1的位 置开始删除元素,一共删除三个元素
    console.log("arr3: " + JSON.stringify(arr3)); //输出结果:["a","e","f"]
    console.log("result3:"+ JSON.stringify(resu1t3));//输出结果:["b","c","d"]

  例4(第三个参数的用法):

   var arr4 = ["a", "b", "C", "d", "e", "f"];

    //从第index为1的位置开始删除元素,一共删除三个元素。并且在index=1 的前面追加两个元素
    var resu1t4 = arr4.splice(1, 3,"千古壹号","vae");
    console.log("arr4: "+JSON.stringify(arr4));//输出结果:["a","千古壹号","vae","e","f"]
    console.log("resu1t4: " + JSON.stringify(resu1t4));//输出结果:["b", "C", "d"]

  concat()

  concat():连接两个或多个数组,返回结果为新的数组。 (不会改变原数组)

  语法:

  例子:

   var arr1 = [1,2,3];

    var arr2 = ["a","b","c"];
    var arr3 = ["千古壹号","vae"];
    var result1 = arr1.concat(arr2);
    var result2 = arr2.concat(arr1,arr3);
    console.log("arr1 =" + JSON.stringify(arr1));//输出结果:[1,2,3]
    console.log("arr2 =" + JSON.stringify(arr2));//输出结果:["a","b","c"]
    console.log("arr3 =" + JSON.stringify(arr3));//输出结果:["千古壹号","vae"]
    console.log("resu1t1 =" + JsoN.stringify(result1));//输出结果:[1,2,3,"a","b","c"]
    console.log("resu1t2 =" + JSON.stringify(result2));//输出结果:["a","b","c",1,2,3,"千古壹号","vae"]

  从打印结果中可以看到,原数组并没有被修改。

  join()

  join():将数组转换为字符串,返回结果为转换后的字符串(不会改变原来的数组)。

  js 多维数组删除元素_js数组删除元素remove_js删除数组中的空元素

  PS: join()方法可以指定一个字符串作为参数,这个字符串将会成为数组中元素的连接符;如果不指定连接符,则默认使用,作为连接符,此时和toString()的效果是一致的。

  语法:

  例子:

   var arr = ["a", "b", "c"];

    var result1 = arr.join(); //这里没有指定连接符,所以默认使用作为连接符
    console.log(result1) //输出结果: a,b,c
    var result2 = arr.join("-"); //使用指定连接符
    console.log(result2) //输出结果: a-b-c
    var result3 = arr.join(""); //使用指定连接符
    console.log(result3) //输出结果: abc

  reverse()

  reverse():反转数组,返回结果为反转后的数组(会改变原来的数组)。

  语法:

  例子:

   var arr = ["a", "b", "c", "d", "e", "f"];

    var result = arr.reverse(); //将数组arr进行反转
    console.log("arr =" + JSON.stringify(arr)); //输出["f","e","d","c","b","a"]
    console.log("result =" + JSON.stringify(result));//输出["f","e","d","C", "b","a"]

  从打印结果可以看出,原来的数组经被改变了。

  sort()方法

  sort(): 对数组的元素进行从小到大来排序(会改变原来的数组)。

  sort()方法举例:

  例子:

   var arr3=[5,2,11,3,4,1];

    //自定义排序规则
    var result = arr3.sort(function(a, b) {
        if (a>b){ //如果a大于b,则交换a和b的位置
            return 1;
        }elseif(a 2) {
        return false;
        }    
        return true;
    });
    console.log(bool2); //输出结果, true. 因为每个元素的长度都是两个字符。

  some()方法

  some() : 对数组中每一项运行回调函数,只要有一项返回true,则停止遍历,此方法返回true。

  注意: some()方法的返回值是boolean值。

  reduce()方法

  reduce():为数组中的每一个元素,依次执行回调函数。

  语法:

   arr.reduce(

        function(previousValue, item, index, arr) {
    },initialvalue)

  参数解释:

  PS:如果能熟练使用reduce的用法,将能替代很多其他的数组方法。

  例子:

   var arr=[2,0,1,9,6];

    var sumValue = arr.reduce (function(total, item) { //计算 arr数组中,所有元素项的综合
        return total + item;
    },0);
    console.log('sumvalue:' + sumvalue); //打印结果: 18

  05、数组的其他方法

  indexOf()和lastIndexOf:获取数据的索引

  语法:

   索引值 = 数组.indexof(value);

    索引值 = 数组.lastIndexof(value);

  解释:

  作用:

  利用这个方法,我们可以判断某个值是否在指定的数组中。如果没找到则返回-1。

  例1:

   var arr = ["a", "b","C","d","e","d","c"];

    console.log(arr.indexOf("c"));//从前往后,找第-一个"c"在哪个位置
    console.log(arr.lastIndexOf("d"));//从后往前,找第一个"d"在哪个位置

  例2(判断某个值是否在数组中):

   var arr = [" 29926392220","29965620629","28003663436","28818504366"];

    var str=[
    {name:"smyh", id: "12334"},
    {name:"vae", id: "28818504366"}
    ];
    str.filter(item => {
        return arr.indexof(item.id)!=-1;
    })

  find()

  语法:

  作用:找出第一个满足[指定条件返回true]的元素。

  PS:一旦找到符合条件的第一个元素 ,将不再继续往下遍历。

  例子:

   let arr=[2,3,2,5,7,6];

    let result = arr.find(function (item, index) {
        return item > 4; //遍历数组arr, 一旦发现有第一个元素大于4,就把这个元素返回
    });
    console.log(result); //打印结果: 5

  findIndex()

  语法:

  作用:找出第一个满足[指定条件返回true]的元索的index.

  例子:

   let arr=[2,3,2,5,7,6];

    let result = arr.findIndex(function (item, index) {
        return item > 4; //遍历数组arr, 一旦发现有第一个元素大于4,就把这个元素的index返回
    });
    console.log(result); //打印结果: 3

  Array.from()

  语法:

   array = Array.from(arrayLike)

  作用:将伪数组或可遍历对象转换为真数组。

  伪数组与真数组的区别:

  伪数组的原型链中没有Array.prototype,而真数组的原型链中有Array.prototype。因此伪数组没有pop、join等属性。

  Array.of()

  语法:

  作用:将一系列值转换成数组。

  例子:

   let arr = Array.of(1,abc,true);

    console.log(arr);

  06、other

  isArray():判断是否为数组

  以前,我们会通过A instanceof B来判断A是否属于B类型。但是在数组里,这种instanceof方法已经用的不多了,因为有下面isArray()方法。

  toString():数组转换字符串

  作用:把数组转换成字符串,每项用,分割。

  valueOf():返回数组本身

  这个方法的意义不大。因为我们指直接写数组对象的名字js 多维数组删除元素,就已经是数组本身了。

文章由官网发布,如若转载,请注明出处:https://www.veimoz.com/1976
0 评论
359

发表评论

!