前端技术：将数字小于10的数补零

在前端开发中，有时候需要对数字进行操作。当我们需要显示一位数的时间或日期时，为了美观，我们需要将其补零。比如，小时数 9 应该是显示为 09。在这种情况下，我们可以使用 JavaScript 来实现它。

方法一：使用字符串方法 padStart()

ES6 中引入了 padStart() 和 padEnd() 方法，用于填充字符串达到指定长度。

let num = 9;
let str = num.toString().padStart(2, '0');
console.log(str); // "09"

上面代码中，我们先将数字转换为字符串，然后使用 padStart() 方法，在字符串前面添加零，使其总长度为 2。

方法二：使用三元运算符和模板字面量

如果你不想使用 ES6 的语法，也可以使用三元运算符和模板字面量来实现相同的效果。

let num = 9;
let str = num < 10 ? `0${num}` : num;
console.log(str); // "09"

上述代码使用了三元运算符，如果数字小于 10，则在数字前添加一个零。否则，返回原始数字。最后，使用模板字面量将结果转换为字符串。

总结

无论你选择哪种方法，都能轻松地将数字小于 10 的数补零。使用 padStart() 方法可以使代码更加简洁，可读性更高。而使用三元运算符和模板字面量则是一种不错的替代方案。

希望本文能够帮助你掌握这个有用的技巧。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/31491