JavaScript高级程序设计第4版----String

文章目录

JavaScript高级程序设计第4版----String
1、JavaScript 字符
2、字符串操作方法
- 1、concat （不改变原数据）
- 2、slice（[ )） N
- 3、substring（[)） N
- 4、substr（）N
3、字符串位置方法
- 1、indexOf（）
- 2、lastIndexOf()
4、字符串包含方法
- 1、startsWith()
- 2、endsWith()
- 3、includes()
5、trim()、trimLeft()、trimRight()方法
6、repeat()方法
7、padStart()和 padEnd()方法
8、字符串迭代与解构
- 1、迭代
- 2、解构（[...]）
9、字符串大小写转换
10、字符串模式匹配方法
- 1、match
- 2、search
- 3、replace
11、localeCompare()方法
12、HTML 方法

let stringObject = new String("hello world");

1、JavaScript 字符

属性：

1、length

let message = "abcde";
console.log(message.length); // 5

2、charAt（）：返回索引位置的字符

let message = "abcde";
console.log(message.charAt(2)); // "c"

3、charCodeAt（）码元的字符编码

let message = "abcde";
console.log(message.charCodeAt(2)); // 99
// 十进制 99 等于十六进制 63
console.log(99 === 0x63); // true

4、fromCharCode() 根据给定的 UTF-16 码元创建字符串中的字符

console.log(String.fromCharCode(0x61, 0x62, 0x63, 0x64, 0x65)); // "abcde"
console.log(String.fromCharCode(97, 98, 99, 100, 101)); // "abcde"

2、字符串操作方法

1、concat （不改变原数据）

字符串拼接

let stringValue = "hello ";
let result = stringValue.concat("world"，"!");
console.log(result); // "hello world!"
console.log(stringValue); // "hello"

2、slice（[ )） N

3、substring（[)） N

4、substr（）N

正数

let stringValue = "hello world";
console.log(stringValue.slice(3)); // "lo world"
console.log(stringValue.substring(3)); // "lo world"
console.log(stringValue.substr(3)); // "lo world"
console.log(stringValue.slice(3, 7)); // "lo w"
console.log(stringValue.substring(3,7)); // "lo w"
console.log(stringValue.substr(3, 7)); // "lo worl"  //截取7个字符串数量

负数：在给 slice()和 substr()传入负参数时，它们的返回结果相同。

这是因为-3 会被转换为 8（长度加上负参数），实际上调用的是 slice(8)和 substr(8)。

substring()方法返回整个字符串，因为-3 会转换为 0。

当第二个参数为负值时，

slice()方法将第二个参数转换为 7，实际上相当于调用 slice(3, 7)，因此返回"lo w"。

而 substring()方法会将第二个参数转换为 0，相当于调用substring(3, 0)，等价于 substring(0, 3)，这是因为这个方法会将较小的参数作为起点，将较大的参数作为终点。

对 substr()来说，第二个参数会被转换为 0，意味着返回的字符串包含零个字符，因而会返回一个空字符串

let stringValue = "hello world";
console.log(stringValue.slice(-3)); // "rld"
console.log(stringValue.substring(-3)); // "hello world"
console.log(stringValue.substr(-3)); // "rld" console.log(stringValue.slice(3, -4)); // "lo w"
console.log(stringValue.substring(3, -4)); // "hel"
console.log(stringValue.substr(3, -4)); // "" (empty string)

3、字符串位置方法

1、indexOf（）

2、lastIndexOf()

查找不对返回-1

let stringValue = "hello world";
// 查找第一个
console.log(stringValue.indexOf("o")); // 4
//查找最后一个
console.log(stringValue.lastIndexOf("o")); // 7
let stringValue = "hello world";
//从第六个开始查找
console.log(stringValue.indexOf("o", 6)); // 7
//它从位置 6 开始反向搜索至字符串开头
console.log(stringValue.lastIndexOf("o", 6)); // 4

4、字符串包含方法

1、startsWith()

2、endsWith()

3、includes()

一个参数：

startsWith()检查开始于索引 0 的匹配项，

endsWith()检查开始于索引最末尾的匹配项，

而 includes()检查整个字符串

let message = "foobarbaz";
console.log(message.startsWith("foo")); // true
console.log(message.startsWith("bar")); // false
console.log(message.endsWith("baz")); // true
console.log(message.endsWith("bar")); // false
console.log(message.includes("bar")); // true
console.log(message.includes("qux")); // false

2个参数：

startsWith()和 includes()方法接收可选的第二个参数，表示开始搜索的位置。如果传入第二个参数，则意味着这两个方法会从指定位置向着字符串末尾搜索，忽略该位置之前的所有字符。

let message = "foobarbaz";
console.log(message.startsWith("foo")); // true
console.log(message.startsWith("foo", 1)); // false
console.log(message.startsWith("bar", 3)); // true
console.log(message.includes("bar")); // true
console.log(message.includes("bar", 4)); // false

endsWith()方法接收可选的第二个参数，表示应该当作字符串末尾的位置。

如果不提供这个参数，那么默认就是字符串长度。

如果提供这个参数，那么就好像字符串只有那么多字符一样：

let message = "foobarbaz";
console.log(message.endsWith("bar")); // false
console.log(message.endsWith("bar", 6)); // true5

5、trim()、trimLeft()、trimRight()方法

删除前、后所有空格符

let stringValue = " hello world ";
let trimmedStringValue = stringValue.trim();
console.log(stringValue); // " hello world "
console.log(trimmedStringValue); // "hello world"
console.log(stringValue.trimRight()); // "hello world "
console.log(stringValue.trimLeft()); // " hello world"

6、repeat()方法

将字符串复制的次数

let stringValue = "na ";
console.log(stringValue.repeat(16) + "batman");
// na na na na na na na na na na na na na na na na batman

7、padStart()和 padEnd()方法

复制字符串，如果小于指定长度，则在相应一边填充字符（默认空格），直至满足长度条件。

let stringValue = "foo";
console.log(stringValue.padStart(6)); // " foo"
console.log(stringValue.padStart(9, ".")); // "......foo"
console.log(stringValue.padEnd(6)); // "foo "
console.log(stringValue.padEnd(9, ".")); // "foo......"

如果提供了多个字符的字符串，则会将其拼接并截断以匹配指定长度。此外，如果长度小于或等于字符串长度，则会返回原始字符串

let stringValue = "foo";
console.log(stringValue.padStart(8, "bar")); // "barbafoo"
console.log(stringValue.padStart(2)); // "foo"
console.log(stringValue.padEnd(8, "bar")); // "foobarba"
console.log(stringValue.padEnd(2)); // "foo"

8、字符串迭代与解构

1、迭代

字符串的原型上暴露了一个@@iterator 方法，表示可以迭代字符串的每个字符。

let message = "abc";
let stringIterator = message[Symbol.iterator]();
console.log(stringIterator.next()); // {value: "a", done: false}
console.log(stringIterator.next()); // {value: "b", done: false}
console.log(stringIterator.next()); // {value: "c", done: false}
console.log(stringIterator.next()); // {value: undefined, done: true}
在 for-of 循环中可以通过这个迭代器按序访问每个字符：
for (const c of "abcde") { console.log(c);
}
// a
// b
// c
// d
// e

2、解构（[…]）

let message = "abcde";
console.log([...message]); // ["a", "b", "c", "d", "e"]

9、字符串大小写转换

let stringValue = "hello world";
//在少数语言中（如土耳其语）
console.log(stringValue.toLocaleUpperCase()); // "HELLO WORLD"
console.log(stringValue.toUpperCase()); // "HELLO WORLD"
console.log(stringValue.toLocaleLowerCase()); // "hello world"
console.log(stringValue.toLowerCase()); // "hello world"

10、字符串模式匹配方法

1、match

RegExp 对象的 exec()方法相同

let text = "cat, bat, sat, fat";
let pattern = /.at/;
// 等价于 pattern.exec(text)
let matches = text.match(pattern);
console.log(matches.index); // 0
console.log(matches[0]); // "cat"
console.log(pattern.lastIndex); // 0

2、search

返回第一个匹配的位置索引，如果没找到则返回-1

let text = "cat, bat, sat, fat";
let pos = text.search(/at/);
console.log(pos); // 1

3、replace

let text = "cat, bat, sat, fat";
//匹配第一个
let result = text.replace("at", "ond");
console.log(result); // "cond, bat, sat, fat"
//全匹配
result = text.replace(/at/g, "ond");
console.log(result); // "cond, bond, sond, fond"

11、localeCompare()方法

比较两个字符串

 如果按照字母表顺序，字符串应该排在字符串参数前头，则返回负值。（通常是-1，具体还要看

与实际值相关的实现。）

 如果字符串与字符串参数相等，则返回 0。

 如果按照字母表顺序，字符串应该排在字符串参数后头，则返回正值。（通常是 1，具体还要看

与实际值相关的实现。）

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

12、HTML 方法

早期浏览器扩展了规范，增加了辅助生成 HTML 标签的方法。