• 字符串常用方法


                       整理一下关于字符串的常用方法:

      字符串类型在前端开发者看来是使用最频繁的类型之一,网站上可见的各种文案,几乎都是字符串或者数组类型的数据,我们经常需要使用的操作最多的就是以下几点:读取字符串、转换字符串、清空字符串、拼接字符串、截取字符串等

    ========(我们先来看一下Es6中最实用的一个模板字面量,后面会就使用率较高的字符串方法逐个分析。

    ----------模板字面量(从 ECMAScript 2015 开始,字符串字面量也可以称为模板字面量:)

    ----字符串不区分单引号‘ ’和双引号“ ”所有的字符串拼接都会识别,如果你的字符串比较长,可分行使用“+”来拼接。
    例如:
     
         let longString = "This is a very long string which needs " +
                            "to wrap across multiple lines because " +
                            "otherwise my code is unreadable.";
      
    console.log(longString);

      =>  "This is a very long string which needs to wrap across multiple lines because otherwise my code is unreadable."
    -----或者也可以使用   "" 来告诉浏览器,你需要继续写这个字符串,但需要保证 ""后面是没有任何符号或者是空格的;
    例如:
    let longString = "This is a very long string which needs 
    to wrap across multiple lines because 
    otherwise my code is unreadable.";
        console.log(longString)
    =>"This is a very long string which needs to wrap across multiple lines because otherwise my code is unreadable."
    -----以前,我们用单引号或双引号表示字符串。
    let a = '123'; //单引号
    
    let b = "123";//双引号
    -------现在,使用模板字面量反撇号` `。在实际开发中,这是经常都要用到的方法。
    let c = `123` //反撇号
     
    在字符串中使用反撇号,只需要加上转义符 ,这时中间的`,没有什么意义:
     
    let d = `12\`3` //字符串内插入反撇号的方式。  =》   "12`3"
    ------在多行字符串的使用价值:
     
    在没有模板字面量的时候,我们要实现多行字符串,必须用到换行符:
     
    let a = '123
    456';
    console.log(a);
    // 123 // 456
    -------------------使用模板字面量,就可以非常简单的实现需求。
    let a = `123
    456`;
    console.log(a)       //      123
                         //      456
     
    ---------------在模板字面量插入变量的方法。
     
        在原来的我们要在字符串中拼接变量,需要用‘+变量+’或者 + 来实现,而现在 而是使用${params}直接插入你需要添加到字符串的位置。这种方式也叫作字符串占位符。占位符支持互相嵌套模板字面量,强大吧。有了它,我们终于可以抛弃 + 拼接字符串的恶心做法了
     
    -------字符串和变量拼接:
    var str="lixiaoqing";
    console.log(`wo shi ${str}`)
    =》"wo shi lixiaoqing"
     
    -------变量和变量拼接:
    var str0="wo shi ";
    var str="lixiaoqing";
    console.log(str0
    +`${str}`) // wo shi lixiaoqing
    -------模板字面量的终极用法
     
    tag是一个方法,方法名你可以任意命名,这种写法被称作标签模板。
    function tag(literals, ...substitutions) {
        //literals是数组,第一个位置是"",第二个位置是占位符之间的字符串,在本例中是haha
        //substitutions是字符串中的模板字面量,可能多个
       
        //函数最终返回字符串 
    }  (此方法待完成)
    一、charAt() 根据下标查询/访问字符串的某个字符
     
         var str1="age";
          console.log(str1.charAt(2))    =>e
     
                还可以使用  [ ] 的形式来访问,中括号填写的是字符串的下标
     
         var str1="age";
          console.log(str1[2])           =>e
     
    二、字符串的比较">" , "<"  ,"==="  ,">=" ,"<=" ,"!=="
     
    1.字母字符串比较
         var str1="aa";
    var str2="bb";
    console.log(str1
    <str2) =>true 2.数字字符串比较(会比较两个数字的大小) var str1="10";
    var str2="15";
    var str3="10";
    console.log(str1
    <str2,str1===str3) =>true,true

    --------基本字符串和字符串对象的区别

    请注意区分 JavaScript 字符串对象和基本字符串值 . ( 对于 Boolean 和Numbers 也同样如此.)
    var s_prim = "foo";var s_obj = new String(s_prim);
    
    console.log(typeof s_prim);              // Logs "string"

    console.log(typeof s_obj); // Logs "object"
     
    三、字符串的长度 length
     
       
         var str="我爱你中国";
     
         console.log(str.length)    =>5
     
    四、charCodeAt(index) 返回表示给定索引的字符的Unicode的值。
     
    方法返回0到65535之间的 UTF-16 编码单元匹配 Unicode 编码单元整数,当charCodeAt()括号中没有值时,默认为0;当有参数时,查询的是字符串的索引值, index的值为一个大于等于 0,小于字符串长度的整数
     
    例:
         var  str="abc";
          console.log(str.charCodeAt())           =》97
     
          var  str="abc";
          console.log(str.charCodeAt(0))          =》97
     
    结果都是一样的,查询到"a"在编码中的位置为97
     
     
         var  str="abc";
          console.log(str.charCodeAt(1))          =》98
     
          字母"b"在编码中的位置为98
    五、str.concat(str1,str2....)字符串拼接
     
    
    在字符串拼接中,最常用的还是“+”;
    
         var str="d";
         var str1="e";
         var str2="f";
         var str3=str+str1+str2;
         console.log(str3)                  =>"def"
    
    
    当然我们也可以使用concat(....) 
    
         var str1="a";
         var str2="b";
         var str3="c";
         console.log(str1.concat(str2,str3))   =>"abc"
    六、includes(str)检测一个字符串是否在另一个字符串里包含,区分大小写
     
         var str="abcdef";
    console.log(str.includes(
    "def")); =>true 而我们把“def”换成大写的“DEF”时,并不能检测到 var str="abcdef"; console.log(str.includes("DEF")); =>false
     
    七、endsWith() 检测字符串是不是以“str”结尾的
     
    str.endsWith(searchString [, position]);
    searchString
    要搜索的子字符串。
    position 在 str 中搜索 searchString 的结束位置,当不填写值时,默认值为 str.length,也就是真正的字符串结尾处,从1开始,空格和符号也算字符。 也是开始的位置
    例:
    1、当没有第二个参数时。默认第二个参数时字符串的length 
     
        var str = "To be, or not to be, that is the question.";
    console.log(str.endsWith(
    "question.")) =>true
     
    2、 第二个参数的开始时从“1”开始的,而不是从“0”
     
         var str = "To be, or not to be, that is the question.";
    console.log(str.endsWith(
    "T",1)) =>true;
     
    3、第二个参数的计算是包含空格和标点符号的
         var str = "To be, or not to be, that is the question.";
    console.log(str.endsWith(
    "To be", 5)) =>true
    八、indexOf()方法返回str查找的结果,如果是有返回指定索引(查找到结果的第一个字符的位置),如果没有返回“-1”,区别大小写
     
    例:
         "ABC".indexOf("A")      =》0 查询到“A”,返回位置为索引“0”
     
         "ABC".indexOf("e")      =》-1并没有查询到“e”,返回-1
     
         "ABC".indexOf("AB")     =》0 同样查询到“AB”,返回结果以第一个字符的位置做结果

    ----------检测是否存在某字符串

    当检测某个字符串是否存在于另一个字符串中时,可使用下面的方法:

    "Blue Whale".indexOf("Blue") !== -1;      // true"Blue Whale".indexOf("Bloe") !== -1; // false

    使用 indexOf 统计一个字符串中某个字母出现的次数

    在下例中,设置了 count 来记录字母 e 在字符串 str 中出现的次数:
     
           var str = 'To be, or not to be, that is the question.';
           var count = 0;
           var pos = str.indexOf('e');
           while (pos !== -1) {
               count++;
                pos = str.indexOf('e', pos + 1);
    //重新给pos赋值,从上个查询到str的位置+1的位置继续查找,如果能查到就会再进循环,count+1
    } console.log(count); // displays 4
    九、lastIndexOf()方法返回指定值在调用该方法的字符串中最后出现的位置,如果没找到则返回-1

    语法

    str.lastIndexOf(searchValue[, fromIndex])

    参数

       searchValue
              一个字符串,表示被查找的值。
     
       fromIndex
          从调用该方法字符串的此位置处开始查找。可以是任意整数。默认值为 str.length。如果为负值,则被看作 0。如果 fromIndex > str.length,则 fromIndex 被看作 str.length
    例:
     
      当只有一个参数的时候,第二个值默认str.length,也就是查询整个字符串,查找到这个str在整个字符串中最后出现的位置
     
         "AVBDHIUOKL".lastIndexOf("O");             //7
     
         "AFGHJKLL:JJHKAJALKA".lastIndexOf("A");    //18
     
     当有第二个参数时,第二个参数会被看成查询这个字符串的结束位置
     
         "AFGHJKLL:JJHKAJALKA".lastIndexOf("A",10); 
     
                                  //0从0到第10个索引值时,只在0的位置查询到"A",所以返回0
     
         "AFGHJKLL:JJHKAJALKA".lastIndexOf("A",15);//15
     
                                 //0从0到第15个索引值时,在第15的位置查询到"A",所以返回15
    十、str.repeat(count)构造并返回一个新字符串,该字符串是循环完成后的新字符串
     
        repeat(count)的值一般为数字, 就好比"a".repeat(5)=="a"*5=="aaaaa"
     
    但也会出现其他情况,例如以下:
     
    1.当值为“-1”时,会报错,所以值不能为负数
         "abc".repeat(-1)      // RangeError: repeat count must be positive and less than inifinity
     
    2.那我们值为“0”时,会有什么情况呢?将不会循环,返回一个空字符串  
      
          "abc".repeat(0)           // ""
     
    3.那么我们接下来输入一个正常的数字“1”,repeat给我们返回了"abc"*1的结果,它将循环一遍
     
         "abc".repeat(1)           // "abc"
    4.那么我们试试“2”,看看会不会返回循环两次,确实它返回了字符串循环两遍的结果
      
       "abc".repeat(2)           // "abcabc"
     
    5.那我们来试试小数,看看是循环几次呢,结果是它将小数点后面的抹去了,只循环了前面的数字
      
       "abc".repeat(3.5)       // "abcabcabc" 参数count将会被自动转换成整数.
    6.那我们试试“1/0 ”,并没有解析出来,因为1/0==inifinity
     
       "abc".repeat(1/0)    // RangeError: repeat count must be positive and less than inifinity
    7.那我们再来试试字符串呢? 结果它将字符串自动转为了number,并正确循环并返回了。
     
       "abcd".repeat("2")   // "abcabc" 
    8.那我们来试试,看看它是否能解析中文汉字呢? 结果是并没有,也没有报错
     
       "abcd".repeat("二")      // ""  
    十一、str.slice(beginSlice,endSlice)截取字符串,第一个参数为开始位置,第二个参数为结束位置,前包后不包
     

    1.slice() 从一个字符串中提取字符串并返回新字符串。在一个字符串中的改变不会影响另一个字符串。也就是说,slice 不修改原字符串,只会返回一个包含了原字符串中部分字符的新字符串。

    2.注意:slice() 提取的新字符串包括beginSlice但不包括 endSlice。
     
    3.提取新字符串从第二个字符到第四个 (字符索引值为 1, 2, 和 3)。
     
        "avxdsdfasd".slice(1, 4)       //vxd 
     
    4. 提取第三个字符到倒数第二个字符。-1为倒数第一个
     
       "abckdesdf".slice(2, -1)       //ckdesd
    5.当开始的值和结束的值都为负数时,结果会从后向前数,从-3到-1之间的值(前包后不包)
     
      "abckdesdf".slice(-3, -1)       //"sd"
     
     
    十二、str.split()方法,使用指定的分隔符字符串将一个string对象分割成字符串数组
     
    1.当括号中为空值时,直接将它转为字符串数组
     
          console.log("abcdefg".split());    //  ["abcdefg"]
    2.当括号中为空引号时,它将每个字符串都分割了出来
     
          console.log("abcdefg".split(""));    // ["a", "b", "c", "d", "e", "f", "g"]

    当在空引号中加上一个空格时,它会以你原字符串的空格来分割 "Webkit Moz O ms Khtml".split( "" ) // ["Webkit", "Moz", "O", "ms", "Khtml"]
    3.当括号中为字符串中的字母,它将以当前字母分割字符串
     
         console.log("abcdefg".split("a"));           // ["", "bcdefg"]
     
         console.log("abcdefg".split("b"));           // ["a", "cdefg"]
    4.当括号中字符串并不是当前字符串中包含的,它只接转成数组字符串,不做其他操作
     
       console.log("abcdefg".split("bbbb"));         // ["abcdefg"]
     
    十三、startsWith() 检测字符串是不是以“str”开头的,根据判断返回true,false(ES6新添,与endsWith相反)

    语法

    str.startsWith(searchString [, position]);
    参数     searchString
        要搜索的子字符串。

        position
        在 str 中搜索 searchString 的开始位置,默认值为
    0,也就是真正的字符串开头处。
        var str = "To be, or not to be, that is the question.";
     
           console.log(str.startsWith("To be"))              // true
     
           console.log(str.startsWith(" be"))                // false
        
           console.log(str.startsWith("not to be", 10))      // true
           console.log(str.startsWith("not to be"))          // false
     
    十四、str.substr()方法返回一个字符串中从指定位置开始到指定字符数的字符。
     
     str.substr(start[, length])
     
         start:开始截取的位置,开始索引为0,最大为str.length-1,也可为负数;
     
      length:要截取的长度,如果不填写,默认为str.length-1;最小为1,最大为str.length-1.负数无效,如果为0或者负值,返回一个空字符串。
     
     
    var str = "abcdefghij";
     
    1.当两个值都为正值,且都在范围之内:
     
    console.log("(1,2): "    + str.substr(1,2));     // (1,2): bc
     
    2.当截取位置为负数时,会从后向前数,倒数第一个索引为-1,截取的长度会从当前位置向后数
     
    console.log("(-3,2): "   + str.substr(-3,2));    // (-3,2): hi
     
    3.当只有开始位置的值,并且为负值时,会从当前位置,截取到字符串的末尾
     
    console.log("(-3): "     + str.substr(-3));     // (-3): hij
     
    4.当只有开始的位置,为正值,第二个值默认是str.length-1,也就是截取到字符串的末尾
     
    console.log("(1): "      + str.substr(1));      // (1): bcdefghij
     
    5.当开始的索引是超过字符串长度的负数时,就相当于字符串一直是从后向前数的
     
    console.log("(-20, 2): " + str.substr(-20,2));  // (-20, 2): ab
     
    6.当开始的索引是超过字符串的长度的正值时,无法截取到内容,返回空字符串
     
    console.log("(20, 2): "  + str.substr(20,2));   // (20, 2):""
    十五、str.substring()截取开始位置和结束位置之间的字符串,前包后不包
     
    str.substring(start,stop)
     
              start:开始截取的位置,不为负数;
     
              stop:结束的截取位置,不为负数;
     
    当参数为负数时,不识别,默认转为0;
     
    当第二个值为负数时,默认转为0,,并调换开始和结束的两个值的位置,
     
     
    var str= "abcdefghij";
     
    1.当开始和结束都为正值,并都在范围内,从索引为1的位置截取到索引为2的位置;
     
    console.log("(1,2): "    + str.substring(1,2));                      // (1,2): b
     
    2.当只有一个开始位置的值时,会从开始位置直接截取到结束位置;
     
    console.log("(1): "    + str.substring(1));                           // (1): bcdefghij
     
    3.当开始位置为负数时,会直接转为0来截取;
     
    console.log("(-1): "    + str.substring(-1));                          // (-1): abcdefghij
     
    4.当结束位置超过字符串的长度,会默认忽略第二个参数;
     
    console.log("(1,20): "    + str.substring(1,20));                      // ((-1): bcdefghij
     
    5.当结束位置为负数,会直接转为0,并交换开始和结束的位置;
     
    console.log("(1,-5): "    + "sdsdfsdf".substring(1,-5));              // ((1,-5): s
     
    6.当开始位置和结束位置的值为同一值时,返回空字符串
     
    console.log("(1,1): "    + "sdsdfsdf".substring(1,1)) ;               // ((1,1): ""
    十六、str.toLowerCase()将字符串转为小写的形式(并不会影响字符串本身的值)
     
       console.log("ABC".toLowerCase());         // "abc" 
     
     
    十七、str.UpperCase()将字符串转为大写的形式(并不会影响字符串本身的值)
     
       console.log( "alphabet".toUpperCase() ); // "ALPHABET"
     
     
    十八、str.toString()方法用于将现有的对象转为字符串;
     
    1.数组转字符串;
     
         console.log( [1,2,3,4,5].toString());   //"1,2,3,4,5"
    2.对象转字符串,将会返回[object Object],故不支持转换
     
         var a={a:1,b:2};
    console.log( a.toString()); /
    / [object Object]
     
    十九、str.trim()方法会从一个字符串的两端删除空白字符,在这个上下文中的空白字符是所有的空白字符(space(空格键),tab,no-break space等)以及所有行终止字符(如LF,CR)。
     
          trim()方法并不会影响原字符串,会返回一个新字符串。
     
    例:
         1.当字符串两侧都有空格时,会全部删除
     
         var orig = '   foo  ';
    console.log(orig.trim());
    // 'foo'
       2.当字符串单侧有空格,则就从单侧删除
      
       var orig = 'foo    ';
    console.log(orig.trim());
    // 'foo'
    二十、String.fromCharCode(num1,num2,、、numN)用于返回当前数字所对应的字符

    语法

    String.fromCharCode(num1, ..., numN) 

    参数

    num1, ..., numN
    一组序列数字,表示 Unicode 值。
    描述

    该方法返回一个字符串,而不是一个 String 对象。

    由于 fromCharCode 是 String 的静态方法,所以应该像这样使用:String.fromCharCode(),而不是作为你创建的 String 对象的方法。
    例:
       console.log(String.fromCharCode(65,66,67));    //"ABC"
     
     
     
     
     
     
     
     
  • 相关阅读:
    界面控件DevExpress ASP.NET Controls v21.2 甘特图性能增强
    New!DevExpress ASP.NET v21.2最新版本系统环境配置要求
    界面控件DevExpress WinForm MVVM命令讲解(一)
    界面控件DevExpress WPF入门级教程 触摸滚动条
    DevExtreme初级入门教程(React篇) 应用程序模板(Part 1)
    WinForm应用界面美化攻略 MVVM 高级绑定功能
    Telerik UI组件官宣支持.NET 6 和 VS 2022,让现代UI变得更简单
    界面控件Telerik UI for WinForm初级教程 版本升级
    界面控件DevExpress WPF入门指南 表达式 & 表达式编辑器
    DevExtreme初级入门教程(React篇) 应用程序模板(Part 2)
  • 原文地址:https://www.cnblogs.com/christineqing/p/7718278.html
Copyright © 2020-2023  润新知