Exemple d'utilisation de la méthode hasOwnProperty pour récupérer un objet de réponse ajax dans les compétences JS_javascript

Les étudiants qui utilisent souvent la recherche Baidu n'ignoreront certainement pas l'index déroulant de la zone de saisie. Cependant, les conditions uniques font que cette technologie asynchrone est confrontée à certains défis. . Les ingénieurs de siège doivent réduire autant que possible le nombre de messages ajax. Cela peut sembler sans rapport avec cet article, mais ce n'est pas le cas. Tout d’abord, faisons une publicité gratuite pour Baidu. Saisissez le mot « front-end » sur la page d'accueil de Baidu et utilisez chromebug pour voir facilement la réponse envoyée. Les résultats sont affichés comme suit :

.

Copier le code Le code est le suivant :

window.bdsug.sug({q:'front-end';,p:false,s:['développement front-end','ingénieur front-end','bus front-end','ingénieur de développement front-end ','Cadre frontal','Fréquence du bus frontal','Questions d'entretien front-end','Analyse front-end','Outils de développement front-end','Observation front-end']});

Baidu tente de restituer les données déroulantes en renvoyant une méthode sug avec des paramètres obj. Lorsque vous entrez à nouveau dans le "front-end" sans actualiser la page, des requêtes similaires ne se produisent pas, ce qui montre qu'il s'agit d'un objet de cache. peut être établi.Sa fonction est de stocker temporairement l'objet demandé. Lorsque le même mot est saisi ultérieurement, la clé de l'objet cache sera récupérée en premier. Une fois la correspondance réussie, la valeur de l'objet sera lue directement et non. plus de demandes lui seront envoyées. Le serveur envoie la demande, ce qui peut effectivement réduire les coûts.

Parlons du véritable protagoniste : la méthode hasOwnProperty.

Je crois que les Jser ne sont pas étrangers à hasOwnProperty. Ici, je vends simplement de l'eau au bord de la rivière.

Il est exclusif aux objets et est utilisé pour déterminer si un attribut existe dans la clé d'un objet. La valeur de retour est une valeur booléenne. Voici un exemple :

Copier le code Le code est le suivant :

var test0 = Array.prototype.hasOwnProperty('split'); //false, car la méthode split n'existe pas dans le tableau
var test1 = String.prototype.hasOwnProperty('split'); //true, car split est une méthode intégrée de l'objet String

Quand vous savez cela, il semble qu'il ne suffit pas de voir la puissance de hasOwnProperty, alors reproduisons simplement l'exemple déroulant de Baidu :

Copier le code Le code est le suivant :

var data = {}, saveObj = function(val){
if(data.hasOwnProperty(val)){ //Si la valeur soumise existe dans l'objet de données, la requête ne sera pas envoyée
var len = data[val].length;
pour(var je = 0; je < len; je ){
console.log(data[val][i]);
>
}autre{
var url = 'http://suggestion.baidu.com/su?wd=' val;
$.ajax({ //Par souci de clarté, nous utilisons ici l'ajax de jquery comme exemple
url : url '&p=3&cb=window.bdsug.sug&sid=1421_1513_1541_1542_1582&t=1353756355137', //Le dernier paramètre t est un horodatage
Type de données : 'jsonp',
Tapez : 'OBTENIR',
Succès : fonction(res){
var msg = res.data, len = msg.length;
msg == nul && (msg = []);
Si(len> 0){
data[val] = msg; //Résultats de la recherche en cache
pour(var je = 0; je < len; je ){
console.log(msg[i]); //Imprimer le résultat de la requête
>
>
}, erreur : function(){
alert('erreur');
>
});
>
};

Certains collègues se sont demandé si de cette manière, la mémoire occupée par les données d'objets mises en cache augmenterait à mesure que davantage de valeurs clés seraient stockées. Ensuite, je tiens à dire que c'est inévitable. Pour sauvegarder les requêtes côté serveur, vous devez sacrifier d'autres choses. En fait, l'espace occupé par l'objet cache peut généralement être ignoré car il n'est pas "résident en mémoire une fois la page". est rafraîchi, il sera détruit. Cependant, nous pouvons donner une autre solution et convenir d'une valeur maximale pour cet objet. Par exemple, il est uniquement autorisé de stocker 100 paires clé-valeur au maximum. Lorsque le nombre dépasse 100, supprimez les dix premières clés stockées via l'opérateur de suppression. ou tout simplement pas de stockage pour éviter ce problème.

La méthode hasOwnProperty est particulièrement couramment utilisée dans la détection d'objets. Bien entendu, les étudiants intéressés peuvent également en apprendre davantage sur la méthode propertyIsEnumerable. Il s'agit d'une version améliorée de hasOwnProperty et peut détecter ses propres propriétés et l'énumération de la propriété. je ne l'expliquerai plus en détail.