Raccourcir une chaîne de caractères sans couper de mots en JavaScript

Question

Je ne suis pas très doué pour la manipulation de chaînes de caractères en JavaScript, et je me demandais comment on pouvait raccourcir une chaîne de caractères sans couper de mot. Je sais comment utiliser substring, mais pas indexOf ou quoi que ce soit d'autre.

Supposons que je dispose de la chaîne suivante :

text = "this is a long string I cant display"

Je veux le réduire à 10 caractères, mais s'il ne se termine pas par un espace, terminez le mot. Je ne veux pas que la variable chaîne ressemble à ceci :

"C'est une longue ficelle que je ne peux pas rompre.

Je veux qu'il termine le mot jusqu'à ce qu'un espace se produise.

Answer 1

Voici une solution en une ligne.

text = "this is a long string I cant display"

function shorten(text,max) {
    return text && text.length > max ? text.slice(0,max).split(' ').slice(0, -1).join(' ') : text
}

console.log(shorten(text,10));

Answer 2

Basé sur la réponse de NT3RP qui ne gère pas certains cas particuliers, j'ai créé ce code. Il garantit de ne pas retourner un texte avec une taille > maxLength event une ellipse ... a été ajouté à la fin.

Cela permet également de gérer certains cas particuliers, comme un texte dont un seul mot est > maxLength.

shorten: function(text,maxLength,options) {
    if ( text.length <= maxLength ) {
        return text;
    }
    if ( !options ) options = {};
    var defaultOptions = {
        // By default we add an ellipsis at the end
        suffix: true,
        suffixString: " ...",
        // By default we preserve word boundaries
        preserveWordBoundaries: true,
        wordSeparator: " "
    };
    $.extend(options, defaultOptions);
    // Compute suffix to use (eventually add an ellipsis)
    var suffix = "";
    if ( text.length > maxLength && options.suffix) {
        suffix = options.suffixString;
    }

    // Compute the index at which we have to cut the text
    var maxTextLength = maxLength - suffix.length;
    var cutIndex;
    if ( options.preserveWordBoundaries ) {
        // We use +1 because the extra char is either a space or will be cut anyway
        // This permits to avoid removing an extra word when there's a space at the maxTextLength index
        var lastWordSeparatorIndex = text.lastIndexOf(options.wordSeparator, maxTextLength+1);
        // We include 0 because if have a "very long first word" (size > maxLength), we still don't want to cut it
        // But just display "...". But in this case the user should probably use preserveWordBoundaries:false...
        cutIndex = lastWordSeparatorIndex > 0 ? lastWordSeparatorIndex : maxTextLength;
    } else {
        cutIndex = maxTextLength;
    }

    var newText = text.substr(0,cutIndex);
    return newText + suffix;
}

Je pense que vous pouvez facilement supprimer la dépendance de jquery si cela vous gêne.

Answer 3

Je suis en retard, mais voici une petite solution facile que j'ai trouvée pour renvoyer un nombre de mots.

Ce n'est pas directement lié à votre demande de personnages mais il sert la même chose résultat que vous recherchiez, je crois.

function truncateWords(sentence, amount, tail) {
  const words = sentence.split(' ');

  if (amount >= words.length) {
    return sentence;
  }

  const truncated = words.slice(0, amount);
  return `${truncated.join(' ')}${tail}`;
}

const sentence = 'Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.';

console.log(truncateWords(sentence, 10, '...'));

Voir l'exemple de travail ici : https://jsfiddle.net/bx7rojgL/

Answer 4

function shorten(str,n) {
  return (str.match(RegExp(".{"+n+"}\\S*"))||[str])[0];
}

shorten("Hello World", 3); // "Hello"

// SHORTEN STRING TO WHOLE WORDS
function shorten(s,l) {
  return (s.match(new RegExp(".{"+l+"}\\S*"))||[s])[0];
}

console.log( shorten("The quick brown fox jumps over the lazy dog", 6) ); // "The quick"

Answer 5

J'ai adopté une approche différente. Bien que j'aie besoin d'un résultat similaire, je voulais que ma valeur de retour soit inférieure à la longueur spécifiée.

function wordTrim(value, length, overflowSuffix) {
    value = value.trim();
    if (value.length <= length) return value;
    var strAry = value.split(' ');
    var retString = strAry[0];
    for (var i = 1; i < strAry.length; i++) {
        if (retString.length >= length || retString.length + strAry[i].length + 1 > length) break;
        retString += " " + strAry[i];
    }
    return retString + (overflowSuffix || '');
}

Éditer Je l'ai un peu remanié ici : Exemple de JSFiddle . Il rejoint le tableau original au lieu de le concaténer.

function wordTrim(value, length, overflowSuffix) {
    if (value.length <= length) return value;
    var strAry = value.split(' ');
    var retLen = strAry[0].length;
    for (var i = 1; i < strAry.length; i++) {
        if(retLen == length || retLen + strAry[i].length + 1 > length) break;
        retLen+= strAry[i].length + 1
    }
    return strAry.slice(0,i).join(' ') + (overflowSuffix || '');
}