必须知道的JavaScript String原生方法

我是傲夫靠斯，欢迎关注我的公众号【前端工程师的自我修养】，搜索f2ef2e，每天更新。

在JavaScript中，字符串的原生方法并不多，所以字符串操作是每个前端必须掌握的，面试的时候也会被重点考察。

创建字符串

const str1 = 'Hello'
const str2 = `${str1} World`
const str3 = new String("welcome")

静态方法

fromCharCode()

将Unicode编码转换为字符

console.log(String.fromCharCode(72, 101, 108, 108, 111)); 
//输出: Hello

fromCodePoint()

将Unicode编码转换为字符，这是ES6的新方法，因为fromCharCode()方法的只能识别0～65535的Unicode编码，如果字符超过65535使用fromCharCode()会发生错误。

console.log(String.fromCodePoint(72, 101, 108, 108, 111)); 
//输出: Hello
console.log(String.fromCharCode(134071));
//输出: ஷ
//错误
console.log(String.fromCodePoint(134071));
//输出: "𠮷"
//正确

raw()

ES6的新方法，用来返回字符串的原始值。

const str = String.raw`Hello World \n`;
console.log(str);
//输出:  Hello World \n

实例属性

length

返回字符串的长度

const str = 'Hello World'
console.log(str.length) 
//输出: 11

实例方法

charAt()

返回字符串某个位置上的字符

const str = 'Hello World'
console.log(str.charAt(1))
//输出: e
console.log(str[1])
//输出: e

charCodeAt()

返回字符串某个位置上的字符Unicode 编码，e的Unicode 编码为101

const str = 'Hello World'
console.log(str.charCodeAt(1))
//输出: 101

codePointAt()

这是ES6的新方法，因为charCodeAt()方法的返回范围是0～65535，如果字符超过65535使用charCodeAt()会报错。

const str1 = 'Hello World'
console.log(str1.codePointAt(1))
// 101

const str2 = '𠮷' 
console.log(str2.charCodeAt(0))
//输出: 55362
//错误答案：'𠮷'在Unicode 编码超出65535所以返回了错误结果
console.log(str2.codePointAt(0))
//输出: 134071
//正确

concat()

连接字符串

const str1 = 'Hello';
const str2 = 'World';

console.log(str1.concat(' ', str2)); 
//输出: Hello World
console.log(str1 + ' ' + str2); 
//输出: Hello World

includes()

判断字符串是否包含某个字符串

const str = 'Hello World'
str.includes('World') 
//输出: true

indexOf()

搜索包含某个字符串的位置，如果不存在返回-1

const str = 'Hello World'
str.indexOf('o') 
//输出: 4

lastIndexOf()

搜索最后包含某个字符串的位置，如果不存在返回-1

const str = 'Hello World'
str.lastIndexOf('o') 
//输出: 7

localeCompare()

用本地特定的顺序来比较两个字符串，如果’Hello World’小于’Welcome’，返回小于0，反之大于0，相等返回0。一般用于排序

const str = 'Hello World'
str.localeCompare('Welcome')
//输出: -1

const arr = ['Hello World', 'China', 'Welcome']
console.log(arr.sort((a,b) => a.localeCompare(b)))
//输出: ["China", "Hello World", "Welcome"]

match()

使用正则匹配字符串中包含的部分

const str = 'Hello World'
const found = str.match(/[A-Z]/g)
console.log(found) 
//输出: ["H", "W"]

matchAll()

使用正则匹配字符串中包含的部分，返回结果为迭代器(Iterator)

const str = 'Hello World'
const found = str.matchAll(/[A-Z]/g)
console.log([...found]) 
//输出: [["H"],["W"]]

padEnd()

在字符串结尾填充某个字符串

const str = 'Hello World'
console.log(str.padEnd(str.length + 3, '.')); 
//输出: Hello World...

padStart()

在字符串开始填充某个字符串

const str = 'Hello World'
console.log(str.padStart(str.length + 3, '.')); 
//输出: ...Hello World

repeat()

重复字符串

const str = 'Hello World '
console.log(str.repeat(3)) 
//输出: Hello World Hello World Hello World 

replace()

替换字符串中的匹配部分，只替换匹配到的第一个

const str = 'Hello World'
console.log(str.replace('World', 'dog')) 
//输出: Hello dog

replaceAll()

替换字符串中的匹配部分，替换所有匹配到的

const str = 'Hello World'
console.log(str.replaceAll('l', 'L')) 
//输出: HeLLo WorLd

search()

使用正则搜索字符串，返回匹配到的位置，未找到返回-1

const str = 'Hello World'
console.log(str.search(/W.+d/g)); 
//输出: 6

slice()

从某个位置开始，返回切割后的字符串

const str = 'Hello World'
console.log(str.slice(6)); 
//输出: World

split()

将字符串按某种格式分割成数组

const str = 'Hello World'
console.log(str.split(' ')); 
//输出: ["Hello", "World"]

startsWith()

判断字符串是否以指定字符串开始

const str = 'Hello World'
console.log(str.startsWith('Hello')); 
//输出: true

endsWith()

判断字符串是否以指定字符串结束

const str = 'Hello World'
str.endsWith('World') 
//输出: true

substring()

截取字符串，指定开始和结束位置

const str = 'Hello World'
console.log(str.substring(1, 3)); 
//输出: el

toLocaleLowerCase()

利用本地的方式将字符串转小写，只有土耳其语言等几种小众语言会有本地方式，其他语言和toLowerCase()相同

const str = 'Hello World'
console.log(str.toLocaleLowerCase()); 
//输出: hello world

toLocaleUpperCase()

利用本地的方式将字符串转大写，只有土耳其语言等几种小众语言会有本地方式，其他语言和toUpperCase()相同

const str = 'Hello World'
console.log(str.toLocaleUpperCase()); 
//输出: HELLO WORLD

toLowerCase()

字符串转小写

const str = 'Hello World'
console.log(str.toLowerCase()); 
//输出: hello world

toUpperCase()

字符串转大写

const str = 'Hello World'
console.log(str.toUpperCase()); 
//输出: HELLO WORLD

trim()

去除字符串首尾的空格

const str = '      Hello World     '
console.log(str.trim()); 
//输出: Hello World

trimEnd()

去除字符串结束的空格

const str = '      Hello World     '
console.log(str.trimEnd()); 
//输出: '      Hello World'

trimStart()

去除字符串开始的空格

const str = '      Hello World     '
console.log(str.trimStart()); 
//输出: 'Hello World     '

toString()

获取String对象的值

const strObj = new String('Hello World');

console.log(strObj); 
//输出: String {"Hello World"}
console.log(strObj.toString()); 
//输出: Hello World

valueOf()

获取String对象的原始值

const strObj = new String('Hello World');

console.log(strObj); 
//输出: String {"Hello World"}
console.log(strObj.valueOf()); 
//输出: Hello World

更多干货内容，欢迎关注我的公众号【前端工程师的自我修养】，搜索f2ef2e，每天更新。