创建一个可变长度的字符串,填充重复的字符

tal*_*myn 150 html javascript string

所以,我的问题已由其他人在其Java表单中提出:Java - 创建一个具有指定长度并填充特定字符的新String实例.最佳方案?

...但我正在寻找它的JavaScript等价物.

基本上,我想根据每个字段的"maxlength"属性动态填充带有"#"字符的文本字段.因此,如果输入有maxlength="3",则该字段将填充"###".

理想情况下会有像Java这样的东西StringUtils.repeat("#", 10);,但到目前为止,我能想到的最好的选择是循环并追加"#"字符,一次一个,直到达到最大长度.我无法摆脱这种感觉,即有一种比这更有效的方法.

有任何想法吗?

仅供参考 - 我不能简单地在输入中设置默认值,因为"#"字符需要清除焦点,如果用户没有输入值,则需要在模糊时"重新填充".这是我关注的"补充"步骤

Poi*_*nty 290

这样做的最佳方式(我见过)是

var str = new Array(len + 1).join( character );
Run Code Online (Sandbox Code Playgroud)

这将创建一个具有给定长度的数组,然后将其与给定的字符串连接以重复..join()无论元素是否分配了值,该函数都会遵循数组长度,未定义的值将呈现为空字符串.

您必须将1添加到所需的长度,因为分隔符字符串位于数组元素之间.

  • String.prototype内置的新`repeat`函数现在处理这个(ES6 +) (21认同)
  • 请注意,此解决方案非常慢.它看起来很性感,但可能完全是错误的做法. (10认同)

小智 137

试一试:P

s = '#'.repeat(10)

document.body.innerHTML = s
Run Code Online (Sandbox Code Playgroud)

  • 绝对是最简单的实现,但也是最不受支持的,因为它是ECMAScript 6的一部分.看起来,现在,它仅支持Firefox,Chrome和桌面版Safari. (4认同)
  • 如果您不介意使用[lodash](https://lodash.com/docs#repeat),可以使用以下命令:`_.repeat('*',10);` (4认同)
  • 现在是2018年,ES6已经成熟 - 这应该是公认的答案.如果需要为那些不使用Babel或类似东西的人支持旧版浏览器,可以使用上面提到的lodash,或者使用polyfill进行备份. (4认同)

Zer*_*ony 30

不幸的是,尽管这里提到的Array.join方法简洁,但它比基于字符串连接的实现慢大约10倍.它对大字符串执行得特别糟糕.请参阅下面的完整性能详细信息

在Firefox,Chrome,Node.js MacOS,Node.js Ubuntu和Safari上,我测试的最快实现是:

function repeatChar(count, ch) {
    if (count == 0) {
        return "";
    }
    var count2 = count / 2;
    var result = ch;

    // double the input until it is long enough.
    while (result.length <= count2) {
        result += result;
    }
    // use substring to hit the precise length target without
    // using extra memory
    return result + result.substring(0, count - result.length);
};
Run Code Online (Sandbox Code Playgroud)

这很冗长,所以如果你想要一个简洁的实现,你可以采用天真的方法; 它仍然比Array.join方法好2到10倍,并且比小输入的加倍实现更快.码:

// naive approach: simply add the letters one by one
function repeatChar(count, ch) {
    var txt = "";
    for (var i = 0; i < count; i++) {
        txt += ch;
    }
    return txt;
}
Run Code Online (Sandbox Code Playgroud)

更多的信息:


Hog*_*gan 22

我会创建一个常量字符串,然后在其上调用substring.

就像是

var hashStore = '########################################';

var Fiveup = hashStore.substring(0,5);

var Tenup = hashStore.substring(0,10);
Run Code Online (Sandbox Code Playgroud)

也快一点.

http://jsperf.com/const-vs-join


小智 12

ES2015最简单的方法就是做点什么

'X'.repeat(data.length)

X是任何字符串,data.length是所需的长度.

请参阅:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat


Men*_*ndy 10

一个很好的 ES6 选项是padStart空字符串。像这样:

var str = ''.padStart(10, "#");
Run Code Online (Sandbox Code Playgroud)

注意:这在 IE 中不起作用(没有 polyfill)。

  • 有什么特别的理由让您推荐这种 ES6 方法而不是上面@user4227915 的回答中的另一种方法(`s = '#'.repeat(10)`)? (5认同)