原生JS：String对象详解

Posted 2020-08-07 SuriFuture的博客

String对象

本文参考MDN做的详细整理，方便大家参考[MDN](https://developer.mozilla.org/zh-CN/docs/Web/javascript）

JavaScript中的 String 类型用于表示文本型的数据. 它是由无符号整数值（16bit）作为元素而组成的集合. 字符串中的每个元素在字符串中占据一个位置. 第一个元素的index值是0, 下一个元素的index值是1, 以此类推. 字符串的长度就是字符串中所含的元素个数.

String 对象是对原始string类型的封装，你可以在String字面值上使用String对象的任何方法—JavaScript自动把String字面值转换为一个临时的String对象, 然后调用其相应方法,最后丢弃此临时对象.在String字面值上也可以使用String.length属性

访问字符串的单个字符方法：

• 获取字符串的某一单个字符有两种方法。 第一种是使用 charAt 方法：

    
return \'cat\'.charAt(1); // returns "a"

• 另一种方法 (在ECMAScript 5中有所介绍) 是把字符串当作一个类数组对象，其中的每个字符对应一个数值索引：

    
return \'cat\'[1]; // returns "a"

使用括号访问字符串不可以对其进行删除或添加，因为对应属性并不是可读或可写的。

你可以通过String字面值或者String对象两种方式创建一个字符串.

• 通常，我们都使用字符串的字面量写法
  
• 可以使用 String 函数来将其他值 生成或转换 成字符串：

    
String(thing) 
    
new String(thing)

字符串比较：可以用‘>’ 或\'<\'来对两个字符、字符串进行比较。

除了普通的可打印字符以外，一些特殊的字符可以通过其转义形式放入字符串中：

Code	Output
\\0	the NUL character
\\\'	single quote
\\"	double quote
\\\\	backslash
\\n	new line
\\r	carriage return
\\v	vertical tab
\\t	tab
\\b	backspace
\\f	form feed
\\uXXXX	unicode codepoint
\\u{X} ... \\u{XXXXXX}	unicode codepoint  escapes (ES6)
\\xXX	the Latin-1 character

• 16进制转义序列在\\x之后的数值将被认为是一个16进制数：\'\\xA9\' // "©"
  
• Unicode转义序列在\\u之后需要至少4个字符：\'\\u00A9\' // "©"
  
• Unicode code point escapes：这是ECMAScript 6中的新特性. 有了Unicode code point escapes, 任何字符都可以用16进制数转义, 这使得通过Unicode转义表示大于0x10FFFF的字符成为可能. 
• 使用简单的Unicode转义时通常需要分别写字符相应的两个部分（译注：大于0x10FFFF的字符需要拆分为相应的两个小于0x10FFFF的部分）来达到同样的效果.请参阅 String.fromCodePoint() 或 String.prototype.codePointAt().

    
\'\\u{2F804}\'
    
// the same with simple Unicode escapes 
    
\'\\uD87E\\uDC04\'

String对象的方法（各个方法详解见本文底部）

方法	描述
charAt, charCodeAt, codePointAt	返回字符串指定位置的字符或者字符编码。
indexOf, lastIndexOf	分别返回字符串中指定子串的位置或最后位置。
startsWith, endsWith, includes	返回字符串是否以指定字符串开始、结束或包含指定字符串。
concat	连接两个字符串并返回新的字符串。
fromCharCode, fromCodePoint	从指定的Unicode值序列构造一个字符串。这是一个String类方法，不是实例方法。
split	通过将字符串分离成一个个子串来把一个String对象分裂到一个字符串数组中。
slice	从一个字符串提取片段并作为新字符串返回。
substring, substr	分别通过指定起始和结束位置，起始位置和长度来返回字符串的指定子集。
match, replace, search	通过正则表达式来工作.
toLowerCase, toUpperCase	分别返回字符串的小写表示和大写表示。
normalize	Returns the Unicode Normalization Form of the calling string value.
repeat	将字符串内容重复指定次数后返回。
trim	去掉字符串开头和结尾的空白字符。

模板字符串：ES6新特性

模板字符串允许嵌入表达式，并且支持多行字符串和字符串插补特性。

语法

    
`string text`  
    
`string text line 1  
    
 string text line 2`   
    
`string text ${expression} string text`  
    
tag `string text ${expression} string text`

模板字符串使用反引号 (` `) 来代替普通字符串中的用双引号和单引号。模板字符串可以包含特定语法(${expression})的占位符。占位符中的表达式和周围的文本会一起传递给一个默认函数，该函数负责将所有的部分连接起来，如果一个模板字符串由表达式开头，则该字符串被称为带标签的模板字符串，该表达式通常是一个函数，它会在模板字符串处理后被调用，在输出最终结果前，你都可以在通过该函数对模板字符串来进行操作处理。

多行字符串、表达式插补

使用普通字符串，换行需要\\n，插入表达式需要分段：

    
var a = 5;    
    
var b = 10;    
    
console.log("Fifteen is " + (a + b) + " and\\nnot " + (2 * a + b) + ".");    
    
// "Fifteen is 15 and    
    
// not 20."

现在通过模板字符串，我们可以使用一种更优雅的方式来表示（换行也可以用\\n）：

    
var a = 5;    
    
var b = 10;    
    
console.log(`Fifteen is ${a + b} and    
    
not ${2 * a + b}.`);   
    
// "Fifteen is 15 and    
    
// not 20."

带标签的模板字符串

模板字符串的一种更高级的形式称为带标签的模板字符串。它允许您通过标签函数修改模板字符串的输出。标签函数的第一个参数是一个包含了字符串字面值的数组（在本例中分别为“Hello”和“world”）；第二个参数，在第一个参数后的每一个参数，都是已经被处理好的替换表达式（在这里分别为“15”和“50”）。 最后，标签函数返回处理好的字符串。在后面的示例中，标签函数的名称可以为任意的合法标示符。

    
var a = 5;    
    
原生JS：Function对象(applycallbind)详解

 原生JS：deleteintypeofinstanceofvoid详解
 原生JS封装AJAX详解
 VSCode自定义代码片段——JS中的面向对象编程
 js经常用到的代码片段
 VSCode自定义代码片段9——JS中的面向对象编程