Couper la chaîne en JavaScript?

1304

Comment découper une chaîne en JavaScript?

Vinod
la source
290
Il convient de mentionner deux ans après que cette question a été posée que String.trim () a été ajouté nativement dans JavaScript 1.8.1 / ECMAScript 5, pris en charge dans: Firefox 3.5+, Chrome / Safari 5+, IE9 + (en mode Standards uniquement!) Voir réponse de scunliffe: stackoverflow.com/a/8522376/8432
wweicker
46
String.trim()fonctionne également bien hors de la boîte dans Node.js.
Brad
47
Pour nitpick:, String.trim()la méthode de classe, n'existe pas dans ES5 / Node.js; à la place, String.prototype.trim()la méthode d'instance existe. Utilisation: ' foo '.trim()non String.trim(' foo ').
frontendbeauty
39
OMG, c'est 2013 et IE9 en mode compat n'a pas de méthode trim () sur String!
dbrin
80
A noter que dans jQuery, $.trim(str)est toujours disponible.
Sygmoral

Réponses:

893

Tous les navigateurs depuis IE9 + ont une trim()méthode pour les chaînes.

Pour les navigateurs qui ne prennent pas en charge trim(), vous pouvez utiliser ce polyfill de MDN :

if (!String.prototype.trim) {
    (function() {
        // Make sure we trim BOM and NBSP
        var rtrim = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;
        String.prototype.trim = function() {
            return this.replace(rtrim, '');
        };
    })();
}

Cela dit, si vous utilisez jQuery, $.trim(str)est également disponible et gère undefined / null.


Regarde ça:

String.prototype.trim=function(){return this.replace(/^\s+|\s+$/g, '');};

String.prototype.ltrim=function(){return this.replace(/^\s+/,'');};

String.prototype.rtrim=function(){return this.replace(/\s+$/,'');};

String.prototype.fulltrim=function(){return this.replace(/(?:(?:^|\n)\s+|\s+(?:$|\n))/g,'').replace(/\s+/g,' ');};
Pradeep Kumar Mishra
la source
87
A noter que dans jQuery, $.trim(str)est toujours disponible.
Sygmoral
481

Le trim de jQuery est pratique si vous utilisez déjà ce framework.

$.trim('  your string   ');

J'ai tendance à utiliser jQuery souvent, donc couper les chaînes avec lui est naturel pour moi. Mais il est possible qu'il y ait un contrecoup contre jQuery là-bas? :)

barneytron
la source
1
cela ne coupe que les espaces (newline) .. cela ne fonctionne pas comme le découpage php, où vous pouvez également découper les caractères
Jeffz
jQuery 3.5.0 a déprécié leur méthode de trim.
Herbert Peters
165

Bien qu'il y ait un tas de réponses correctes ci-dessus, il convient de noter que l' Stringobjet en JavaScript a une .trim()méthode native à partir d' ECMAScript 5 . Ainsi, idéalement, toute tentative de prototype de la méthode de découpage devrait vraiment vérifier si elle existe déjà en premier.

if(!String.prototype.trim){  
  String.prototype.trim = function(){  
    return this.replace(/^\s+|\s+$/g,'');  
  };  
}

Ajouté nativement dans: JavaScript 1.8.1 / ECMAScript 5

Ainsi soutenu dans:

Firefox: 3.5+

Safari: 5+

Internet Explorer: IE9 + (en mode Standards uniquement!) Http://blogs.msdn.com/b/ie/archive/2010/06/25/enhanced-scripting-in-ie9-ecmascript-5-support-and-more .aspx

Chrome: 5+

Opera: 10,5+

Tableau de support ECMAScript 5: http://kangax.github.com/es5-compat-table/

scunliffe
la source
128

Il existe de nombreuses implémentations qui peuvent être utilisées. Le plus évident semble être quelque chose comme ça:

String.prototype.trim = function() {
    return this.replace(/^\s+|\s+$/g, "");
};

" foo bar ".trim();  // "foo bar"
Gombo
la source
29

Je sais que cette question a été posée il y a trois ans.Maintenant, a String.trim()été ajoutée en natif dans JavaScript.Par exemple, vous pouvez couper directement comme suit,

document.getElementById("id").value.trim();
Vijin Paulraj
la source
3
Cela ne fonctionnera pas dans les versions ie, utilisez la méthode jQuery $ .trim (str) si vous le pouvez
Ben Taliadoros
22

Si vous utilisez jQuery, utilisez la jQuery.trim()fonction. Par exemple:

if( jQuery.trim(StringVariable) == '')
Able Alias
la source
20

Flagrant Badassery a 11 versions différentes avec des informations de référence:

http://blog.stevenlevithan.com/archives/faster-trim-javascript

Sans surprise, les expressions rationnelles sont plus lentes que les boucles traditionnelles.


Voici mon personnel. Ce code est vieux! Je l'ai écrit pour JavaScript1.1 et Netscape 3 et il n'a été que légèrement mis à jour depuis. (String.charAt d'origine utilisé)

/**
 *  Trim string. Actually trims all control characters.
 *  Ignores fancy Unicode spaces. Forces to string.
 */
function trim(str) {
    str = str.toString();
    var begin = 0;
    var end = str.length - 1;
    while (begin <= end && str.charCodeAt(begin) < 33) { ++begin; }
    while (end > begin && str.charCodeAt(end) < 33) { --end; }
    return str.substr(begin, end - begin + 1);
}
Tero
la source
14

Utilisez le code JavaScript natif Méthodes: String.trimLeft(), String.trimRight()et String.trim().


String.trim()est pris en charge dans IE9 + et tous les autres principaux navigateurs :

'  Hello  '.trim()  //-> 'Hello'


String.trimLeft()et ne String.trimRight()sont pas standard, mais sont pris en charge dans tous les principaux navigateurs sauf IE

'  Hello  '.trimLeft()   //-> 'Hello  '
'  Hello  '.trimRight()  //-> '  Hello'


Le support d'IE est facile avec un polyfill cependant:

if (!''.trimLeft) {
    String.prototype.trimLeft = function() {
        return this.replace(/^\s+/,'');
    };
    String.prototype.trimRight = function() {
        return this.replace(/\s+$/,'');
    };
    if (!''.trim) {
        String.prototype.trim = function() {
            return this.replace(/^\s+|\s+$/g, '');
        };
    }
}
Web_Designer
la source
1
@Brad True, mais ils ont toujours une large prise en charge du navigateur. Et le polyfill prend soin de toutes les incohérences.
Web_Designer
1
Vous devriez envisager de supprimer votre réponse. Il n'ajoute rien qui n'a pas déjà été couvert 5 fois par d'autres réponses déjà ici.
Brad
4
@Brad, je n'ai vu personne mentionner trimLeftou trimRight.
Web_Designer
1
@Brad Je préfère l'implémentation JavaScript native lorsqu'elle est disponible. Cette réponse fait son propre lTrim()et les rTrim()méthodes.
Web_Designer
1
@Brad Ils ne sont pas standard, mais certains navigateurs les prennent toujours en charge, donc dans ces navigateurs, il n'est pas nécessaire de créer un polyfill.
Web_Designer
11
String.prototype.trim = String.prototype.trim || function () {
    return this.replace(/^\s+|\s+$/g, "");
};

String.prototype.trimLeft = String.prototype.trimLeft || function () {
    return this.replace(/^\s+/, "");
};

String.prototype.trimRight = String.prototype.trimRight || function () {
    return this.replace(/\s+$/, "");
};

String.prototype.trimFull = String.prototype.trimFull || function () {
    return this.replace(/(?:(?:^|\n)\s+|\s+(?:$|\n))/g, "").replace(/\s+/g, " ");
};

Sans vergogne volé à Matt Duereg .

yckart
la source
7

Couper le code du projet angulaire js

var trim = (function() {

  // if a reference is a `String`.
  function isString(value){
       return typeof value == 'string';
  } 

  // native trim is way faster: http://jsperf.com/angular-trim-test
  // but IE doesn't have it... :-(
  // TODO: we should move this into IE/ES5 polyfill

  if (!String.prototype.trim) {
    return function(value) {
      return isString(value) ? 
         value.replace(/^\s*/, '').replace(/\s*$/, '') : value;
    };
  }

  return function(value) {
    return isString(value) ? value.trim() : value;
  };

})();

et l'appelle comme trim(" hello ")

rab
la source
5

utiliser simplement du code

var str = "       Hello World!        ";
alert(str.trim());

Prise en charge du navigateur

Feature         Chrome  Firefox Internet Explorer   Opera   Safari  Edge
Basic support   (Yes)   3.5     9                   10.5    5       ?

Pour l'ancien navigateur, ajoutez un prototype

if (!String.prototype.trim) {
  String.prototype.trim = function () {
    return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
  };
}
Behnam Mohammadi
la source
meilleure façon d'expliquer par rapport aux autres. mais modifiez-le un peu plus, je veux dire replaceregexp de fonction. je ne l'ai pas complètement compris. Voudriez-vous l'expliquer un peu plus la partie regexp?
muneeb_ahmed
4

Voici un moyen très simple:

function removeSpaces(string){
return string.split(' ').join('');
}
HenryDev
la source
1
vous vous rendez compte que cette question a été posée en 2009, n'est-ce pas? : D
GrafiCode
5
Ouais je sais. Mais j'ai décidé de partager ce que je sais au cas où quelqu'un en aurait besoin :)
HenryDev
3
tu l'as eu! l'esprit d'apprendre et de partager des choses est toujours une bonne chose!
HenryDev
3
"hello world" -> "helloworld"
Charlie Burns
2
Cette réponse est fausse. trimne doit supprimer que les espaces de début et de fin (qui incluent les tabulations et autres caractères). Cela supprime à la place tous les espaces, y compris ceux du milieu.
mbomb007
4

Utiliser trim()sur String qui est natif pourrait être le moyen le plus simple:

const fullName = "       Alireza Dezfoolian     ";
const trimmedFullName = fullName.trim();

console.log(trimmedFullName);

Alireza
la source
3

Vous pouvez simplement déclarer votre variable sous forme de chaîne et utiliser sa fonction de découpage:

var str = new String('my string'); 
str= str.trim();
Anahit Serobyan
la source
2

Aujourd'hui, presque tous les navigateurs sont compatibles String.prototype.trim().

Vous l'utilisez comme ceci:

var origStr = '   foo  ';
var newStr = origStr.trim(); // Value of newStr becomes 'foo'

Dans le cas où vous pourriez encore avoir besoin de prendre en charge un ancien navigateur qui ne prend pas en charge cette fonctionnalité, il s'agit d' un polyfill suggéré par le MDN:

if (!String.prototype.trim) {
    String.prototype.trim = function () {
       return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
    };
}
John Slegers
la source
1

J'ai une bibliothèque qui utilise le trim. donc résolu en utilisant le code suivant.

String.prototype.trim = String.prototype.trim || function(){ return jQuery.trim(this); };
Zesar
la source
1
Ce n'est pas une bonne solution. Prenons le cas où deux instances de jQuery sont chargées (un scénario courant avec des balises). Lorsque la 2e instance de jQuery se charge, il définit sa .trim()méthode égale à la native String.prototype.trimqui a déjà été définie return jQuery.trim(this), créant ainsi un débordement de pile.
Brad M
1
if(!String.prototype.trim){  
  String.prototype.trim = function(){  
    return this.replace(/^\s+|\s+$/gm,'');  
  };  
}

Des réponses précédentes, il diffère en ajoutant un indicateur m.

Flag mrecherchera le texte de plusieurs linéaires. Dans ce mode, la marque de début et de fin du motif ( ^ $) est insérée avant et après le caractère de nouvelle ligne ( \n).

simhumileco
la source
1

Vous pouvez le faire en utilisant le JavaScript simple:

function trimString(str, maxLen) {
if (str.length <= maxLen) {
return str;
}
var trimmed = str.substr(0, maxLen);
return trimmed.substr(0, trimmed.lastIndexOf(' ')) + '…';
}

// Let's test it

sentenceOne = "too short";
sentencetwo = "more than the max length";

console.log(trimString(sentenceOne, 15));
console.log(trimString(sentencetwo, 15));
Makyen
la source
1

Maintenant, trim () construit en javascript.

let yourName = ' something   ';
let actualTrimmedName = yourName.trim();

il suffit de console ou d'imprimer le code, votre nom sera également coupé.

Sakil Mahmud
la source
Assurez-vous de lire les commentaires sur la question avant de poster une réponse qui n'ajoute aucune nouvelle information. Les principaux commentaires décrivent / discutent tous de cela et ont un grand nombre de votes positifs. Ces commentaires datent de près de 8 ans et la question elle-même a presque 11 ans.
Ross Gurbutt
0

Je ne sais pas quels bugs peuvent se cacher ici, mais j'utilise ceci:

var some_string_with_extra_spaces="   goes here    "
console.log(some_string_with_extra_spaces.match(/\S.*\S|\S/)[0])

Ou ceci, si le texte contient entre:

console.log(some_string_with_extra_spaces.match(/\S[\s\S]*\S|\S/)[0])

Un autre essai:

console.log(some_string_with_extra_spaces.match(/^\s*(.*?)\s*$/)[1])
plavozont
la source
0

Le voici en TypeScript:

var trim: (input: string) => string = String.prototype.trim
    ? ((input: string) : string => {
        return (input || "").trim();
    })
    : ((input: string) : string => {
        return (input || "").replace(/^\s+|\s+$/g,"");
    })

Il retombera sur l'expression régulière si le prototype natif n'est pas disponible.

Joseph Lennox
la source
0

J'avais écrit cette fonction pour le trim, lorsque la fonction .trim () n'était pas disponible en JS en 2008. Certains des anciens navigateurs ne prennent toujours pas en charge la fonction .trim () et j'espère que cette fonction peut aider quelqu'un.

FONCTION TRIM

function trim(str)
{
    var startpatt = /^\s/;
    var endpatt = /\s$/;

    while(str.search(startpatt) == 0)
        str = str.substring(1, str.length);

    while(str.search(endpatt) == str.length-1)
        str = str.substring(0, str.length-1);   

    return str;
}

Explication : La fonction trim () accepte un objet chaîne et supprime tous les espaces de début et de fin (espaces, tabulations et sauts de ligne) et renvoie la chaîne tronquée. Vous pouvez utiliser cette fonction pour rogner les entrées de formulaire afin de garantir l'envoi de données valides.

La fonction peut être appelée de la manière suivante à titre d'exemple.

form.elements[i].value = trim(form.elements[i].value);
Ana Maria
la source
-4

le mien utilise une seule expression régulière pour rechercher les cas où un ajustement est nécessaire et utilise les résultats de cette expression régulière pour déterminer les limites de sous-chaîne souhaitées:

var illmatch= /^(\s*)(?:.*?)(\s*)$/
function strip(me){
    var match= illmatch.exec(me)
    if(match && (match[1].length || match[2].length)){
        me= me.substring(match[1].length, p.length-match[2].length)
    }
    return me
}

la seule décision de conception qui a été prise était d'utiliser une sous-chaîne pour effectuer la capture finale. s / \?: // (faire la capture à moyen terme) et et le fragment de remplacement devient:

    if(match && (match[1].length || match[3].length)){
        me= match[2]
    }

il y a deux paris de performance que j'ai faits dans ces implants:

  1. l'implémentation de la sous-chaîne copie-t-elle les données de la chaîne d'origine? si c'est le cas, dans le premier, lorsqu'une chaîne doit être coupée, il y a une double traversée, d'abord dans l'expression régulière (qui peut, espérons-le, être partielle), et deuxième dans l'extraction de la sous-chaîne. nous espérons qu'une implémentation de sous-chaîne ne fait référence qu'à la chaîne d'origine, donc les opérations comme la sous-chaîne peuvent être presque libres. croiser les doigts

  2. quelle est la qualité de la capture dans l'im regex impl? le moyen terme, la valeur de sortie, pourrait potentiellement être très long. Je n'étais pas prêt à comprendre que la capture de tous les implants regex ne reculerait pas à une capture d'entrée de quelques centaines de Ko, mais je n'ai pas non plus testé (trop d'exécutions, désolé!). le second exécute TOUJOURS une capture; si votre moteur peut le faire sans prendre de coup, peut-être en utilisant certaines des techniques de cordage au fil ci-dessus, utilisez-le à coup sûr!

rektide
la source
-7

Pour IE9 + et autres navigateurs

function trim(text) {
    return (text == null) ? '' : ''.trim.call(text);
}
Codler
la source