ES6 中的字符串扩展功能

在 ES6 中,字符串的功能得到了极大的扩展,这些功能包括字符串拼接、模板字符串、字符串的一些新方法等等。本文将详细介绍 ES6 中的字符串扩展功能,并提供示例代码。

字符串模板

ES6 提供了一种新的字符串类型,被称为模板字符串。模板字符串使用反引号 ` \ 包围,使得我们可以在其中插入变量或表达式。

const name = "Alice";
const greeting = `Hello, ${name}!`;
console.log(greeting); // "Hello, Alice!"

模板字符串中的表达式可以使用任意 JavaScript 表达式。在表达式周围使用一对大括号 {} 即可,注意不能使用分号。

const x = 10, y = 20;
const sum = `${x} + ${y} = ${x + y}`;
console.log(sum); // "10 + 20 = 30"

字符串拓展方法

字符串重复

ES6 为字符串添加了 repeat() 方法,可以将一个字符串重复若干次,返回一个新字符串。如果参数传入小数或负数,则会被自动转为 0。

const str = "123";
console.log(str.repeat(3)); // "123123123"
console.log(str.repeat(0)); // ""
console.log(str.repeat(-1)); // ""

字符串是否包含

ES6 为字符串添加了 includes() 方法,可以判断一个字符串是否包含另一个字符串,返回布尔值。第二个参数表示开始搜索的位置。

const str = "hello world";
console.log(str.includes("world")); // true
console.log(str.includes("hello", 1)); // false

字符串是否以指定字符串开头/结尾

ES6 为字符串添加了 startsWith() 和 endsWith() 方法,用于判断一个字符串是否以指定字符串开头或结尾,返回布尔值。第二个参数表示开始搜索的位置。

const str = "hello world";
console.log(str.startsWith("hello")); // true
console.log(str.endsWith("world")); // true
console.log(str.startsWith("world", 6)); // true
console.log(str.endsWith("hello", 5)); // true

字符串补全

ES6 为字符串添加了 padStart() 和 padEnd() 方法,用于将一个字符串补全为指定长度,返回一个新字符串。第一个参数是目标长度,第二个参数是用于补全的字符串,默认为空格。

const str = "abc";
console.log(str.padStart(6, "*")); // "**abc"
console.log(str.padEnd(6, "*")); // "abc**"

总结

ES6 中的字符串扩展功能简化了字符串处理的过程,并增强了可读性和可维护性。利用这些字符串新特性,我们可以更便捷地实现前端开发中的字符串操作。

来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/65a86d8fadd4f0e0ff18e8d8


纠错反馈