美文网首页
JavaScript数组详解(Array)(二)

JavaScript数组详解(Array)(二)

作者: 任建坤123 | 来源:发表于2019-07-08 01:52 被阅读0次

今天整理了一些数组转字符串,字符串转数组的方法,还有改变数组和不改变数组的方法,希望和大家分享一下,可能不全,大家勿怪。

数组转字符串

    toString() 方法 (会改变原数组)

    var arr = [1, 2, 3, 4, 5];
    var arr1 = arr.toString();
    console.log(arr1); //'1, 2, 3, 4, 5'  结果是字符串

    var arr = ['a','b','c','d','f']
    var arr1 = arr.toString();
    console.log(arr1); //'a,b,c,d,f'  结果是字符串

    var arr = ['a','b','c','d','f','undefined'] //'undefined'加引号 
    var arr1 = arr.toString();
    console.log(arr1); //'a,b,c,d,f,undefined'  结果是字符串,

    var arr = ['a', 'b', 'c', 'd', 'f', undefined] //  undefined不加引号,有 但为空
    var arr1 = arr.toString();
    console.log(arr1); //'a,b,c,d,f,'  结果是字符串, 最后一项为空

    var arr = ['a', 'b', 'c', 'd', 'f', undefined,null] //  undefined和null不加引号,有 但为空
    var arr1 = arr.toString();
    console.log(arr1); //'a,b,c,d,f,,'  结果是字符串, 但后面两项值为空

    toLocaleString() 方法 (会改变原数组)

    var arr = [1, 2, 3, 4, 5];
    var arr1 = arr.toLocaleString();
    console.log(arr1); //'1, 2, 3, 4, 5 ' 结果是字符串

    var arr = ['a', 'b', 'c', 'd', 'f']
    var arr1 = arr.toLocaleString();
    console.log(arr1); //'a,b,c,d,f'  结果是字符串

    join  方法 (会改变原数组)

    var arr = [1, 2, 3, 4, 5];
    var arr1 = arr.join('');
    console.log(arr1);   //'1, 2, 3, 4, 5'  结果是中间以逗号隔开的字符串

    var arr = [1, 2, 3, 4, 5];
    var arr1 = arr.join('|');
    console.log(arr1);   //'1|2|3|4|5'  结果是中间被|隔开的字符串

    var arr = [1, 2, 3, 4, 5,undefined];
    var arr1 = arr.join('');
    console.log(arr1); //'12345'  结果是字符串,undefined 为空

    var arr = [1, 2, 3, 4, 5, null];
    var arr1 = arr.join('');
    console.log(arr1); //'12345'  结果是字符串 null 为空

字符串转数组

     split 方法 (会改变原数组)

    var str='123,456,789';
    var str1=str.split('');
    console.log(str1) // ["1", "2", "3", ",", "4", "5", "6", ",", "7", "8", "9"]

    var str='123,456,789';
    var str1=str.split(',');
    console.log(str1) // ["123", "456", "789"]

    var stra='wwwwwwwww';
    var strb=stra.split('');
    console.log(strb); //  ["w", "w", "w", "w", "w", "w", "w", "w", "w"]

    var stra='wwwwwwwww';
    var strb=stra.split('|');
    console.log(strb); //  ["w", "w", "w", "w", "w", "w", "w", "w", "w"]

改变原数组的方法

    splice 方法 改变原数组,向数组的中部插入元素

    var arr = [1, 2, 3, 4, 5, 6];
    var arr1 = arr.splice(1, 2);
    console.log(arr1); // [2, 3]

    var arr = [1, 2, 3, 4, 5, 6];
    var arr1 = arr.splice(-2);
    console.log(arr1); // [5, 6] 从下标为-1的元素开始,向前截取1个,包括包括下标为-1的元素本身

    var arr = [1, 2, 3, 4, 5, 6, 7, 8];
    var arr1 = arr.splice(0, -2);
    console.log(arr1); // 结果为空,因为下标没有负的,所以找不到

    var arr = ['qw', 'qwe', 'wer', 'we', 'www', 'ttt'];
    var arr1 = arr.splice(3, 0);
    console.log(arr1); // 结果为空,因为是从下标第三个开始,截取0个

    var arr = ['aa', 'bb', 'cc', 'dd', 'ee'];
    var arr1 = arr.splice(1, 0, 'sss', 'qwer');
    console.log(arr); // ["aa", "sss", "qwer", "ee"]  因为下标设的为0,所以没有截取,
                     //只是插入 'sss' 'qwer'

    var arr = ['aa', 'bb', 'cc', 'dd', 'ee'];
    var arr1 = arr.splice(1, 3,'sss','qwer');
    console.log(arr); // ["aa", "sss", "qwer", "ee"]  从下标1开始截取3个,并插入 'sss' 'qwer'

    var arr = ['aa', 'bb', 'cc', 'dd', 'ee', 'ff'];
    var arr1 = arr.splice(3);
    console.log(arr1); // ["dd", "ee", "ff"]  从下标为3的元素开始,一直往后截取,并返回新的数组


    slice() 方法     可提取字符串或者数组的某个部分,并以新的字符串或数组返回被提取的部分。

    var arr = [1, 2, 3, 4, 5];
    var arr2 = arr.slice(3);
    console.log(arr2); // [4, 5]  从下标为3的元素开始往后截取,返回截取的新数组,也可以是字符串

    var arr = [1, 2, 3, 4, 5];
    var arr2 = arr.slice(1, 4);
    console.log(arr2); // [2, 3, 4]

    var arr = ['1', '2', '3', '4', '5'];
    var arr2 = arr.slice(1, 0);
    console.log(arr2); // 没有,因为从下标为1的元素开始,截取0个

    var arr = ['a', 's', 'd', 'f', 'g'];
    var arr2 = arr.slice(0, 1);
    console.log(arr2); // ["a"]  从下标为0的元素开始,截取1个

    var arr = ['a', 's', 'd', 'f', 'g'];
    var arr1 = arr.slice(2, -1);
    console.log(arr1); //["d", "f"]  从下标为-1的元素开始,向前截取2个,不包括下标为-1的元素本身

    var arr = ['a', 's', 'd', 'f', 'g'];
    var arr1 = arr.slice(-1);
    console.log(arr1); //['g']  从下标为-1的元素开始,向前截取1个,包括包括下标为-1的元素本身



    pop 方法  改变原数组的length,删除新数组中的最后一个元素。

    var arr = [1, 2, 3, 4, 5, 6];
    var arr1 = arr.pop();
    console.log(arr); // [1, 2, 3, 4, 5]
    console.log(arr1); // 6 返回新数组的长度

    var arr = ['223', '232', '233'];
    var arr1 = arr.pop();
    console.log(arr); //["223", "232"]

    var arr = [2, 3, 4, 5, 6, 7, 8];
    var arr1 = arr.pop();
    console.log(arr); //[2, 3, 4, 5, 6, 7]

    var arr = [3, 4, 5, 6, 7];
    var arr1 = arr.pop();
    console.log(arr); //[3, 4, 5, 6]

    var arr = ['aaa', 'bbb', 'ccc'];
    var arr1 = arr.pop();
    console.log(arr); // ["aaa", "bbb"]


    push 方法  改变原数组的length,在新数组末尾添加一个或多个元素。

    var arr = [1, 2, 3, 4, 5, 6];
    var arr1 = arr.push('aa', 'bb');
    console.log(arr); //[1, 2, 3, 4, 5, 6, "aa", "bb"]
    console.log(arr1); // 8  返回新数组的长度

    var arr = [1, 2, 3, 4];
    var arr1 = arr.push(123);
    console.log(arr); //[1, 2, 3, 4, 123]

    var arr = [1, 2, 3, 4];
    var arr1 = arr.push('aaa');
    console.log(arr); //[1, 2, 3, 4, "aaa"]

    var arr = ['aa', 'bb', 'cc', 'dd'];
    var arr1 = arr.push('qw', 'er');
    console.log(arr); //["aa", "bb", "cc", "dd", "qw"]

    unshift 方法  在数组的前端添加任意个项并返回新数组的长度

    var arr = ['aa', 'bb', 'cc', 'dd'];
    var arr1 = arr.unshift('qw', 'er');
    console.log(arr1); // 6  新数组的长度length
    console.log(arr); // ["qw", "er", "aa", "bb", "cc", "dd"]  返回的新数组

    var arr = [1,2,3,4,5,6,7,8]
    var arr1 = arr.unshift('qw', 'er');
    console.log(arr1); // 10  新数组的长度length
    console.log(arr); // ["qw", "er", 1, 2, 3, 4, 5, 6, 7, 8]  把unshift后面的值推入新数组的最前端



    shift 方法 从数组的前端移除第一项下标为0的元素,减少数组的length值,然后返回被移除的项。

    var arr = [1,2,3,4,5,6,7,8]
    var arr1 = arr.shift();
    console.log(arr1); // 1  被删除的成为一个新的数组
    console.log(arr); // [2, 3, 4, 5, 6, 7, 8]  从数组的前端移除第一项下标为0的元素,
                      //减少数组的length值

    var arr = ['qq',2,3,4,5,6,7,8]
    var arr1 = arr.shift('qw', 'er');  //并不能插入数组元素
    console.log(arr1); // 'qq'  被删除的成为一个新的数组
    console.log(arr); // [2, 3, 4, 5, 6, 7, 8]  

    var arr = ['ss','ww','ee','rr','aa']
    var arr1 = arr.shift('qw', 'er');  //并不能插入数组元素
    console.log(arr1); // 'ss'  被删除的成为一个新的数组
    console.log(arr); // ["ww", "ee", "rr", "aa"]       

    reverse()方法 反转数组项的顺序。

    var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
    arr.reverse();
    console.log(arr);//[9, 8, 7, 6, 5, 4, 3, 2, 1]  顺序反转,返回值都是经过排序后的数组

    var arr = ['1', '2', '3', '4', '5', '6', '7', '8', '9'];
    arr.reverse();
    console.log(arr);//["9", "8", "7", "6", "5", "4", "3", "2", "1"]  顺序反转,
                      //返回值是经过排序后的数组

    var arr = ['qwqw', 'dasd', 'vxv', 'gdg', 'hfg', 'dfgr', 'dfgdfg', 'dfgdh', 'ku'];
    arr.reverse();
    console.log(arr);  // ["ku", "dfgdh", "dfgdfg", "dfgr", "hfg", "gdg", "vxv", "dasd", "qwqw"]
                                //  顺序反转,返回值是经过排序后的数组


    var arr=[1,2,3,4,5,6,7,8,9]
    function myReverse(array){
        var arr1=[];
        var len=array.length
        for(var i=0;i<len;i++){
            arr1.unshift(array[i]);
        }
        return arr1;
    }
    console.log(myReverse(arr)); // [9, 8, 7, 6, 5, 4, 3, 2, 1] 


    sort()方法   排序:调用每个数组项的toString()转型方法,然后比较得到的字符串,来确定顺序。

    var arr = [12, 23, 434, 54, 67, 3, 4, 0];
    arr.sort();
    console.log(arr); // [0, 12, 23, 3, 4, 434, 54, 67] 先比较第一位,再比较第二位,
                     //依次来确定大小顺序

    var arr = [12, 23, 434, 54, "a", 3, 'sss', 0];
    arr.sort();
    console.log(arr); // [0, 12, 23, 3, 434, 54, "a", "sss"] 先比较第一位,再比较第二位,
                       //依次来确定大小顺序

    var arr = [1, 23, 43, 44, 54, 564, 77, 88, 78];
    arr.sort(function (a, b) {
        return a - b;
        return b - a;
    })
    console.log(arr); // [1, 23, 43, 44, 54, 77, 78, 88, 564]

不改变原数组的方法

    indexOf() 方法 返回某个指定的字符串值或者某个数组元素值首次出现的位置(正向搜索)

    var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
    console.log(arr.indexOf()); // -1  indexOf后面没有给值的时候返回的时候就找不到,返回-1

    var arr = ['a', 'b', 'c', 'd', 'a', 'c', 'd', 'd', 'a'];
    console.log(arr.indexOf('c')); // 2   找到c第一次出现的位置所对应的索引值



    var arr = ['2', '3', '1', '4', '3', '2', '4', '2', '1'];
    console.log(arr.indexOf('2', 3)); // 7   下标3开始往后'2'第一次出现的位置对应的下标

    lastIndexOf() 方法 返回某个指定的字符串值或者某个数组元素值最后出现的位置(逆向搜索),
    方法用法和indexOf()一样。

    var arr = ['a', 'b', 'c', 'd', 'a', 'c', 'd', 'd', 'a'];
    console.log(arr.lastIndexOf('c',4)); // 2  倒数第4个开始往前找 正向最后一次'c'出现的位置


    var arr = [1, 2, 3, 4, 3, 2, 4, 1, 3, 4, 2];
    console.log(arr.lastIndexOf(3, 5)); // 4  倒数第5个开始往前找 正向最后一次3出现的位置


    //concat 方法  连接多个数组,不改变原数组。
    var arr = ['123'];
    var arr1 = ['456'];
    var arr2 = ['789'];
    console.log(arr.concat(arr1, arr2)); //["123", "456", "789"]

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

    var arr = ['aaa', 'bbb', 'ccc'];
    var arr1 = ['ddd'];
    var arr2 = ['fff'];
    console.log(arr.concat(arr1, arr2)); // ["aaa", "bbb", "ccc", "ddd", "fff"] 

    every() 对数组的每一项运行给定函数,如果该函数对每一项都返回true,则返回true。否则返回false

    var arr = [1, 2, 3, 4, 5];
    var arr1 = arr.every(function(item, index, array){
             return (item > 2);  }); 
    console.log(arr1);    //false 

    var arr = [1, 2, 3, 4, 5];
    var arr1 = arr.every(function(item, index, array){
             return (item > 0);  }); 
    console.log(arr1);    //true 

    some() 方法 对数组的每一项运行给定函数,如果该函数对任一项返回true,则返回true。否则返回false

    var arr = [1, 2, 3, 4, 5];
    var arr1 = arr.some(function (item, index, array) {
        return (item > 2);
    });
    console.log(arr1); //true 

    var arr = [1, 2, 3, 4, 5];
    var arr1 = arr.some(function (item, index, array) {
        return (item > 0);
    });
    console.log(arr1); //true 

    var arr = [1, 2, 3, 4, 5];
    var arr1 = arr.some(function (item, index, array) {
        return (item > 5);
    });
    console.log(arr1); //flase 

    filter() 方法 对数组的每一项运行给定函数,返回该函数会返回true的项组成的数组。

    var arr = [1, 2, 3, 4, 5, 4, 5, 6, 2];
    var arr1 = arr.filter(function (item, index, array) {
        return (item >2);
    });
    console.log(arr1); // [3, 4, 5, 4, 5, 6]  大于2的数会组成一个新的数组

    var arr = [1, 2, 3, 4, 5, 4, 5, 6, 2];
    var arr1 = arr.filter(function (item, index, array) {
        return (item > 8);
    });
    console.log(arr1); // 没有 空数组  大于8的没有

    map() 方法  对数组的每一项运行给定函数,返回每次函数调用的结果组成的数组。(返回运算过后的新的数组)

    var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
    var arr1 = arr.map(function (item, index, array) {
        return (item +1);
    });
    console.log(arr1); // [2, 3, 4, 5, 6, 7, 8, 9, 10] 数组中的每一项都加1,然后返回成为一个新的数组。

    var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
    var arr1 = arr.map(function (item, index, array) {
        return (item *10);
    });
    console.log(arr1); // [10, 20, 30, 40, 50, 60, 70, 80, 90] 数组中的每一项都乘以10,
                        //然后返回成为一个新的数组。

    forEach() 方法 对数组的每一项运行给定函数。该方法没有返回值。

    var arr = [1, 2, 3, 4, 5, 4, 3, 2, 1];
    var arr1 = arr.forEach(function (item, index, array) {
        //可以执行某些操作/运算
        console.log(arr1) //undefined      
        //不能返回值
    });

    reduce()  是从数组的第一项开始,逐个遍历到最后

    var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
    var arr1 = arr.reduce(function (prev, cur, index, array) {
        return prev + cur;   //prev是前一项,cur是当前项
    });
    console.log(arr1); //55 数组元素的和

    var arr = [2312, 3234, 4342, 656, 76756, 8786, 978, 0898, 76867, 34534];
    var arr1 = arr.reduce(function (prev, cur, index, array) {
        return prev + cur;
    });
    console.log(arr1); //209363 数组元素的和

    reduceRight() 方法   是从数组的最后一项开始,逐个遍历到最前(跟reduce()相反,不过用法一样)

    var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
    var arr1 = arr.reduce(function (prev, cur, index, array) {
        return prev + cur;  //prev 变成最后一项,cur则成了倒数第二项
    });
    console.log(arr1); //55 数组元素的和

    var arr = [2312, 3234, 4342, 656, 76756, 8786, 978, 0898, 76867, 34534];
    var arr1 = arr.reduce(function (prev, cur, index, array) {
        return prev + cur;
    });
    console.log(arr1); //209363 数组元素的和

好了,今天就暂时到这里了,想知道更多的可以点个关注,

愚才疏学浅,故难免错漏,敬请海涵,还望不吝指出,万分感激!!!

相关文章

  • JavaScript数组详解(Array)(二)

    今天整理了一些数组转字符串,字符串转数组的方法,还有改变数组和不改变数组的方法,希望和大家分享一下,可能不全,大家...

  • Math、数组、Date

    JavaScript判断变量是否为数组的方法(Array)Javascript中的apply与call详解JS核心...

  • JavaScript数组详解(Array)(一)

    首先我们要了解什么是数组,也就是数组的定义是什么? 数组就是: 值的有序集合,每个值叫做一个元素,每元素在数组中都...

  • JS基础整理 - 2

    1 JavaScript Array(数组)对象 ![Array(数组)对象.png](http://upload...

  • JavaScript数组的映射

    JavaScript中数组的常用操作之数组的映射 Array.map()方法 Array.from(array[,...

  • JavaScript查找数组

    JavaScript中数组的常用操作之查找数组 Array.includes() 方法 array.include...

  • 二维数组中的查找(Javascript编程) function Find(target, array){ // w...

  • js数组方法大全

    JavaScript中创建数组有两种方式 (一)使用 Array 构造函数: (二)使用数组字面量表示法: 数组的...

  • js数组方法大全

    js数组方法大全 JavaScript中创建数组有两种方式(一)使用 Array 构造函数: (二)使用数组字面量...

  • JavaScript数组的连接

    JavaScript中数组的常用操作之数组的连接 Array.concat() 方法 Array.concat(a...

网友评论

      本文标题:JavaScript数组详解(Array)(二)

      本文链接:https://www.haomeiwen.com/subject/rknwhctx.html