JavaScript 字符串方法全版

灰太狼 2022-12-01 11:43 161阅读 0赞

#### String 对象描述 ####

字符串是 JavaScript 的一种基本的数据类型  
String 类定义了大量操作字符串的方法，例如从字符串中提取字符或子串，或者检索字符或子串。  
需要注意的是：**JavaScript 的字符串是不可变的（immutable），String 类定义的方法都不能改变字符串的内容。像 String.toUpperCase() 这样的方法，返回的是全新的字符串，而不是修改原始字符串。**

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzQ5OTkzMDYx_size_16_color_FFFFFF_t_70_pic_center]

#### String 对象属性 ####

<table> 
 <thead> 
  <tr> 
   <th>属性</th> 
   <th>描述</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>constructor</td> 
   <td>对创建该对象的函数的引用</td> 
  </tr> 
  <tr> 
   <td>length</td> 
   <td>字符串的长度</td> 
  </tr> 
  <tr> 
   <td>prototype</td> 
   <td>允许您向对象添加属性和方法</td> 
  </tr> 
 </tbody> 
</table>

#### String 对象方法 ####

<table> 
 <thead> 
  <tr> 
   <th>方法</th> 
   <th>描述</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>anchor()</td> 
   <td>创建 HTML 锚</td> 
  </tr> 
  <tr> 
   <td>big()</td> 
   <td>用大号字体显示字符串</td> 
  </tr> 
  <tr> 
   <td>blink()</td> 
   <td>显示闪动字符串</td> 
  </tr> 
  <tr> 
   <td>blod()</td> 
   <td>使用粗体显示字符串</td> 
  </tr> 
  <tr> 
   <td>charAt()</td> 
   <td>返回在指定位置的字符</td> 
  </tr> 
  <tr> 
   <td>charCodeAt()</td> 
   <td>返回在指定的位置的字符的 Unicode 编码</td> 
  </tr> 
  <tr> 
   <td>concat()</td> 
   <td>连接字符串</td> 
  </tr> 
  <tr> 
   <td>fixed()</td> 
   <td>以打字机文本显示字符串</td> 
  </tr> 
  <tr> 
   <td>fontcolor()</td> 
   <td>使用指定的颜色来显示字符串</td> 
  </tr> 
  <tr> 
   <td>fontsize()</td> 
   <td>使用指定的尺寸来显示字符串</td> 
  </tr> 
  <tr> 
   <td>fromCharCode()</td> 
   <td>从字符编码创建一个字符串</td> 
  </tr> 
  <tr> 
   <td>indexOf()</td> 
   <td>检索字符串</td> 
  </tr> 
  <tr> 
   <td>italics()</td> 
   <td>使用斜体显示字符串</td> 
  </tr> 
  <tr> 
   <td>lastIndexOf()</td> 
   <td>从后向前检索字符串</td> 
  </tr> 
  <tr> 
   <td>link()</td> 
   <td>将字符串显示为链接</td> 
  </tr> 
  <tr> 
   <td>localeCompare()</td> 
   <td>用本地特定的顺序来比较两个字符串</td> 
  </tr> 
  <tr> 
   <td>match()</td> 
   <td>找到一个或多个正则表达式的匹配</td> 
  </tr> 
  <tr> 
   <td>replace()</td> 
   <td>替换与正则表达式匹配的子串</td> 
  </tr> 
  <tr> 
   <td>search()</td> 
   <td>检索与正则表达式匹配的值</td> 
  </tr> 
  <tr> 
   <td>slice()</td> 
   <td>提取字符串的片段，并在新的字符串中返回被提取的部分</td> 
  </tr> 
  <tr> 
   <td>small()</td> 
   <td>使用小字号显示字符串</td> 
  </tr> 
  <tr> 
   <td>split()</td> 
   <td>把字符串分割为字符串数组</td> 
  </tr> 
  <tr> 
   <td>strike()</td> 
   <td>使用删除线显示字符串</td> 
  </tr> 
  <tr> 
   <td>sub()</td> 
   <td>把字符串显示为下标</td> 
  </tr> 
  <tr> 
   <td>substr()</td> 
   <td>从起始索引号提取字符串中指定数目的字符</td> 
  </tr> 
  <tr> 
   <td>substring()</td> 
   <td>提取字符串中两个指定的索引号之间的字符</td> 
  </tr> 
  <tr> 
   <td>sup()</td> 
   <td>把字符串显示为上标</td> 
  </tr> 
  <tr> 
   <td>toLocaleLowerCase()</td> 
   <td>把字符串转换为小写</td> 
  </tr> 
  <tr> 
   <td>toLocaleUpperCase()</td> 
   <td>把字符串转换为大写</td> 
  </tr> 
  <tr> 
   <td>toLowerCase()</td> 
   <td>把字符串转换为小写</td> 
  </tr> 
  <tr> 
   <td>toUpperCase()</td> 
   <td>把字符串转换为大写</td> 
  </tr> 
  <tr> 
   <td>toSource()</td> 
   <td>代表对象的源代码</td> 
  </tr> 
  <tr> 
   <td>toString()</td> 
   <td>返回字符串</td> 
  </tr> 
  <tr> 
   <td>valueOf()</td> 
   <td>返回某个字符串对象的原始值</td> 
  </tr> 
 </tbody> 
</table>

#### 下面列举一些常用的字符串方法实例 ####

**1.字符串长度**

**length** 属性返回字符串的长度

var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
    var sln = txt.length;

**2.字符串查找**

**indexOf()** 返回字符串中指定文本首次出现的索引  
JavaScript 中索引从零计算位置  
0 是字符串中的第一个位置，1 是第二个，2 是第三个 …

var str = "The full name of China is the People's Republic of China.";
    var pos = str.indexOf("China");

**lastIndexOf()** 返回指定文本在字符串中最后一次出现的索引

var str = "The full name of China is the People's Republic of China.";
    var pos = str.lastIndexOf("China");

*如果未找到指定文本，indexOf() 和 lastIndexOf() 都返回 -1。*  
两种方法都接受作为检索起始位置的第二个参数

var str = "The full name of China is the People's Republic of China.";
    var pos = str.indexOf("China", 18);

lastIndexOf() 方法向后进行检索（从尾到头），这意味着：假如第二个参数是 50，则从位置 50 开始检索，直到字符串的起点。

**3.检索字符串中的字符串**

**search()** 检索指定值的字符串，并返回匹配的位置

var str = "The full name of China is the People's Republic of China.";
    var pos = str.search("locate");

**4.提取部分字符串**

字符串的提取有三种方法  
start：起始位置 end：结束位置 length：截取长度

*  slice(start,end)
 *  substring(start,end)
 *  substr(start,length)

**slice()** 提取字符串的某个部分并在新字符串中返回被提取的部分

var str = "Apple, Banana, Mango";
    var res = str.slice(7,13);
    //res 的结果是 Banana

如果某个参数为负数，则从字符串的结尾开始计数

var str = "Apple, Banana, Mango";
    var res = str.slice(-13,-7);
    //res 的结果是 Banana

如果省略第二个参数，则裁剪至末位

**substring()** 此方法类似于 slice()，区别在于 substring() 无法接受负的索引

var str = "Apple, Banana, Mango";
    var res = str.substring(7,13);
    //res 的结果是 Banana

**substr()** 此方法类似于 slice()，区别在于第二个参数规定提取部分的长度

var str = "Apple, Banana, Mango";
    var res = str.substr(7,6);
    //res 的结果是 Banana

如果首个参数为负，则从字符串的结尾计算位置。

var str = "Apple, Banana, Mango";
    var res = str.substr(-5);
    //res 的结果是 Mango

第二个参数不能为负，因为它定义的是长度。

**5.字符串替换**

**replace()** 用另一个值替换在字符串中指定的值

str = "Hello World！";
    var n = str.replace("Hello", "你好");

*  replace() 方法不会改变调用它的字符串。它返回的是新字符串。
 *  replace() 默认只替换首个匹配项，如需替换所有匹配项，应使用正则表达式 `/g`

str = "Hello Hello World！";
    var n = str.replace(/Hello/g, "你好");

*  replace() 对大小写敏感，如需执行大小写不敏感的替换，应使用正则表达式 `/i`

str = "Hello World！";
    var n = str.replace(/hello/i, "你好");

**6.大小写转换**

**toUpperCase()** 将字符串转换为大写

var text1 = "Hello World!";     
    var text2 = text1.toUpperCase();

**toLowerCase()** 将字符串转换为小写

var text1 = "Hello World!";    
    var text2 = text1.toLowerCase();

**7.连接字符串**

**concat()** 连接两个或多个字符串

var text1 = "Hello";
    var text2 = "World";
    text3 = text1.concat(" ",text2);

concat() 方法可用于代替加运算符。下面两行是等效的：

var text = "Hello" + " " + "World!";
    var text = "Hello".concat(" ","World!");

**8.删除字符串两端空白符**

**trim()** 方法删除字符串两端的空白符：

var str = "       Hello World!        ";
    alert(str.trim());

**9.提取字符串字符**

**charAt()** 方法返回字符串中指定下标（位置）的字符串

var str = "HELLO WORLD";
    str.charAt(0); 
    // 返回 H

**charCodeAt()** 方法返回字符串中指定索引的字符 unicode 编码

var str = "HELLO WORLD";
    str.charCodeAt(0);
    // 返回 72

**10.把字符串转换为数组**

**split()** 将字符串转换为数组

var txt = "a,b,c,d,e";   // 字符串
    txt.split(",");          // 用逗号分隔
    txt.split(" ");          // 用空格分隔
    txt.split("|");          // 用竖线分隔

如果省略分隔符，被返回的数组将包含 index \[0\] 中的整个字符串

如果分隔符是 “”，被返回的数组将是间隔单个字符的数组

var txt = "Hello";       // 字符串
    txt.split("");           // 分隔为字符

**11.判断字符串是否以指定字符串开头**

**startsWith()**

var str = "hello world";
      var result = str.startsWith("he");
      console.log(result)//true
      //当为两个参数时，第二个表示开始位数。
      var result = str.startsWith("he",1);
      console.log(result)//flase

**12.判断字符串是否以指定字符串结尾**

**endsWith()**

var str = "hello world";
     //检测尾部
     var result = str.endsWith("world");
     console.log(result);//true
     //检测指定位置是否以指定字符结尾
     var result1 = str.endsWith("wo", 8);
     console.log(result1)//true

**13.检测是否包含指定字符串**

**includes()**

var str = "hello world";
     var result = str.includes("o");
     console.log(result);//true
     var result1 = str.includes("o", 8);
     console.log(result1);//false

**14,.重复字符串**

**repeat()**

var str ="6"
    var str1 = str.repeat(6);
    console.log(str1)//666666

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzQ5OTkzMDYx_size_16_color_FFFFFF_t_70_pic_center]: /images/20221123/288a4c4d74894d01b2786eefbd70aaf4.png