MDN wants to learn about developers like you: https://qsurvey.mozilla.com/s3/MDN-dev-survey

这是一个实验中的功能
此功能某些浏览器尚在开发中,请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订,所以在未来版本的浏览器中该功能的语法和行为可能随之改变。

padStart() 方法会用一个字符串填充当前字符串(如果需要的话会重复填充),在当前字符串的头部不断填充,直到它达到第一个参数中指定的目标长度。

语法

str.padStart(targetLength [, padString])

参数

targetLength
当前字符串需要填充到的目标长度。如果当前字符串原本就达到了该长度,那么该方法什么都不会做,直接返回原字符串。
padString 可选
填充字符串。如果在填充过程中发现用不完这一整个填充字符串,则优先用左侧部分,能用多少用多少。该参数为可选参数,默认值为空格 " " (U+0020).

返回值

在原字符串开头填充指定的填充字符串直到目标长度所形成的新字符串。

示例

'abc'.padStart(10);         // "       abc"
'abc'.padStart(10, "foo");  // "foofoofabc"
'abc'.padStart(6,"123465"); // "123abc"
'abc'.padStart(8, "0");     // "00000abc"
'abc'.padStart(1);          // "abc"

腻子脚本(Polyfill)

如果你本地不支持padStart()方法,可以在使用前添加下面的代码为String.prototype上添加padStart()方法。

// https://github.com/uxitten/polyfill/blob/master/string.polyfill.js
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/padStart
if (!String.prototype.padStart) {
    String.prototype.padStart = function padStart(targetLength,padString) {
        targetLength = targetLength>>0; //floor if number or convert non-number to 0;
        padString = String(padString || ' ');
        if (this.length > targetLength) {
            return String(this);
        }
        else {
            targetLength = targetLength-this.length;
            if (targetLength > padString.length) {
                padString += padString.repeat(targetLength/padString.length); //append to original to ensure we are longer than needed
            }
            return padString.slice(0,targetLength) + String(this);
        }
    };
}

说明

Specification Status Comment
ECMAScript Latest Draft (ECMA-262)
String.prototype.padStart
Living Standard Initial definition in ECMAScript 2017.

该方法目前仍是 ECMAScript 提案,还没有最终进入 ECMAScript 规范。

浏览器兼容性

FeatureChromeEdgeFirefoxInternet ExplorerOperaSafari
Basic Support571548154410
FeatureAndroidChrome for AndroidEdge mobileFirefox for AndroidIE mobileOpera AndroidiOS Safari
Basic Support?57(Yes)48No?10

另见

文档标签和贡献者

 此页面的贡献者: tjyas, ziyunfei
 最后编辑者: tjyas,