zoukankan      html  css  js  c++  java
  • javascript常见方法汇总之一——数组字符串相关

    (转载至慕课网)

    原文链接:https://www.imooc.com/article/46933

    github地址:https://github.com/dorseysen/notes-about-javascript-methods/blob/master/about-string-and-array.html

      1 <!DOCTYPE html>
      2 <html lang="en">
      3 <head>
      4     <meta charset="UTF-8">
      5     <title>Title</title>
      6 </head>
      7 <body>
      8 <script>
      9     //数组字符串操作的常见方法:
     10     //这次呢先这么多,基本常见的都在这了
     11     /**
     12      * 1、split : 将字符串转化为数组           (单词译为:使分离)
     13      * 2、join : 数组重组为字符串              (单词译为:连接)
     14      * 3、reserve : 数组里所有元素顺序倒置     (单词译为:储备)
     15      * 4、slice :数组或字符串片断截取          (单词译为:切片)
     16      * 5、splice : 数组增删元素                (单词译为:拼接)
     17      * 6、sort : 数组元素排序                  (单词译为:分类)
     18      * 7、concat :用于连接两个或多个数组  (单词译为:合并多个数组或字符串,联结)
     19      * 8、shift :删除原数组中的第一项,并返回删除元素的值
     20      * 9、unshift : 将参数添加到原数组开头      (shift和unshift这两个其实比较鸡肋,且存在着低版本如ie6返回值不准确问题)
     21      * 10、push : 比较常见的方法,用于在数组末尾添加元素   (单词译为:堆栈)
     22      * */
     23     //1、split(reg);  //把字符串转换为数组,传入的参数是一个匹配单元,字符串会根据这个匹配单元把字符串切割成一份份并形成一个数组
     24     let str0 = "my name is dorsey!";
     25     console.log(str0.split(''));// ['m','y',' ','n','a','m','e',' ','i','s',' ','d','o','r','s','e','y','!'];注意的是空格也是字符
     26     console.log(str0.split(' ')); //["my","name","is","dorsey!"]
     27     //2、join(reg);//相对于上面的拆,这里是重组,即把数组重新连接成字符串,原理一致,参数也是一个匹配单元,需注意的是join是数组的一个属性
     28     let arr0 = ["my","name","is","dorsey!"];
     29     console.log(arr0.join('-')); //传入“-”连接符号 my-name-is-dorsey!
     30     console.log(arr0.join(' ')); //传入“ ”空格连接符 my name is dorsey! 空格也是符号,空格灾难地狱也是因为程序员的粗心导致的
     31     //3、reverse(); 数组的一个对象,作用是将数组中的元素倒置
     32     let arr1 = ["my","name","is","dorsey!"];
     33     console.log(arr1.reverse());["dorsey!","is","name","my"]; //倒过来
     34     // 1-2-3上面综合小案例
     35     let str1 = "我是一名中国人!";
     36     console.log(str1.split('').reverse().join(''));
     37     //4、slice(start,end); 字符串或数组切取,截取
     38     let str2 = "my name is dorsey!";
     39     console.log(str2.slice(3,7)); //截取这段字符串中的第4~第7 即4,5,6,7这几个字符
     40     let arr2 = ["my","name","is","dorsey!"];
     41     console.log(arr2.slice(1, 3)); //也可以用于数组,切取是数组的第2~3个元素
     42     //5、splice(index,howmany,item1,item2...):数组增删元素,后面的item是要添加的项目,并从index位置开始添加,index是从哪开始删除,howmany是要删除的个数
     43     let str3 = ["my","name","is","dorsey!"];
     44     str3.splice(2,2); //从str3[2]开始删除,删除2个,即"is" 和 "dorsey!"
     45     console.log(str3);//["my","name"]
     46     let arr3 = ["my","name","is","dorsey!"];
     47     arr3.splice(2,0,2);//只添加项目就设置howmany值为零,这样它就删除0个,只添加
     48     console.log(arr3);//["my","name",2,"is","dorsey!"];
     49     //6、sort():对数组元素进行排序,注意这里的是以ASCLL码表做排序,且比对的是字符串的形式,比如415跟6,415会让4跟6比对,4在前,所以415比6前
     50     let arr4 = [1,2,6,3,'b','baoh',457,712,41,62,"a","A",''];
     51     //比如这里的A是排在65,a是排在97,而0~9的ascll码序号则是是从48开始到57结束,所以数字排在字母之前,而之所以是根据这个表是因为C语言而来的
     52     arr4.sort();
     53     console.log(arr4);//[1, 2, 3, 312, 41, 457, 6, 62, "A", "a"]
     54     //准确的说是Unicode码,即在ascll码的基础上拓展了一些新字符,比如汉字的二进制存储,这里可以不用管,不知道为什么A排在a之前的可以去查一查
     55     //这样的sort虽然具备拓展性和通用性,但显然不是我们想要的,比如我的数组只有数字,我只要数字从小到大排序就好,怎么做呢?两个字,传参数
     56     let arr5 = [1,25,10,7,100,2560,13,-3281,-23,0];
     57     function mun1(a,b){
     58       return a-b;
     59     }
     60     console.log(arr5.sort(mun1));
     61     //7、concat():合并多个数组,既可以几个数组来,也可以直接传一个字符串,会被当成数组的一个
     62     let arr6 = ["my","name","is","dorsey!"];
     63     let arr7 = ["I'm","from","China.",["你好啊","hello"]]; //这里数组里放数组我只是需要让你直观的确认concat实际上只处理了两层,但够了。
     64     console.log(arr6.concat(arr7));     //["my", "name", "is", "dorsey!", "I'm", "from", "China."];
     65     console.log(arr6.concat('dahids')); //["my", "name", "is", "dorsey!", "dahids"]
     66     //8、shift():删除数组第一项的值,返回删除元素的值
     67     let arr8 = ["my","name","is","dorsey!"];
     68     console.log(arr8.shift()); //my
     69     console.log(arr8); //["name", "is", "dorsey!"]
     70     //9、unshift():将参数添加到原数组开头,且返回新数组的长度,注意的是部分浏览器返回结果有误,如ie6还有firefox2.0
     71     let arr9 = ["my","name","is","dorsey!"];
     72     arr9.unshift('呵呵!', 'hello');
     73     console.log(arr9);
     74     //10、push():将参数添加到原数组末尾,比较常用
     75     let arr10 = ["my","name","is","dorsey!"];
     76     arr10.push('呵呵!', 'hello');
     77     console.log(arr10);
     78     //1、split函数内部实现,join函数实现实际上是差不多的
     79     //实际上它的内部应该是这样实现的:为了简化函数及方便理解,而split是作为一个属性存在于String这个对象里,
     80     //这里咱只是把要切成数组的字符串当参数传进来,为了方便直观我就不封在数组对象里了,一样的其实
     81     //另外呢,由于我也没看过底层源码是怎样的,实际上肯定有更高级巧妙的方式,特别这个while()函数最好少用,不过整体思路应该差不多,下同
     82     let Split = function(string,str){
     83       let rule = new RegExp(str),
     84           accept = [], //
     85           str0 = string; //为了不影响原字符串,缓存一下
     86       //这里的切取一般得是用C/C++的for循环一个个字符去遍历,这里直接用了slice,只是大致看看里面是怎么走的
     87       while(1){
     88         if(rule.test(str0) && str !== ''){
     89           accept.push(str0.slice(0,str0.indexOf(str)));
     90           str0 = str0.slice((str0.indexOf(str)+str.length),str0.length);
     91         }
     92         else {
     93           if(str === '' ) {
     94             for(let i = 0; i < str0.length; i ++ ){
     95               accept.push(str0[i]);
     96             }
     97             break;
     98           }
     99           else{
    100             accept.push(str0);break;
    101           }
    102         }
    103       }
    104       return accept;
    105     }
    106     console.log(Split(str0,''));
    107     console.log(str0.split(''));
    108     //3、函数reverse内部实现,实际上应该是有更好的办法的,这里我们了解下原理即可
    109     let Reverse = function(arr){
    110       let accept = [];
    111       for(let i = 0;i < arr.length;i++){
    112         accept[i] = arr[arr.length-1-i];
    113       }
    114       return accept;
    115     }
    116     console.log(Reverse(arr2));
    117     console.log(arr2.reverse());
    118     //4、slice函数内部实现:为了方便直观我就不封在数组或字符串对象里了,一样的其实
    119     let Slice = function(start,end,val){
    120         let accept;
    121         if(typeof(val) === "string"){
    122             accept = '';
    123             for(let i = start;i < (end > val.length ? val.length : end ); i++){
    124               accept += val[i];
    125             }
    126         }
    127         else {
    128             let j = 0;
    129             accept = [];
    130             for(let i = start;i < (end > val.length ? val.length : end ); i++){
    131               accept[j] = val[i];
    132               j++;
    133             }
    134         }
    135         return accept;
    136     }
    137     console.log(Slice(3, 100, str2));
    138     console.log(str2.slice(3, 100));
    139     console.log(Slice(2, 8, arr2))
    140     console.log(arr2.slice(2, 8));
    141     //6、sort方法实现:为了方便直观我就不封在数组对象里了,一样的其实,从它的实际应用来看应该内部逻辑很复杂,为了简化,我们
    142     //只考虑了纯数字的排序,也不考虑用函数作为参数来传参,咱考虑正序和逆序即可
    143     //注意!注意!注意!这里的排序只对数字有效
    144     let Sort = function(arr,order){ //order只有StoL和LtoS,StoL代表正序(小-大),LtoS代表倒序(大-小)
    145         let accept = arr,mid;
    146       if(accept.length > 1){
    147           for(let i = 1; i < accept.length; i ++ ){
    148             for(let j = 0; j < i; j ++ ){
    149               if((accept[i] < accept[j] && order === 'StoL') || (accept[i] > accept[j] && order === 'LtoS')){ //满足条件则交换位置
    150                 mid = accept[i]; //这里如果是纯number类型的,可以不用新增寄存器(变量mid)
    151                 accept[i] = accept[j];
    152                 accept[j] = mid; // mid中间值
    153               }
    154             }
    155           }
    156         }
    157         return accept;
    158     }
    159     // //基本sort排序
    160     let sortTest = [1,25,10,7,100,2560,13,-3281,-23,0];
    161     console.log(Sort(sortTest,'LtoS'));
    162     //7、concat方法实现:为了方便直观我就不封在数组对象里了,一样的其实
    163     let Concat = function(){
    164         let accept = [];
    165         for(let i = 0; i < arguments.length; i ++){
    166            if(typeof (arguments[i]) !== "string"){
    167              for(let j = 0; j < arguments[i].length; j++){
    168                accept.push(arguments[i][j]);
    169              }
    170            }
    171            else {
    172              accept.push(arguments[i]);
    173            }
    174         }
    175         return accept;
    176     }
    177     console.log(Concat(arr6, 'dasoai','dsaoidha','我去你妹的')); //两者输出结果一致
    178     console.log(arr6.concat('dasoai','dsaoidha','我去你妹的')); //["my", "name", "is", "dorsey!", "dasoai", "dsaoidha", "我去你妹的"]
    179     //8、shift方法实现 :删除数组第一个元素
    180     let Shift = function(arr){
    181       let firstVal = arr[0];
    182         for(let i = 0; i < arr.length-1; i++){
    183           arr[i] = arr[i + 1];
    184         }
    185         arr.length -=1;
    186         return firstVal;
    187     }
    188     let shiftTest = [1,25,10,7,100,2560,13,-3281,-23,0];
    189     console.log(Shift(shiftTest)); //返回第一个元素
    190     console.log(shiftTest); //删除了第一个元素的数组
    191     //9、unshift方法实现 : 将参数添加到数组开头
    192     let Unshift = function(arr){
    193       arr.length += arguments.length-1;
    194       for(let i = arr.length;i > arguments.length-1; i --){
    195         arr[i-1] = arr[i-arguments.length];
    196       }
    197       for(let i = 0 ; i < arguments.length-1 ; i ++){
    198         arr[i] = arguments[i+1];
    199       }
    200       return arr.length;
    201     }
    202     let unshiftTest = [1,25,10,7,100,2560,13,-3281,-23,0];
    203     console.log(Unshift(unshiftTest,"hello","world")); //返回新数组长度12
    204     console.log(unshiftTest); //返回新数组
    205     //10、push方法实现 : 将参数添加到数组末尾,与unshift的原理实质上是一致的
    206     let Push = function(arr){
    207       arr.length += arguments.length - 1;
    208       for(let i = 1; i < arguments.length ; i ++){
    209           arr[arr.length - arguments.length + i] = arguments[i];
    210       }
    211       return arr.length;
    212     }
    213     let pushTest = [1,25,10,7,100,2560,13,-3281,-23,0];
    214     console.log(Push(pushTest,"hello","world")); //返回新数组长度12
    215     console.log(pushTest); //返回新数组
    216 </script>
    217 </body>
    218 </html>
  • 相关阅读:
    寒假学习进度8
    寒假学习进度7
    寒假学习进度6
    寒假学习进度5
    寒假学习进度4
    寒假学习进度3
    寒假自学进度13
    Python引用某一文件的方法出现红色波浪线
    寒假自学进度11
    正则表达式(学习)
  • 原文地址:https://www.cnblogs.com/dorseych/p/9374364.html
Copyright © 2011-2022 走看看