ECMAScript 2016 (ES7) 新特性之 String.prototype.padStart()

近年来，前端发展迅速，不断涌现出各种新技术和工具，而 ECMAScript（简称 ES）作为前端开发的基础语言，也不断推陈出新。

ECMAScript 2016（ES7）是 ES 的第七个版本，该版本发布于 2016 年 6 月。本文主要介绍其中的一个新特性：String.prototype.padStart()。

String.prototype.padStart() 简介

String.prototype.padStart() 方法可以在一个字符串的开头填充指定的字符，使其达到指定的长度。该方法的语法如下：

str.padStart(targetLength, [padString])

其中，str 表示需要进行填充操作的字符串，targetLength 表示填充后字符串需要达到的长度，如果该参数小于 str.length，则返回原字符串。padString 表示填充所使用的字符，默认为 " "（空格）。

应用场景

比较字符串长度

在开发中，我们经常需要判断两个字符串的长度是否相等。在 ES6 之前，通常的做法是补零操作，如下所示：

// javascriptcn.com 代码示例
function isEqualLength(str1, str2) {
  const length1 = str1.length;
  const length2 = str2.length;
  if (length1 === length2) {
    return true;
  } else if (length1 > length2) {
    str2 = "0".repeat(length1 - length2) + str2;
  } else {
    str1 = "0".repeat(length2 - length1) + str1;
  }
  return str1 === str2;
}

上述代码使用了 repeat() 方法来实现字符串的补零操作，但是对于很长的字符串来说，性能可能会受到影响。

而使用 String.prototype.padStart() 方法实现字符串长度比较，代码则更加简洁易懂：

function isEqualLength(str1, str2) {
  return str1.padStart(str2.length, "0") === str2.padStart(str1.length, "0");
}

生成指定格式的字符串

在一些场景下，我们需要生成一些格式固定的字符串，如订单号、流水号等。使用 String.prototype.padStart() 方法可以方便地实现这一操作，如下所示：

function generateOrderId(orderNumber) {
  return `ORDER-${orderNumber.toString().padStart(8, "0")}`;
}

该函数将生成格式为 "ORDER-00002345" 的订单号，其中数字默认补足长度为 8 。

示例代码

下面是一个简单的示例，演示 String.prototype.padStart() 方法的具体使用：

const num1 = "123";
const num2 = "4567";

console.log(num1.padStart(5, "0")); // "00123"
console.log(num2.padStart(5, "0")); // "04567"
console.log(num1.padStart(2, "0")); // "123"
console.log(num2.padStart(2, "0")); // "4567"

总结

通过本文的介绍，我们了解了 ECMAScript 2016（ES7）的新特性 String.prototype.padStart() 的基本用法和应用场景。相信这一新特性会在实际开发中发挥出更大的作用，提高代码的可读性和效率。

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/652e2a367d4982a6ebf379c9