在 ES7 中，String 原型对象新增了两个方法：startsWith 和 endsWith，它们可以方便地判断一个字符串是否以另一个字符串开头或结尾。在前端开发中，这两个方法非常实用，本文将详细介绍它们的使用方法和指导意义。
String.prototype.startsWith
startsWith 方法用于判断一个字符串是否以另一个字符串开头。它的语法如下：
str.startsWith(searchString[, position])
其中，searchString 表示要搜索的子字符串，position 表示从字符串的哪个位置开始搜索（可选参数，默认为 0）。
startsWith 方法返回一个布尔值，表示搜索到的子字符串是否位于字符串的开头。
下面是一个示例代码：
const str = 'hello world'; const prefix = 'hello'; console.log(str.startsWith(prefix)); // true
在上面的代码中，我们定义了一个字符串 str，然后使用 startsWith 方法判断它是否以 'hello' 开头，结果为 true。
String.prototype.endsWith
endsWith 方法用于判断一个字符串是否以另一个字符串结尾。它的语法如下：
str.endsWith(searchString[, length])
其中，searchString 表示要搜索的子字符串，length 表示从字符串的哪个位置开始搜索（可选参数，默认为字符串的长度）。
endsWith 方法返回一个布尔值，表示搜索到的子字符串是否位于字符串的结尾。
下面是一个示例代码：
const str = 'hello world'; const suffix = 'world'; console.log(str.endsWith(suffix)); // true
在上面的代码中，我们定义了一个字符串 str，然后使用 endsWith 方法判断它是否以 'world' 结尾，结果为 true。
指导意义
startsWith 和 endsWith 方法可以用于许多场景，例如：
- 判断一个 URL 是否以某个协议开头（如 http://、https://、ftp:// 等）。
- 判断一个文件名是否以某个扩展名结尾（如 .jpg、.png、.html 等）。
- 判断一个 DOM 元素的 class 是否包含某个关键字。
使用 startsWith 和 endsWith 方法可以让我们的代码更加简洁和易读。例如，下面是一个使用正则表达式判断一个 URL 是否以 http:// 开头的代码：
const url = 'http://www.example.com'; const regex = /^http:\/\//; console.log(regex.test(url)); // true
使用 startsWith 方法，我们可以将上面的代码简化为：
const url = 'http://www.example.com';
console.log(url.startsWith('http://')); // true可以看到，使用 startsWith 方法不仅代码更加简洁，而且更加易读。
总结
ES7 中的 startsWith 和 endsWith 方法可以方便地判断一个字符串是否以另一个字符串开头或结尾，它们的使用可以让我们的代码更加简洁和易读。在前端开发中，我们可以将它们用于许多场景，例如判断 URL、文件名、DOM 元素的 class 等。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/650937c595b1f8cacd3f74e7