【问题标题】:How to trim a string to N chars in Javascript?如何在Javascript中将字符串修剪为N个字符?
【发布时间】:2011-11-19 18:57:44
【问题描述】:

我如何使用 Javascript 创建一个函数,将作为参数传递的字符串修剪为指定长度,也作为参数传递。例如:

var string = "this is a string";
var length = 6;
var trimmedString = trimFunction(length, string);

// trimmedString should be:
// "this is"

有人有想法吗?我听说过一些关于使用子字符串的事情,但不太明白。

【问题讨论】:

  • "this is" = 7 个字符,你打算这样吗?
  • 正如问题中所说,我不太确定如何使用子字符串来执行此操作。你能给我举个例子吗?我会接受当然是一个答案,如果它有效;)@Interstellar_Coder 哎呀,错字!

标签: javascript string trim


【解决方案1】:

为什么不只使用子字符串...string.substring(0, 7); 第一个参数 (0) 是起点。第二个参数 (7) 是结束点(不包括)。 More info here.

var string = "this is a string";
var length = 7;
var trimmedString = string.substring(0, length);

【讨论】:

  • 谢谢!完美运行。超过时限我会第一时间标记为答案!
  • 如果你想要超过最大长度的字符串的省略号(可能对更长的最大值更有帮助): var string = "this is a string";变量长度 = 20; var trimmedString = string.length > 长度? string.substring(0, length - 3) + "..." : string.substring(0, length);
  • 请注意 string.substr(start, length) 的行为很奇怪,如果 length 大于字符串的长度,它将返回空。 string.substring(start, end) 按预期工作,即如果给定的结尾没有足够的字符,它将返回字符串直到它的结尾!
  • 使用string.substr。尽管有先前的评论,但它没有奇怪的行为
  • .substring(from, to) 接受indices。 .substr(from, length) 不会,另外 .substr() used to 在第一个参数为负数时在 IE 中会出现不一致。
【解决方案2】:

【讨论】:

    【解决方案3】:

    Will's 的评论复制到答案中,因为我发现它很有用:

    var string = "this is a string";
    var length = 20;
    var trimmedString = string.length > length ? 
                        string.substring(0, length - 3) + "..." : 
                        string;
    

    谢谢威尔。

    对于任何关心https://jsfiddle.net/t354gw7e/ 的人来说,一个 jsfiddle :)

    【讨论】:

    • 在 else 情况下使用 string.substring(0, length) 没有意义,因为此时字符串保证为 string。
    • 要多插入两个字符,请使用省略号
    【解决方案4】:

    我建议使用扩展来保持代码整洁。 请注意,扩展内部对象原型可能会弄乱依赖它们的库。

    String.prototype.trimEllip = function (length) {
      return this.length > length ? this.substring(0, length) + "..." : this;
    }
    

    并像这样使用它:

    var stringObject= 'this is a verrrryyyyyyyyyyyyyyyyyyyyyyyyyyyyylllooooooooooooonggggggggggggsssssssssssssttttttttttrrrrrrrrriiiiiiiiiiinnnnnnnnnnnnggggggggg';
    stringObject.trimEllip(25)
    

    【讨论】:

    • 为什么不呢?因为您正在覆盖标准对象.trim() 的原型。这可能会导致您可能使用的其他库和工具出现意外行为。
    • 这就是我所需要的
    【解决方案5】:

    有点晚了……我不得不回应。这是最简单的方法。

    // JavaScript
    function fixedSize_JS(value, size) {
      return value.padEnd(size).substring(0, size);
    }
    
    // JavaScript (Alt)
    var fixedSize_JSAlt = function(value, size) {
      return value.padEnd(size).substring(0, size);
    }
    
    // Prototype (preferred)
    String.prototype.fixedSize = function(size) {
      return this.padEnd(size).substring(0, size);
    }
    
    // Overloaded Prototype
    function fixedSize(value, size) {
      return value.fixedSize(size);
    }
    
    // usage
    console.log('Old school JS -> "' + fixedSize_JS('test (30 characters)', 30) + '"');
    console.log('Semi-Old school JS -> "' + fixedSize_JSAlt('test (10 characters)', 10) + '"');
    console.log('Prototypes (Preferred) -> "' + 'test (25 characters)'.fixedSize(25) + '"');
    console.log('Overloaded Prototype (Legacy support) -> "' + fixedSize('test (15 characters)', 15) + '"');

    一步一步来。 .padEnd - 保证字符串的长度

    "padEnd() 方法用给定字符串填充当前字符串(重复,如果需要),以使结果字符串达到给定长度。填充从当前字符串的末尾(右)应用。源这个交互式示例存储在 GitHub 存储库中。” 来源:developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/...

    .substring - 限制你需要的长度

    如果您选择添加省略号,请将它们附加到输出中。

    我给出了 4 个常见的 JavaScript 用法示例。我强烈建议使用带有重载的字符串原型来获得旧版支持。它使以后实施和更改变得更加容易。

    【讨论】:

    • 您好!最好还包括一些关于您的代码发生了什么的解释。鉴于您的解决方案与已接受的答案有多么相似,也许是关于 padEnd 正在做什么的一些细节。
    • 我的解决方案更干净、更标准化,而且它显示了多种用法。 padEnd() 方法用给定的字符串填充当前字符串(如果需要,重复),以使结果字符串达到给定的长度。从当前字符串的末尾(右侧)应用填充。此交互式示例的源代码存储在 GitHub 存储库中。来源:developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
    • 我不是在质疑您回答的质量。只是关于如何使它变得更好的建议。你的解释很好 - 编辑你的答案并把它放在那里!
    • 嗨,马特,我喜欢你的回答。很遗憾,您正在回答一个有点不同的问题。他最初询问的是修剪字符串,而不是返回的固定字符串长度。
    【解决方案6】:
        let trimString = function (string, length) {
          return string.length > length ? 
                 string.substring(0, length) + '...' :
                 string;
        };
    

    用例,

    let string = 'How to trim a string to N chars in Javascript';
    
    trimString(string, 20);
    
    //How to trim a string...
    

    【讨论】:

      【解决方案7】:

      我认为你应该使用这段代码:-)

          // sample string
                  const param= "Hi you know anybody like pizaa";
      
               // You can change limit parameter(up to you)
               const checkTitle = (str, limit = 17) => {
            var newTitle = [];
            if (param.length >= limit) {
              param.split(" ").reduce((acc, cur) => {
                if (acc + cur.length <= limit) {
                  newTitle.push(cur);
                }
                return acc + cur.length;
              }, 0);
              return `${newTitle.join(" ")} ...`;
            }
            return param;
          };
          console.log(checkTitle(str));
      
      // result : Hi you know anybody ...
      

      【讨论】:

      • 我很好奇你为什么添加这个答案。这个问题已经有一个公认的答案和其他几个合理的答案,所有这些都比这更简单。还是你的“:-)”是为了开玩笑?
      • 请注意,接受的答案也是评分最高的答案。我认为你在这里试图解决一个不同的问题。 (而且我之前评论时并没有注意到这一点。)这并不是一个不太可能的问题,但最终它与所提出的问题略有相关。你的还有一个奇怪的效果,在给定的输入下,你的输出字符串是23字符长,比17默认参数加上后缀" ..."中的4字符长。这似乎很奇怪。
      • 我也认为这可以使用simpler implementation
      【解决方案8】:

      只是另一个建议,删除任何尾随空格

      limitStrLength = (text, max_length) => {
          if(text.length > max_length - 3){
              return text.substring(0, max_length).trimEnd() + "..."
          }
          else{
              return text
          }
      

      【讨论】:

        【解决方案9】:

        有几种方法可以做到这一点

        let description = "your test description your test description your test description";
        let finalDesc = shortMe(description, length);
        
        function finalDesc(str, length){
        
        // return str.slice(0,length);
        
        // return str.substr(0, length);
        
        // return str.substring(0, length);
        
        }
        

        您也可以修改此函数以进入字符串之间。

        【讨论】:

          猜你喜欢
          • 2012-01-15
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2010-10-04
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多