Une analyse approfondie des méthodes d'opération de chaîne JavaScript slice, substr, substring et de leurs compétences de compatibilité IE_javascript

Les méthodes substr(), substring() et slice() sont souvent utilisées lors de l'interception de chaînes. Parfois, les utilisations sont confuses, je vais donc les résumer.

Répertoire de lecture
•tranche()
•sous-chaîne()
•substr()
•Résumé

tranche()

Définition : Accepte un ou deux paramètres, le premier paramètre précise la position de départ de la sous-chaîne. Le deuxième paramètre représente la position de fin de la sous-chaîne (à l'exclusion du caractère en position de fin). Si le deuxième paramètre n'est pas transmis, la longueur de la chaîne est utilisée comme position de fin.

1. Lorsque le paramètre passé est une valeur positive :

var str ="helloWorld";
// 一个参数，则将字符串长度作为结束位置
alert(str.slice(3)); // "loWorld"
// 两个参数，7位置上的字符为"r",但不包括结束位置的字符
alert(str.slice(3,7)); // "loWo" 

2. Lorsque le paramètre passé est une valeur négative :

slice()方法会将传入的负值与字符串长度相加。
 var str ="helloWorld";
// 一个参数，与字符串长度相加即为slice(7)
alert(str.slice(-3)); // "rld"
// 两个参数，与字符串长度相加即为slice(3,6)
alert(str.slice(3,-4)); // "loW" 

3. Lorsque le deuxième paramètre est plus petit que le premier paramètre :

Si le deuxième paramètre transmis par la méthode slice() est plus petit que le premier paramètre, une chaîne vide sera renvoyée.

var str ="helloWorld";
alert(str.slice(5,3)); // "" 

4. Compatibilité IE

Lors du test avec le navigateur IE8, il n'y a aucun problème et le comportement est conforme aux navigateurs modernes.

sous-chaîne()

Définition : Accepte un ou deux paramètres, le premier paramètre précise la position de départ de la sous-chaîne. Le deuxième paramètre représente la position de fin de la sous-chaîne (à l'exclusion du caractère en position de fin). Si le deuxième paramètre n'est pas transmis, la longueur de la chaîne est utilisée comme position de fin.

1. Lorsque le paramètre passé est une valeur positive : même comportement que la méthode slice()

var str ="helloWorld";
// 一个参数，则将字符串长度作为结束位置
alert(str.substring(3)); // "loWorld"
// 两个参数，7位置上的字符为"r",但不包括结束位置的字符
alert(str.substring(3,7)); // "loWo" 

2. Lorsque le paramètre passé est une valeur négative :

La méthode substring() convertira tous les paramètres négatifs en 0. Prenons un exemple :

var str ="helloWorld";
// 两个参数，-4会转换为0，相当于substring(3,0) -->即为 substring(0,3)
alert(str.substring(3,-4)); // "hel" 

La méthode

substring() utilisera le plus petit nombre comme position de départ et le plus grand nombre comme position de fin. Comme dans l'exemple ci-dessus, substring(3,0) et substring(0,3) ont le même effet.

4. Compatibilité IE

Lors du test avec le navigateur IE8, il n'y a aucun problème et le comportement est conforme aux navigateurs modernes.

substr()

Définition : Accepte un ou deux paramètres, le premier paramètre précise la position de départ de la sous-chaîne. Le deuxième paramètre est quelque peu différent de la méthode précédente, indiquant le nombre de caractères renvoyés. Si aucun deuxième argument n'est passé, la longueur de la chaîne est utilisée comme position de fin. Voyons un exemple :

1. Lorsque le paramètre passé est une valeur positive :

var str ="helloWorld";
// 一个参数，则将字符串长度作为结束位置
alert(str.substr(3)); // "loWorld"
// 两个参数，从位置3开始截取后面7个字符
alert(str.substr(3,7)); // "loWorld" 

2. Lorsque le paramètre passé est une valeur négative :

La méthode

substr() ajoute le premier paramètre négatif à la longueur de la chaîne et convertit le deuxième paramètre négatif en 0.

var str ="helloWorld";
// 将第一个负的参数加上字符串的长度--->
//即为：substr(7,5) ，从位置7开始向后截取5个字符
alert(str.substr(-3,5)); // "rld"
// 将第二个参数转换为0
// 即为：substr(3,0)，即从位置3截取0个字符串，则返回空
alert(str.substr(3,-2)); // "" 

3. Compatibilité IE

La méthode substr() aura des problèmes lors du passage de valeurs négatives et la chaîne d'origine sera renvoyée. IE9 résout ce problème.

Résumé

Le comportement de slice() et substring() est cohérent lors du passage de paramètres positifs. La méthode substr() sera facilement confondue sur le deuxième paramètre

Lors du passage de paramètres négatifs, la méthode slice() consiste à ajouter la longueur de la chaîne, ce qui est conforme à la pensée générale. La conversion du deuxième paramètre de substring() en 0 posera facilement des problèmes et la position de départ le sera. être facile à modifier. La méthode substr () entraînera des problèmes de compatibilité avec IE lors de l'utilisation de valeurs négatives.

Pour résumer, je recommande généralement d'utiliser la méthode slice().

Laissez-moi vous présenter les différences entre slice, substr et substring

Tout d'abord, ils reçoivent tous deux deux paramètres. slice et substring reçoivent la position de départ et la position de fin (à l'exclusion de la position de fin), tandis que substr reçoit la position de départ et la longueur de la chaîne à renvoyer. Regardez simplement l'exemple ci-dessous :

 var test = 'hello world';
  alert(test.slice(,));    //o w
  alert(test.substring(,));   //o w
  alert(test.substr(,));   //o world 

Une chose à noter ici est que la sous-chaîne utilise le plus petit des deux paramètres comme position de départ et le plus grand paramètre comme position de fin.

Par exemple :

alert(test.substring(7,4));   //o w 

Ensuite, lorsque le paramètre reçu est un nombre négatif, slice ajoutera la longueur de sa chaîne au nombre négatif correspondant, et le résultat sera utilisé comme paramètre ; substr ne sera que le résultat de l'ajout du premier paramètre et la longueur de la chaîne En tant que premier paramètre, la sous-chaîne convertit simplement tous les paramètres négatifs directement en 0. Le code du test est le suivant :

var test = 'hello world';  
alert(test.slice(-));   //rld  
alert(test.substring(-));  //hello world  
alert(test.substr(-));  //rld  
alert(test.slice(,-));  //lo w  
alert(test.substring(,-)); //hel  
alert(test.substr(,-));  //空字符串 

Remarque : IE a une erreur dans la gestion des valeurs négatives reçues par substr, et il renverra la chaîne d'origine.