白学的小知识[ES6新增操作字符串的七种方法.ES6模板字符串]

本文介绍了ES6中新增的七种字符串操作方法,包括includes()、startsWith()、endsWith()等函数,以及模板字符串的使用,如拼接和换行功能。

 ES6新增操作字符串的七种方法:

1.includes() [重点]

返回布尔值,判断是否找到参数字符串

2.startsWith()

返回布尔值,判断参数字符串是否在原字符串的头部

3.endsWith()

返回布尔值,判断参数字符串是否在原字符串的尾部

4.repeat(number)

返回新的字符串,表示将字符串重复指定次数返回

5.padStart(总长度,“填充的字符串”)

返回新的字符串,表示用参数字符串从头部(左侧)补全原字符串

6.padEnd(总长度,“填充的字符串”)

返回新的字符串,表示用参数字符串从尾部(右侧)补全原字符串

:

7.模板字符串

ES6模板字符串:

1.拼接:使用反引号 `` 作为字符串的定界符分隔的字面量。

<script>
    const name = "杰克";
	const age = 18;
    // 模板字符串,切记使用反引号
    console.log(`大家好,我的名字叫${name},我今年${age}岁`)
</script>

样式:

2.换行:出现一行装不下的情况时,我们需要使用+号来拼接。

<script>
       const name = "杰克";
       const age = 18;
       // 一行装不下我们需要用+来拼接
       console.log("大家好,我的名字叫杰克"
       +"今年18岁了")
</script>

样式:

### ES6新增字符串方法及其返回值说明 以下为ES6新增字符串方法列表及其返回值说明: 1. **`String.fromCodePoint()`** - 根据代码点创建一个字符串。它是 `String.fromCharCode()` 的升级版本,支持生成大于 `0xFFFF` 的 Unicode 字符。 - 返回值:生成的新字符串[^4]。 ```javascript console.log(String.fromCodePoint(0x2F804)); // "你" ``` 2. **`str.codePointAt()`** - 返回指定索引处的 UTF-16 代码点。如果该位置不是一个代码单元序列的首部,则返回其自身的代码点。 - 返回值:指定索引处的代码点数值或 `undefined`(如果索引无效)[^4]。 ```javascript console.log("𠮷".codePointAt(0)); // 134071 ``` 3. **`str.includes()`** - 判断当前字符串是否包含指定的子字符串,返回布尔值 `true` 或 `false`。 - 返回值:布尔值 `true` 或 `false`[^5]。 ```javascript let str = "疯狂的大番茄分分钟拿捏你"; console.log(str.includes("擦")); // false ``` 4. **`str.startsWith()`** - 判断当前字符串是否以指定的子字符串开头,返回布尔值 `true` 或 `false`。 - 返回值:布尔值 `true` 或 `false`[^5]。 ```javascript let str = "疯狂的大番茄分分钟拿捏你"; console.log(str.startsWith("疯")); // true ``` 5. **`str.endsWith()`** - 判断当前字符串是否以指定的子字符串结尾,返回布尔值 `true` 或 `false`。 - 返回值:布尔值 `true` 或 `false`[^5]。 ```javascript let str = "疯狂的大番茄分分钟拿捏你"; console.log(str.endsWith("捏你")); // true ``` 6. **`str.repeat()`** - 构造并返回一个新字符串,表示将原字符串重复指定次数后连接在一起的结果。 - 返回值:生成的新字符串[^2]。 ```javascript console.log("*".repeat(50)); console.log("Eula-".repeat(10)); ``` 7. **`str.padStart()`** - 用另一个字符串填充当前字符串,确保其长度达到指定的最小长度,填充发生在字符串的开头。 - 返回值:生成的新字符串[^4]。 ```javascript console.log("5".padStart(3, "0")); // "005" ``` 8. **`str.padEnd()`** - 用另一个字符串填充当前字符串,确保其长度达到指定的最小长度,填充发生在字符串的末尾。 - 返回值:生成的新字符串[^4]。 ```javascript console.log("5".padEnd(3, "0")); // "500" ``` 9. **`str.trimStart()` 和 `str.trimEnd()`** - `trimStart()` 消除字符串头部的空格;`trimEnd()` 消除字符串尾部的空格。两者均返回新的字符串,不会修改原始字符串。 - 返回值:生成的新字符串[^3]。 ```javascript const s = ' abc '; console.log(s.trimStart()); // "abc " console.log(s.trimEnd()); // " abc" ``` 10. **模板字符串(Template Literals)** - 允许嵌入表达式的字符串字面量,支持多行字符串字符串插值功能。 - 返回值:生成的新字符串[^2]。 ```javascript let name = "Alice"; let age = 25; console.log(`Hello, ${name}. You are ${age} years old.`); ``` 11. **`str.matchAll()`** - 返回一个迭代器对象,其中包含正则表达式与字符串匹配的所有结果。 - 返回值:返回一个迭代器对象。 ```javascript let str = "abcabcabc"; let regex = /abc/g; let matches = str.matchAll(regex); for (let match of matches) { console.log(match); // ["abc", index: 0, input: "abcabcabc", groups: undefined] } ``` 12. **`str.replaceAll()`** - 替换所有匹配子串为指定的新子串或通过函数返回的值。 - 返回值:生成的新字符串[^4]。 ```javascript let str = "The rain in SPAIN stays mainly in the plain."; let newStr = str.replaceAll("ain", "ane"); console.log(newStr); // "The rane in SPANE stays manely in the plane." ``` 13. **`str.at()`** - 获取指定索引位置的字符,支持负数索引(从字符串末尾开始计数)。 - 返回值:指定索引处的字符或 `undefined`(如果索引无效)。 ```javascript let str = "hello"; console.log(str.at(-1)); // "o" ``` 14. **`String.raw()`** - 返回一个未转义的字符串,通常用于模板字符串的标签函数。 - 返回值:生成的新字符串。 ```javascript console.log(String.raw`Hello\nWorld`); // "Hello\\nWorld" ``` 15. **`str.normalize()`** - 返回标准化后的字符串,用于处理不同编码形式的字符(如 NFC、NFD 等)。 - 返回值:生成的新字符串[^4]。 ```javascript console.log("é".normalize("NFD")); // "e\u0301" ``` --- ###
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值