现代 CSS

JavaScript算法练习：重复字符串

作者：大漠 日期：2016-06-12 点击：3734
JavaScript
JavaScript学习笔记
JavaScript算法练习
会员专栏

特别声明：如果您喜欢小站的内容，可以点击申请会员进行全站阅读。如果您对付费阅读有任何建议或想法，欢迎发送邮件至: airenliao@gmail.com!或添加QQ：874472854(^_^)

这里所说的重复字符串是指对所给的字符串根据第一个数字参数重复次数。简单点说，就是创建一个repeat()函数，并且给这个函数传递两个参数，第一个参数是一个字符串str，而第二个参数是一个数字num。执行函数repeat(str, num)之后，字符串str就会重复，而且重复的次数由num来确定。

比如下面的一些示例：

  • repeatStringNumTimes("*", 3)返回***
  • repeatStringNumTimes("abc", 3)返回abcabcabc
  • repeatStringNumTimes("abc", 4)返回abcabcabcabc
  • repeatStringNumTimes("abc", 1)返回abc
  • repeatStringNumTimes("*", 8)返回********
  • repeatStringNumTimes("abc", -2)返回

实现思路

  • 若num小于0，返回空字符串，比如repeatStringNumTimes("abc", -2)返回
  • 若num大于0,返回重复num次数的字符串,比如repeatStringNumTimes("abc", 3)返回abcabcabc

关键点是在JavaScript中通过什么样的方法来做到重复字符串。实现重复字符串的方法也有多种：

  • 在循环中使用字符串相加,比如result += str
  • 在循环中将字符串str推入到(push())一个数组中arr，然后再通过join()方法连接在一起
  • 使用new Array()或Array.apply()结合join()方法，将重复字符串连接在一起
  • 使用ES6中的String.prototype.repeat()方法直接实现重复字符串的连接

实现方案

接下来主要收集和整理了一些实现方案，主要有通过while、for循环配合数组和字符串运算等方法。具体可以看下面的代码。

方法1

function repeat(str, num) {
    var result = "";
    while (num > 0) {
        result += str;
        num--;
    }
    /*
     * str = "abc", num = 3
     * 遍历次数  num   num > 0  result +=str                  num--
     * 1st      3      yes     "" + "abc" = "abc"              2
     * 2nd      2      yes     "abc" + "abc"= "abcabc"         1
     * 3rd      1      yes     "abcabc" + "abc" = "abcabcabc"  0
     * 4th      0      no
     * End Loop
     */
    return result; // "abcabcabc"
}

方法2

function repeat(str, num) {
    var array = [];

    for (i = 0; i < num; i++) {
        array.push(str);
    }
    /*
     *  str = "abc", num = 3
     *  遍历次数     i = ?   i < num    i++   array
     *  1st          0       yes       1     ['abc']
     *  2nd          1       yes       2     ['abc','abc']
     *  3rd          2       yes       3     ['abc','abc','abc']
     *  4th          3       no
     *  End Loop
     */
    return array.join('');// abcabcabc
}

或者

function repeat(str, num) {
    var array = [];
    for (var i = 1; i <= num;) {
        array[i++] = str;
    }
    return array.join('');
}

方法3

function repeat(str, num) {
    return (num < 0) ? "" : new Array(num + 1).join(str);
}

或者

function repeat(str, num) {
    return Array.apply(
        null, {
            length: num + 1
        }
    ).join(str);
}

方法4

function repeat(str, num) {
    if (num === 0) {
        return str;
    } else if (num > 0) {
        return str.repeat(num);
    } else {
        return "";
    }
    return str;
}

或者

function repeat(str, num) {
    if (num <= 0) {
        return str.repeat(0);
    } else {
        return str.repeat(num);
    }
}

也可以是：

function repeat(str, num) {
    if (num < 0) {
        return "";
    }
    if (num === 1){
        return str;
    }
    else{
        return str + repeat(str, num - 1);
    }
}

方法5

function repeat(str, num) {
    num = Number(num);

    var result = '';
    while (true) {
        if (num & 1) { // (1)
            result += str;
        }
        num >>>= 1; // (2)
        if (num <= 0) {break;}
        str += str;
    }

    return result;
}

或者

function repeat(str, num) {
    return (1 << (num - 1)).toString(2).replace(/./g, str);
}

总结

文章使用不同的方法实现重复字符串的功能。如果上面的方法有错，还望指正，或者您有更好的方案欢迎在下面的评论中分享。

扩展阅读

大漠

常用昵称“大漠”，W3CPlus创始人，目前就职于手淘。对HTML5、CSS3和Sass等前端脚本语言有非常深入的认识和丰富的实践经验，尤其专注对CSS3的研究，是国内最早研究和使用CSS3技术的一批人。CSS3、Sass和Drupal中国布道者。2014年出版《图解CSS3：核心技术与案例实战》。

如需转载，烦请注明出处：http://www.w3cplus.com/javascript/repeat-string-javascript.htmljordan shoes for sale outlet free

返回顶部