Abréviation intelligente des cordes

Points de base

• La fonction abbreviate() dans JavaScript raccourcit intelligemment la chaîne à la longueur maximale spécifiée, garantissant qu'il ne se brise pas au milieu du mot et supprimant les espaces inutiles.
• Cette fonction prend trois paramètres: la chaîne d'entrée d'origine, la longueur de sortie maximale et un suffixe facultatif, ajouté à la fin de la chaîne d'abréviation. Si le suffixe n'est pas défini, la valeur par défaut est "...", indiquant l'abréviation.
• Cette fonction peut être utilisée dans n'importe quel scénario où les longueurs de chaîne doivent être limitées, telles que le traitement des entrées de formulaire, la création d'installations personnalisées, l'affichage des sujets de messagerie dans les listes de diffusion en ligne ou les données de prétraitement à envoyer via AJAX.
• L'efficacité de cette fonction est qu'elle est capable de diviser la chaîne d'entrée en un seul mot, puis de recombiner autant de mots que possible pour s'adapter à la longueur maximale. Il prépare également l'entrée pour éliminer les espaces en excès.

Cet article introduira une fonction JavaScript simple et efficace appelée abbreviate(), dont la fonction principale est comme son nom: raccourcit intelligemment la chaîne à une longueur spécifiée. Il garantit qu'il n'est pas tronqué au milieu du mot et prépare la chaîne pour éliminer les espaces en excès. Ce qui suit est le code de la fonction abbreviate:

<code class="language-javascript">function abbreviate(str, max, suffix) {
  if ((str = str.replace(/^\s+|\s+$/g, '').replace(/[\r\n]*\s*[\r\n]+/g, ' ').replace(/[ \t]+/g, ' ')).length <= max) {
    return str;
  }

  var
    abbr = '',
    str = str.split(' '),
    suffix = (typeof suffix !== 'undefined' ? suffix : ' ...'),
    max = (max - suffix.length);

  for (var len = str.length, i = 0; i < len; i++) {
    if ((abbr + str[i]).length <= max) {
      abbr += str[i] + ' ';
    } else {
      break;
    }
  }

  return abbr.replace(/[ ]$/g, '') + suffix;
}</code>

Cette fonction prend trois paramètres: la chaîne d'entrée d'origine, la longueur de sortie maximale et un suffixe facultatif, ajouté à la fin de la chaîne d'abréviation. Si le suffixe n'est pas défini, la valeur par défaut est "..." (un espace suivi de trois points), une indication d'abréviation commune et facilement reconnaissable.

Utilisation de la fonction

Cette fonction peut être utilisée dans n'importe quel scénario où les longueurs de chaîne doivent être limitées, comme une alternative plus intelligente aux expressions simples substr. Il existe de nombreuses applications possibles, telles que le traitement des entrées de formulaire, la création d'informations à outils personnalisées, l'affichage des sujets de messagerie dans les listes de diffusion en ligne ou les données de prétraitement à envoyer via AJAX. Par exemple, pour limiter la chaîne à 100 caractères et ajouter le suffixe par défaut, nous pouvons l'appeler comme ceci:

<code class="language-javascript">str = abbreviate(str, 100);</code>

Ceci est conceptuellement équivalent à cette expression substr:

<code class="language-javascript">str = str.substr(0, 96) + " ...";</code>

Mais c'est une approche très rugueuse, car elle provoque souvent la rupture de la chaîne de sortie au milieu du mot. La fonction abbreviate est conçue pour ne pas le faire, elle divise la chaîne avant le dernier mot au lieu de le diviser au milieu du mot. Par conséquent, la chaîne de sortie générée par sera généralement abbreviate() plus courte que la longueur maximale spécifiée par , mais ne sera jamais plus longue. La fonction prend également en compte les espaces requis pour le suffixe d'abréviation, c'est-à-dire, si la longueur maximale spécifiée est de 100, mais le suffixe lui-même est de 4 caractères, alors nous ne pouvons utiliser que jusqu'à 96 caractères de la chaîne d'entrée principale. Vous pouvez spécifier qu'il n'y a pas du tout de suffixe en passant une chaîne vide, ou si vous souhaitez abréger la chaîne de balise, vous pouvez la définir comme une balise de fermeture HTML. Par exemple, l'entrée suivante:

<code class="language-javascript">abbreviate("<p>One two three four five</p>", 15, "");</code>

produira cette sortie:

<code class="language-javascript">function abbreviate(str, max, suffix) {
  if ((str = str.replace(/^\s+|\s+$/g, '').replace(/[\r\n]*\s*[\r\n]+/g, ' ').replace(/[ \t]+/g, ' ')).length <= max) {
    return str;
  }

  var
    abbr = '',
    str = str.split(' '),
    suffix = (typeof suffix !== 'undefined' ? suffix : ' ...'),
    max = (max - suffix.length);

  for (var len = str.length, i = 0; i < len; i++) {
    if ((abbr + str[i]).length <= max) {
      abbr += str[i] + ' ';
    } else {
      break;
    }
  }

  return abbr.replace(/[ ]$/g, '') + suffix;
}</code>

Comment fonctionne la fonction

La clé de la fonction

abbreviate est la capacité de diviser la chaîne d'entrée en un seul mot, puis de recombiner autant de mots que possible pour s'adapter à la longueur maximale. Pour être plus efficace, nous devons nous assurer que les séparateurs entre les mots sont prévisibles, le moyen le plus simple consiste à minimiser les espaces internes - convertir les nouvelles lignes et les onglets en espaces, puis réduire les espaces successifs afin que chaque espace interne soit les blocs deviennent un espace . Bien sûr, il existe d'autres moyens de gérer cela - par exemple, nous pouvons définir une expression régulière plus flexible pour la segmentation qui prend en compte tous les différents types de caractères que nous pourrions trouver entre les mots. Il y a même un caractère limite de mot ("B") pour les expressions régulières, nous pouvons donc également l'utiliser. Mais j'ai trouvé le prétraitement de l'espace utile, surtout lors du traitement de l'entrée des utilisateurs. Et la séparation par la limite du mot ne produit pas les résultats attendus, car les tirets, les points, les virgules et la plupart des caractères spéciaux sont en fait considérés comme des limites de mots. Mais je pense qu'il est inapproprié de diviser les mots par ponctuation à moins que les personnages ne soient suivis par des espaces, de sorte que les mots traits et les extraits de code ne sont pas divisés au milieu. Ainsi, le premier travail de la fonction consiste à faire du prétraitement de l'espace, puis si le résultat est déjà plus court que le maximum spécifié par , nous pouvons le retourner directement:

<code class="language-javascript">str = abbreviate(str, 100);</code>

Si nous ne faisons pas cela, nous pouvons rencontrer des situations où les cordes sont abrégées lorsqu'elles n'ont pas besoin d'être abrégées, par exemple:

<code class="language-javascript">str = str.substr(0, 96) + " ...";</code>

S'il n'y a pas de première condition, nous obtiendrons la sortie de l'abréviation, car la valeur maximale spécifiée doit prendre en compte la durée du suffixe:

<code class="language-javascript">abbreviate("<p>One two three four five</p>", 15, "");</code>

L'ajout de la première condition produira une sortie non modifiée:

<code class="language-html"><p>One two></code>

Donc, à moins que nous ne revenons à ce stade, nous continuerons à compiler la chaîne abréviée - diviser la chaîne d'entrée par espace pour créer un seul mot, puis regrouper itérativement chaque paire d'espace de mot tant que l'abréviation de la chaîne est plus courte que la longueur maximale spécifiée. Une fois que nous avons compilé ce dont nous avons besoin, nous pouvons briser l'itération, puis couper les espaces restants à la fin de la chaîne d'abréviation, puis ajouter le suffixe et enfin renvoyer le résultat. Coupez les espaces restants de l'extrémité droite, puis ajoutez-le avec le suffixe par défaut, cela semble un peu gaspillé, mais cela permet de saisir le suffixe sans espaces du tout.

Conclusion

Il s'agit d'une fonction d'abréviation de chaîne simple mais intelligente qui prépare également l'entrée pour éliminer les espaces excédentaires. D'après mon expérience, les deux exigences apparaissent généralement en même temps, c'est pourquoi j'ai développé cette fonction pour fonctionner de cette façon.

(La partie FAQ est omise ici en raison de limitations de l'espace. Si nécessaire, une version pseudo-originale de la partie FAQ peut être fournie séparément.)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!