Beispiel für die Verwendung der hasOwnProperty-Methode zum Abrufen eines Ajax-Antwortobjekts in JS_javascript-Kenntnissen

Studenten, die die Baidu-Suche häufig verwenden, werden den Dropdown-Index des Eingabefelds definitiv nicht ignorieren. Die einzigartigen Bedingungen stellen jedoch einige Herausforderungen für ihr Front-End dar Belagerungsingenieure müssen die Anzahl der Ajax-Nachrichten so weit wie möglich reduzieren. Es mag für diesen Artikel irrelevant klingen, ist es aber nicht. Lassen Sie uns zunächst eine kostenlose Werbung für Baidu machen. Geben Sie auf der Baidu-Homepage das Wort „Frontend“ ein und verwenden Sie Chromebug, um die gesendete Antwort einfach anzuzeigen. Die Ergebnisse werden wie folgt angezeigt:

Code kopieren Der Code lautet wie folgt:

window.bdsug.sug({q:'front-end';,p:false,s:['Front-End-Entwicklung','Front-End-Ingenieur','Front-End-Bus','Front-End-Entwicklungsingenieur ','Front-End-Framework','Front-End-Bus-Häufigkeit','Front-End-Interviewfragen','Front-End-Analyse','Front-End-Entwicklungstools','Front-End-Beobachtung']});

Baidu versucht, die Dropdown-Daten zu rendern, indem es eine sug-Methode mit obj-Parametern zurückgibt. Wenn Sie das „Frontend“ erneut aufrufen, ohne die Seite zu aktualisieren, treten keine ähnlichen Anforderungen auf, was zeigt, dass es sich um ein sehr Cache-Objekt handelt Seine Funktion besteht darin, das angeforderte Objekt vorübergehend zu speichern. Wenn das gleiche Wort eingegeben wird, wird zuerst der Schlüssel des Cache-Objekts abgerufen und der Wert des Objekts direkt gelesen länger angefordert. Der Server sendet die Anfrage, wodurch effektiv Kosten gespart werden können.

Lassen Sie uns über den wahren Protagonisten sprechen: die hasOwnProperty-Methode.

Ich glaube, dass jser kein Unbekannter bei hasOwnProperty ist. Ich verkaufe hier nur Wasser am Fluss.

Es gilt ausschließlich für Objekte und wird verwendet, um zu bestimmen, ob ein Attribut im Schlüssel eines Objekts vorhanden ist. Es gibt einen booleschen Wert zurück. Hier ist ein Beispiel:

Code kopieren Der Code lautet wie folgt:

var test0 = Array.prototype.hasOwnProperty('split'); //false, da die Split-Methode nicht im Array vorhanden ist
var test1 = String.prototype.hasOwnProperty('split'); //true, da split eine integrierte Methode des String-Objekts ist

Wenn Sie das wissen, scheint es, dass es nicht ausreicht, die Leistungsfähigkeit von hasOwnProperty zu erkennen, also reproduzieren wir einfach das Baidu-Dropdown-Beispiel:

Code kopieren Der Code lautet wie folgt:

var data = {}, saveObj = function(val){
if(data.hasOwnProperty(val)){ //Wenn der übermittelte Wert im Datenobjekt vorhanden ist, wird die Anfrage nicht gesendet
var len = data[val].length;
for(var i = 0; i < len; i ){
console.log(data[val][i]);
}
}else{
var url = 'http://suggestion.baidu.com/su?wd=' val;
$.ajax({ //Der Übersichtlichkeit halber verwenden wir hier den Ajax von jquery als Beispiel
url: url '&p=3&cb=window.bdsug.sug&sid=1421_1513_1541_1542_1582&t=1353756355137', //Der letzte Parameter t ist ein Zeitstempel
Datentyp: 'jsonp',
Geben Sie ein: 'GET',
Erfolg: Funktion(res){
var msg = res.data, len = msg.length;
msg == null && (msg = []);
If(len > 0){
data[val] = msg; //Suchergebnisse zwischenspeichern
for(var i = 0; i < len; i ){
console.log(msg[i]); //Anforderungsergebnis ausdrucken
}
}
}, Fehler: function(){
alarm('error');
}
});
}
};

Einige Kollegen stellten in Frage, dass auf diese Weise der von zwischengespeicherten Objektdaten belegte Speicher zunimmt, wenn mehr Schlüsselwerte gespeichert werden. Dann möchte ich sagen, dass dies unvermeidlich ist. Sie müssen andere Dinge opfern. Tatsächlich kann der vom Cache-Objekt belegte Speicherplatz normalerweise ignoriert werden, da er nicht einmal im Speicher gespeichert ist wird erfrischt, Es wird zerstört werden. Wir können jedoch eine andere Lösung anbieten und uns auf einen Spitzenwert für dieses Objekt einigen. Beispielsweise dürfen maximal 100 Schlüssel-Wert-Paare gespeichert werden. Wenn die Anzahl 100 überschreitet, löschen Sie die ersten zehn gespeicherten Schlüssel oder einfach keine Speicherung, um dieses Problem zu vermeiden.

Die Methode hasOwnProperty wird besonders häufig bei der Objekterkennung verwendet. Natürlich können interessierte Studenten auch die Methode propertyIsEnumerable kennenlernen. Sie ist eine erweiterte Version von hasOwnProperty und kann die Aufzählbarkeit der Eigenschaft erkennen Ich werde es nicht mehr im Detail erklären.