Maison interface Web js tutoriel Problèmes et solutions causés par l'extension de Array.prototype.indexOf pour les connaissances JS_Basic

Problèmes et solutions causés par l'extension de Array.prototype.indexOf pour les connaissances JS_Basic

May 16, 2016 pm 04:18 PM
array indexof

Array n'a pas de méthode indexOf, il est donc difficile de trouver l'index d'un élément dans un tableau. Pour faciliter l'appel, Array.prototype.indexOf() est étendu via le prototype, ce qui le rend plus. pratique à utiliser. Mais il y avait un problème avec cet indexOf personnalisé lors du parcours du tableau.

Copier le code Le code est le suivant :

Array.prototype.indexOf = function(item) {
pour (var i = 0; i < this.length; i ) {
if (this[i] == élément)
reviens-moi;
}
renvoie -1 ;
>

Directement lors de l'utilisation de

Copier le code Le code est le suivant :

vararr=[1,2,3,4,5]; var index=arr.indexOf(1); //index==0

Après l'agrandissement, il est très confortable et pratique à utiliser, créant une scène harmonieuse...

Mais une fois, lors du parcours des éléments du tableau, une boucle for..in.. a été utilisée, ce qui a provoqué d'autres problèmes et brisé l'atmosphère harmonieuse.

Copier le code Le code est le suivant :
var a=["Zhang Fei","Guan Yu","Liu Bei","Lü Bu"]
pour(var p dans a){
document.write(p "=" a[p] "
"); >


Au départ, je voulais afficher les noms de ces quatre personnes, mais qu'est-ce qui a été affiché ?

Le résultat est en fait :

//0=Zhang Fei
//1=Guan Yu
//2=Liu Bei
//3=Lu Bu
//indexOf=function(item) { for (var i = 0; i < this.length; i ) { if (this[i] == item) return i; } return -1 }


En plus de taper le nom, il génère également sa propre méthode étendue indexOf. Mais ce qui est fou, c'est que Firefox est "normal" et n'a que les noms de quatre personnes. Pourquoi ?

Sortie indexOf, qui peut être développé par lui-même, ce qui est compréhensible. Après tout, for..in parcourt tous les attributs définis par l'utilisateur d'un objet ou tous les éléments d'un tableau.

Alors pourquoi pas Firefox ?

Je l'ai découvert plus tard après avoir vérifié les informations,

Array prend déjà en charge Array.indexOf() dans la version javascript 1.6, et le Firefox que j'utilise est la version 3.5, qui prend déjà en charge javascript 1.8, qui est une méthode inhérente à Array lui-même.

Quant à IE, même si j'utilise IE8, il ne prend en charge que la version 1.3 de JavaScript.

Ainsi, IE8 considère indexOf comme un "attribut défini par l'utilisateur", tandis que Firefox le considère comme un attribut inhérent pris en charge par lui-même de manière native.

Est-ce vraiment le cas ?

Faites une expérience, renommez indexOf en myIndexOf et réessayez. En conséquence, IE et Firefox génèrent myIndexOf, ce qui prouve que le point précédent est correct.

Ensuite, voici un autre problème. J'ai étendu indexOf depuis longtemps. Maintenant, de nombreux codes de projet utilisent déjà cette méthode, mais maintenant je dois utiliser for..in pour afficher les éléments du tableau lui-même. Je ne veux pas le prolonger moi-même. Que dois-je faire si j'arrive en Russie ?

Heureusement, javascript fournit la méthode hasOwnProperty.

Regardez sa description :

Chaque objet descendant de Object hérite de la méthode hasOwnProperty. Cette méthode peut être utilisée pour déterminer si un objet a la propriété spécifiée comme propriété directe de cet objet ; contrairement à l'opérateur in, cette méthode ne vérifie pas la chaîne de prototypes de l'objet
.

En regardant la description, c’est ce que nous voulons.

Portez simplement un jugement pour...dans.. et c'est OK

if(a.hasOwnProperty(p)){
                  document.write(p "=" a[p] "
");
>


De plus, voici un exemple d'utilisation de hasOwnProperty, provenant d'Internet :

Copier le code Le code est le suivant :

function Livre(titre, auteur) { 
   this.title = titre ; 
   this.author = auteur ; 
  } 
   Livre.prototype.prix = 9,99 ; 
   Objet.prototype.copyright = "herongyang.com" ; 
   var monBook = new Book("Tutoriels JavaScript", "Herong Yang"); 
   // Vidage des propriétés intégrées au niveau du prototype de base 
   document.writeln("Propriétés intégrées de nObject.prototype :"); 
   dumpProperty(Object.prototype, "constructeur"); 
   dumpProperty(Object.prototype, "hasOwnProperty"); 
   dumpProperty(Object.prototype, "isPrototypeOf"); 
   dumpProperty(Object.prototype, "toString"); 
   dumpProperty(Object.prototype, "valueOf"); 
   dumpProperty(Object.prototype, "copyright"); 
   // Vidage des propriétés intégrées au niveau de mon prototype 
   document.writeln("/n==================/propriétés intégrées de nBook.prototype :"); 
   dumpProperty(Book.prototype, "constructeur"); 
   dumpProperty(Book.prototype, "hasOwnProperty"); 
   dumpProperty(Book.prototype, "isPrototypeOf"); 
   dumpProperty(Book.prototype, "toString"); 
   dumpProperty(Book.prototype, "valueOf"); 
   dumpProperty(Book.prototype, "copyright"); 
   // Vidage des propriétés intégrées au niveau de l'objet 
   document.writeln("/n==================/propriétés intégrées de nmyBook :"); 
   dumpProperty(myBook, "constructeur"); 
   dumpProperty(monLivre, "hasOwnProperty"); 
   dumpProperty(monLivre, "isPrototypeOf"); 
   dumpProperty(monLivre, "toString"); 
   dumpProperty(monLivre, "valueOf"); 
   dumpProperty(monLivre, "copyright"); 
function dumpProperty(objet, propriété) { 
   héritage var;  
   if (object.hasOwnProperty(property))  
      héritage = "Local" ; 
   autre 
      héritage = "Hérité" ; 
   document.writeln(property ": " héritage ": "
      objet[propriété]); 
>

查看浏览器支持javascript到哪个版本:

复制代码 代码如下 :

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
http://www.w3.org/1999/xhtml"> Test de prise en charge de la version JavaScript du navigateur //document.write("Type de votre navigateur :" navigator.appName "
");
//document.write("Version du navigateur :" navigator.appVersion "
");
//Les navigateurs prenant en charge JavaScript1.0 peuvent exécuter ce script
Document.write('Ce navigateur prend en charge JavaScript1.0
');
// Seuls les navigateurs prenant en charge JavaScript1.1 peuvent exécuter ce script
Document.write('Ce navigateur prend en charge JavaScript1.1
');
// Seuls les navigateurs prenant en charge JavaScript1.2 peuvent exécuter ce script
Document.write('Ce navigateur prend en charge JavaScript1.2
');
//Les navigateurs prenant en charge JavaScript1.3 peuvent exécuter ce script
Document.write('Ce navigateur prend en charge JavaScript1.3
');
//Les navigateurs prenant en charge JavaScript1.4 peuvent exécuter ce script
Document.write('Ce navigateur prend en charge JavaScript1.4
');
//Les navigateurs prenant en charge JavaScript1.5 peuvent exécuter ce script
Document.write('Ce navigateur prend en charge JavaScript1.5
');
//Les navigateurs prenant en charge JavaScript1.6 peuvent exécuter ce script
Document.write('Ce navigateur prend en charge JavaScript1.6
');
//Les navigateurs prenant en charge JavaScript1.7 peuvent exécuter ce script
Document.write('Ce navigateur prend en charge JavaScript1.7
'
// Seuls les navigateurs prenant en charge JavaScript 1.8 peuvent exécuter ce script
Document.write('Ce navigateur prend en charge JavaScript1.8
');
//Les navigateurs prenant en charge JavaScript1.9 peuvent exécuter ce script
Document.write('Ce navigateur prend en charge JavaScript1.9
'



Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
2 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
4 Il y a quelques semaines By DDD
Musée à deux points: toutes les expositions et où les trouver
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Trier le tableau à l'aide de la fonction Array.Sort en C# Trier le tableau à l'aide de la fonction Array.Sort en C# Nov 18, 2023 am 10:37 AM

Titre : Exemple d'utilisation de la fonction Array.Sort pour trier un tableau en C# Texte : En C#, un tableau est une structure de données couramment utilisée, et il est souvent nécessaire de trier le tableau. C# fournit la classe Array, qui possède la méthode Sort pour trier facilement les tableaux. Cet article explique comment utiliser la fonction Array.Sort en C# pour trier un tableau et fournit des exemples de code spécifiques. Tout d’abord, nous devons comprendre l’utilisation de base de la fonction Array.Sort. Tableau.Donc

Méthode simple et claire pour utiliser la fonction PHP array_merge_recursive() Méthode simple et claire pour utiliser la fonction PHP array_merge_recursive() Jun 27, 2023 pm 01:48 PM

Lors de la programmation en PHP, nous avons souvent besoin de fusionner des tableaux. PHP fournit la fonction array_merge() pour terminer la fusion du tableau, mais lorsque la même clé existe dans le tableau, cette fonction écrasera la valeur d'origine. Afin de résoudre ce problème, PHP fournit également une fonction array_merge_recursive() dans le langage, qui peut fusionner des tableaux et conserver les valeurs des mêmes clés, rendant la conception du programme plus flexible. tableau_merge

Comment utiliser la fonction array_combine en PHP pour combiner deux tableaux en un tableau associatif Comment utiliser la fonction array_combine en PHP pour combiner deux tableaux en un tableau associatif Jun 26, 2023 pm 01:41 PM

En PHP, il existe de nombreuses fonctions de tableau puissantes qui peuvent rendre les opérations sur les tableaux plus pratiques et plus rapides. Lorsque nous devons combiner deux tableaux en un tableau associatif, nous pouvons utiliser la fonction array_combine de PHP pour réaliser cette opération. Cette fonction est en fait utilisée pour combiner les clés d'un tableau avec les valeurs d'un autre tableau dans un nouveau tableau associatif. Ensuite, nous expliquerons comment utiliser la fonction array_combine en PHP pour combiner deux tableaux en un tableau associatif. En savoir plus sur array_comb

Explication détaillée de l'utilisation de la fonction PHP array_fill() Explication détaillée de l'utilisation de la fonction PHP array_fill() Jun 27, 2023 am 08:42 AM

Dans la programmation PHP, un tableau est une structure de données très importante qui peut facilement gérer de grandes quantités de données. PHP fournit de nombreuses fonctions liées aux tableaux, array_fill() en fait partie. Cet article présentera en détail l'utilisation de la fonction array_fill(), ainsi que quelques conseils d'applications pratiques. 1. Présentation de la fonction array_fill() La fonction de la fonction array_fill() est de créer un tableau d'une longueur spécifiée et composé des mêmes valeurs. Plus précisément, la syntaxe de cette fonction est

Comment utiliser le module Array en Python Comment utiliser le module Array en Python May 01, 2023 am 09:13 AM

Le module array en Python est un tableau prédéfini, il prend donc beaucoup moins d'espace en mémoire qu'une liste standard et peut également effectuer des opérations rapides au niveau des éléments telles que l'ajout, la suppression, l'indexation et le découpage. De plus, tous les éléments du tableau sont du même type, vous pouvez donc utiliser les fonctions d'opérations numériques efficaces fournies par le tableau, telles que le calcul des valeurs moyennes, maximales et minimales. De plus, le module tableau prend également en charge l'écriture et la lecture d'objets tableau directement dans des fichiers binaires, ce qui le rend plus efficace lors du traitement de grandes quantités de données numériques. Par conséquent, si vous devez traiter une grande quantité de données homogènes, vous pouvez envisager d'utiliser le module array de Python pour optimiser l'efficacité d'exécution de votre code. Pour utiliser le module array, vous devez d'abord

Quelles sont les causes courantes d'ArrayStoreException en Java ? Quelles sont les causes courantes d'ArrayStoreException en Java ? Jun 25, 2023 am 09:48 AM

En programmation Java, le tableau est une structure de données importante. Les tableaux peuvent stocker plusieurs valeurs dans une seule variable et, plus important encore, chaque valeur est accessible à l'aide d'un index. Mais lorsque vous travaillez avec des tableaux, certaines exceptions peuvent survenir, l'une d'elles est ArrayStoreException. Cet article abordera les causes courantes des exceptions ArrayStoreException. 1. Incompatibilité de type Le type d'élément doit être spécifié lors de la création du tableau. Lorsque nous essayons de stocker des types de données incompatibles dans un tableau, cela renvoie

Quelle est l'utilisation de la méthode indexof en Java Quelle est l'utilisation de la méthode indexof en Java May 17, 2023 pm 02:28 PM

Méthode indexof : Remarque : La méthode indexOf renvoie une valeur entière indiquant la position de départ de la sous-chaîne dans l'objet String. Si la sous-chaîne n'est pas trouvée, -1 est renvoyé. publicclassIndexOf{publicstaticvoidmain(String[]args){Strings="Li Hong#王海#林奇#鲁狠#唐梅"; Stringq="#";//La chaîne à trouver Stringrr="*";// Chaîne inexistante inti=0;for(intj=0;j

Quelles sont les différences entre indexof et include ? Quelles sont les différences entre indexof et include ? Nov 24, 2023 pm 01:20 PM

Les différences sont : 1. Différents types de valeurs de retour ; 2. Différents paramètres acceptés ; 3. Différentes manières de traiter NaN 4. Différentes manières de traiter les majuscules et les minuscules ; 5. Différents types de données pouvant être utilisés.

See all articles