在 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