Le JMéthodes avaScript pour la recherche de chaînes Le didacticiel présentait la liste complète des méthodes JavaScript (JS) pour travailler avec des chaînes, ainsi que des explications détaillées sur les huit méthodes de recherche de chaînes de JavaScript. Dans le didacticiel de développement Web de suivi d’aujourd’hui, nous examinerons les méthodes de garniture, rembourrageet extraction de chaînes.
Vous pouvez lire la partie précédente de cette série en visitant : Méthode JavaScript pour la recherche de chaînes.
Couper une chaîne avec JavaScript
JS fournit trois méthodes pour supprimer les espaces d’une chaîne : garniture(), trimStart()et trimFin(). Le garniture() La méthode supprime les espaces des deux extrémités d’une chaîne, tandis que trimStart() et trimFin() supprimer les espaces au début et à la fin d’une chaîne, respectivement.
Syntaxe de la méthode trim()
Les trois méthodes de découpage JS fonctionnent sur l’instance d’objet de chaîne d’appel, donc aucune d’entre elles n’accepte de paramètres. Voici la syntaxe pour utiliser le garniture() méthodes en Javascript :
string.trim() string.trimStart() string.trimEnd()
trim() Méthode Exemples JavaScript
let str = " Let's trim some fat! "; let trimResult = str.trim(); let trimStartResult = str.trimStart(); let trimEndResult = str.trimEnd(); console.log(trimResult, trimStartResult, trimEndResult); /* Outputs: "Let's trim some fat!" "Let's trim some fat! " " Let's trim some fat!" */
Notez que le trimStart() et trimFin() les méthodes sont un ES2019/ES10 fonctionnalité et ne sont pas pris en charge dans Internet Explorer.
Lire: Meilleurs cours en ligne pour apprendre JavaScript
Remplissage d’une chaîne en JavaScript
Contrairement au découpage, qui consiste à supprimer les caractères d’espacement, les méthodes de remplissage ajoutent une chaîne à une autre chaîne jusqu’à une certaine longueur à partir du début ou de la fin de la chaîne et renvoient la chaîne résultante, jusqu’à la longueur spécifiée.
padStart() et padEnd() Syntaxe
Comme on le voit ci-dessous, le padStart() et padFin() les méthodes prennent les deux mêmes paramètres – targetLength et padString:
string.padStart(targetLength, padString) string.padEnd(targetLength, padString)
- targetLength – La longueur de la chaîne finale après le remplissage de la chaîne actuelle.
- padString (optionnel) – La chaîne avec laquelle remplir la chaîne actuelle. Sa valeur par défaut est ” ” si omis.
Noter que:
- Si padString est trop long, il sera tronqué pour répondre targetLength.
- Si targetLength est inférieure à la longueur de la chaîne, la chaîne d’origine est renvoyée sans modification.
padStart() et padEnd() Exemples de code en JavaScript
Supposons que vous souhaitiez une chaîne numérique de 8 caractères. Pour une chaîne dont la longueur est inférieure à 8, elle sera complétée par des zéros (0) :
let str="1234567"; let padStartResult1 = str.padStart(12, '0'); str="abcd"; let padStartResult2 = str.padStart(8); console.log(padStartResult1, padStartResult2); /* Outputs: "000001234567" " abcd" */ let padEndResult1 = str.padEnd(10); let padEndResult2 = str.padEnd(10, '*'); let padEndResult3 = str.padEnd(12, 'efg'); console.log(padEndResult1, padEndResult2, padEndResult3); /* Outputs: "abcd " "abcd******" "abcdefgefgef" */
Comment extraire des chaînes d’une autre chaîne en JavaScript
L’extraction de chaînes est une tâche pour laquelle JavaScript est particulièrement doué. Pour ce faire, Javascript fournit un total de quatre méthodes pour extraire les parties de chaîne ! Ils sont diviser(), substr(), sous-chaîne()et tranche(). Chaque méthode effectue un type différent d’extraction de chaîne, nous les couvrirons donc individuellement dans la section ci-dessous.
Méthode split() en JavaScript
Le Javascript diviser() divise une chaîne en une liste de sous-chaînes et les renvoie sous forme de tableau, en laissant la chaîne d’origine inchangée.
Syntaxe de la méthode split()
La syntaxe de la diviser() méthode en JavaScript est :
string.split(separator, limit)
Le diviser() La méthode accepte les deux paramètres facultatifs suivants :
- séparateur – Le modèle (chaîne ou expression régulière) décrivant où chaque fractionnement doit se produire.
- limite – Un entier non négatif limitant le nombre de morceaux dans lesquels diviser la chaîne donnée.
Méthode substr() / substring() en JavaScript
Les deux substr() et sous-chaîne() les méthodes extraient des parties de la chaîne à partir d’une position spécifiée ; la différence est que substr() permet aux développeurs de spécifier le nombre de caractères que vous souhaitez extraire, alors que sous-chaîne() accepte la position finale.
Syntaxe des méthodes substr() et substring()
La différence ci-dessus se reflète dans la syntaxe de chaque méthode :
string.substr(start, length) string.substring(start, end)
Dans les deux cas, le commencer Le paramètre est un nombre qui spécifie la position de départ à partir de laquelle copier la sous-chaîne à partir de la chaîne source. (Notez qu’en JavaScript, l’indexation commence à zéro.)
Le longueur Le paramètre est facultatif et spécifie le nombre de caractères à extraire.
S’il est omis, il extrait le reste de la chaîne. Sinon, si longueur est 0 ou négatif, une chaîne vide est renvoyée.
Le fin Le paramètre est un nombre facultatif indiquant la position finale jusqu’à laquelle la sous-chaîne est copiée.
Lire: Les meilleurs outils de collaboration pour les développeurs Web
Méthode slice() en JavaScript
Le tranche() La méthode extrait une partie d’une chaîne en tant que nouvelle chaîne, tout en laissant la chaîne d’origine inchangée.
Syntaxe de la méthode slice()
Comme le sous-chaîne() méthode, tranche() accepte également une commencer et fin paramètre:
string.slice(start, end)
Encore une fois, le commencer Le paramètre est un nombre qui spécifie une position de départ indexée à zéro à partir de laquelle copier la sous-chaîne à partir de la chaîne source.
Le fin Le paramètre est facultatif et spécifie la position de fin (jusqu’à, mais non compris).
Différences entre substring() et slice()
Alors que les deux sous-chaîne() et tranche() vous permettent d’extraire des sous-chaînes d’une chaîne en spécifiant un paramètre de début et un paramètre de fin facultatif, elles présentent quelques différences clés dont vous devez être conscient :
- Valeurs négatives – avec tranche()lorsque vous entrez un nombre négatif comme argument, tranche() compte à rebours à partir de la fin de la chaîne. Avec sous-chaîne()il traitera une valeur négative comme zéro.
- Cohérence des paramètres – une autre grande différence est que, avec sous-chaîne()si le 1er argument est supérieur au 2ème argument, sous-chaîne() va les échanger alors que tranche() renverra une chaîne vide.
Exemples de code de méthode JavaScript slice()
let str = "Outside my window there’s an open road";
// Split the words
let splitWords = str.split(" ");
// Split the characters, including spaces
let splitCharacters = str.split("");
// Using the limit parameter
let splitThreeFirstWords = str.split(" ");
console.log(splitWords, splitCharacters, splitThreeFirstWords);
/*
Outputs:
[Outside,my,window,there’s,an,open,road]
[O,u,t,s,i,d,e, ,m,y, ,w,i,n,d,o,w, ,t,h,e,r,e,’,s, ,a,n, ,o,p,e,n, ,r,o,a,d]
[Outside,my,window]
*/
// Extract a substring from text using substr()
let substrResult1 = str.substr(11, 6);
// Extract everything after position 18:
let substrResult2 = str.substr(18);
console.log(substrResult1, substrResult2);
/*
Outputs:
"window"
"there’s an open road"
*/
// Extract a substring from text using substring()
let substringResult1 = str.substring(11, 17);
// Extract everything after position 18:
let substringResult2 = str.substring(11, 17);
console.log(substringResult1, substringResult2);
/*
Outputs:
"window"
"there’s an open road"
*/
// Slice out the rest of the string
let sliceResult1 = str.slice(18);
// Using a negative start parameter
let sliceResult2 = str.slice(-10);
// Provide both start and end parameters
let sliceResult3 = str.slice(18, 25);
// Using negative start and end parameters
let sliceResult4 = str.slice(-10, -5);
console.log(sliceResult1, sliceResult2, sliceResult3, sliceResult4);
/*
Outputs:
"there’s an open road"
" open road"
"there’s"
" open"
*/
Il y a une démo sur codepen.io qui contient tous les exemples de code JavaScript présentés ici aujourd’hui.
Réflexions finales sur les méthodes JavaScript pour couper, remplir et extraire des chaînes
Dans cette série en trois parties sur les méthodes de chaîne JavaScript, nous avons appris à utiliser les méthodes de découpage, de remplissage et d’extraction. Dans le prochain et dernier épisode, nous examinerons les méthodes restantes de l’objet String, y compris celles de concaténation et de changement de casse.