JavaScript String 字符串方法

Posted 2020-11-12 南木n

JavaScript String 字符串方法汇总

 

1.str.indexOf() 方法查找字符串中的字符串  返回   字符串中指定文本首次出现的索引（位置）

      javascript 从零计算位置。0 是字符串中的第一个位置，1 是第二个，2 是第三个 ...

      无法设置更强大的搜索值（正则表达式）

var str = "The full name of China is the People‘s Republic of China.";
var pos = str.indexOf("China");
document.getElementById("demo").innerhtml = pos;

 

2.str.lastIndexOf() 方法向后进行检索（从尾到头）  返回指定文本在字符串中最后一次出现的索引

 var str = "The full name of China is the People‘s Republic of China.";
 var pos = str.lastIndexOf("China");
 document.getElementById("demo").innerHTML = pos;

 

3.str.search() 方法检索字符串中的字符串   搜索特定值的字符串，并返回匹配的位置

     无法设置第二个开始位置参数

 

var str = "The full name of China is the People‘s Republic of China.";
var pos = str.search("China");
document.getElementById("demo").innerHTML = pos;

 

4.str提取部分字符串

   (1)     slice(start, end)

   (2)     substring(start, end)

   (3)     substr(start, length)

 

(1) slice() 方法

var str="Hello World";
var str1=str.slice(2); //如果只有一个参数，则提取开始下标到结尾处的所有字符串
var str2=str.slice(2,7); //两个参数，提取下标为2，到下标为7但不包含下标为7的字符串
var str3=str.slice(-7,-2); //如果是负数，-1为字符串的最后一个字符。提取从下标-7开始到下标-2但不包含下标-2的字符串。前一个数要小于后一个数，否则返回空字符串

console.log(str1); //llo World
console.log(str2); //llo W
console.log(str3); //o Wor

（2）substring() 方法 

substring() 类似于 slice()

不同之处在于 substring() 无法接受负的索引 

如果省略第二个参数，则该 substring() 将裁剪字符串的剩余部分。

var str="Hello World";
var str1=str.substring(2)
var str2=str.substring(2,2);
var str3=str.substring(2,7);
console.log(str1); //llo World
console.log(str2); //如果两个参数相等，返回长度为0的空串
console.log(str3); //llo W

（3）substr() 方法

substr() 类似于 slice()

不同之处在于第二个参数规定被提取部分的长度

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

var str = "Apple, Banana, Mango";
var res = str.substr(7,6);

结果： 
     Banana

 

5.str.replace() 方法用另一个值替换在字符串中指定的值 替换字符串内容

var str="hello WORLD";
var reg=/o/ig; //o为要替换的关键字，不能加引号，否则替换不生效，i忽略大小写，g表示全局查找。
var str1=str.replace(reg,"**")
console.log(str1); //hell** W**RLD

6.str.toLowerCase(): 把字符串转为小写，返回新的字符串

var str="Hello World";
var str1=str.toLowerCase();
console.log(str); //Hello World
console.log(str1); //hello world

7.str.toUpperCase(): 把字符串转为大写，返回新的字符串

var str="hello world";
var str1=str.toUpperCase();
console.log(str); //hello world
console.log(str1); //HELLO WORLD

8.str.charAt(): 返回指定下标位置的字符。如果index不在0-str.length(不包含str.length)之间，返回空字符串

var str="hello world";
var str1=str.charAt(6);
console.log(str1); 

9.str.charCodeAt(): 返回指定下标位置的字符的unicode编码,这个返回值是 0 - 65535 之间的整数

var str="hello world";
var str1=str.charCodeAt(1);
var str2=str.charCodeAt(-2); //NaN
console.log(str1); //101

10.str.split(): 把字符串分割成字符串数组

var str="AA BB CC DD";
var string1="1:2:3:4:5";
var str1=str.split("");//如果把空字符串 ("")用作分割符，那么字符串的每个字符之间都会被分割
var str2=str.split(" "); //以空格为分隔符
var str3=str.split("",4); //4指定返回数组的最大长度
var str4=string1.split(":");
console.log(str1); // ["A", "A", " ", "B", "B", " ", "C", "C", " ", "D", "D"]
console.log(str2); //["AA" "BB" "CC" "DD"]
console.log(str3); //["A", "A", " ", "B"]
console.log(str4); // ["1", "2", "3", "4", "5"]

11.str.match(): 返回所有查找的关键字内容的数组

var str="To be or not to be";
var reg=/to/ig;
var str1=str.match(reg);
console.log(str1); //["To", "to"]
console.log(str.match("Hello")); //null

12.str.fromCharCode方法 

是接收一或多个字符编码，然后将其转换为字符串 

是String构造函数的一个静态方法 

 console.log(String.fromCharCode(104,101,108,108,111));//hello 

 

13.str.localeCompare方法

用于比较两个字符串 
    1.如果字符串在字母表中应该排在字符串参数之前，则返回一个负数 
    1.如果字符串等于字符串参数，则返回0 
    1.如果字符串在字母表中应该排在字符串参数之后，则返回一个正数 

var str="yellow"; 
    console.log(str.localeCompare("brick"));//1 
    console.log(str.localeCompare("yellow"));//0 
    console.log(str.localeCompare("zoo"));//-1 

14.big()  用大号字体显示字符串

15.blink()  显示闪动字符串

16.bold()  字符串粗体显示

17.link()   将字符串显示为链接

18.fontcolor()  指定颜色显示

19.fontsize()  指定尺寸显示

20.concat()  连接字符串

.......

ES6新增

 

1.str.trim() 用来删除字符串前后的空格 

 

 var str="   hello world   "; 
    console.log(‘(‘+str.trim()+‘)‘);//(hello world) 
    console.log(‘(‘+str+‘)‘);//(   hello world   ) 

2.str.repeat()  返回一个新字符串，表示将原字符串重复n次

  var str = ‘helloworld‘;

  str.repeat( n );//该字符串就会重复n遍；

3.str.padStart （）用于头部补全

 

   var  str = ‘20199‘; //长度达不到 指定位 ，

   str.padStart （8，‘ab’）；

   //abab2019

4.str.padEnd （）用于尾部补全

 

   var  str = ‘2019‘; //长度达不到 指定位 ，

   str.padEnd（8，‘ab’）；

   //2019abab

5.str.raw()    往往用来充当模板字符串的处理函数，返回一个斜杠都被转义（即斜杠前面再加一个斜杠）的字符串，对应于替换变量后的模板字符串

   

   String.raw = function (strings, ...values) {

   var output = "";

   for (var index = 0; index < values.length; index++) {

   output += strings.raw[index] + values[index];

   }

   output += strings.raw[index]

   return output;

   }

   //t0e1s2t

6.str.codePointAt()   正确解析四个字节的字符

      这两个字符在UTF-16中编码为 0xD842   和  0xDFB9 储存起来需要四个字节，那么对于这样四个字节的东西javascript 无法正确判断，而是将其解析为两个字符；

     charCodeAt会分别返回前两个字节和后两个字节的值; 而charAt压根就无法识别;

     在ES6中提供给我们一个新的方法codePointAt(); 这个方法可以正确解析四个字节的字符。

     var s = "??";

     console.log(s.codePointAt()) // 134073

7.String.fromCodePoint()   

 相当于ES5内的String.fromCharCode()

        先说说 String.fromCharCode()方法；这个方法无法正确识别 32位的 UTF-16字符（也就是上面提到的四个字节的字符 Unicode编码 大于 0xFFFF）;

        console.log(String.fromCharCode(0x20BB9 )) //  出现了一个奇怪的字符

        原因是什么那？ 因为fromCharCode不识别四个字节的字符， 他会将第一位省略掉 ， 也就是将 0x20BB9 去掉开头 变成了0x0BB9;所以出现的结果不正确;

        但是ES6中的String.fromCodePoint()可以正确识别这样的编码; 

        console.log(String.fromCodePoint(0x20BB9)) //?? 显示正确;

  console.log(String.fromCharCode(134066))//?

8.includes() startsWith() endsWith() 判断字符串中是否存在某个字符串

 var s = ‘Hello world!‘;

   s.startsWith(‘Hello‘)   // true       以参数开头

   s.endsWith(‘!‘)         // true       以参数结尾

   s.includes(‘o‘)         // true       包括参数;

8.ES6为字符串添加了遍历器接口，使得字符串可以被for...of循环遍历。这个遍历器最大的优点是可以识别大于0xFFFF的码点，传统的for循环无法识别这样的码点,但是不能遍历object

var text = String.fromCodePoint(0x20BB7);

for (let i = 0; i < text.length; i++) {
  console.log(text[i]);
}
// " "
// " "

for (let i of text) {
  console.log(i);
}
// "??"

9.模板字符串（template string）是增强版的字符串，用反引号（`）标识。它可以当作普通字符串使用，也可以用来定义多行字符串，或者在字符串中嵌入变量

// 字符串中嵌入变量
var name = "Bob", time = "today";
`Hello ${name}, how are you ${time}?`

 

........