Os alunos que costumam usar a pesquisa do Baidu não ignoram o índice suspenso da caixa de entrada. É tão conveniente. No entanto, as condições únicas fazem com que essa tecnologia assíncrona enfrente alguns testes. A solicitação de servidor altamente concorrente pede que seu cerco de front-end pede-lhes a reduzir o número de vezes que enviam o Ajax o máximo possível. Não parece estar relacionado a este artigo, mas não é. Primeiro de tudo, vamos fazer um anúncio gratuito para o Baidu. Digite a palavra "front-end" na página inicial do Baidu e use o Chromebug para ver facilmente a resposta enviada. Os resultados são os seguintes:
A cópia do código é a seguinte:
window.bdsug.sug ({q: 'front -end';, p: false, s: ['Desenvolvimento de Front End', 'Engenheiro Front -End', 'Bus de Fronteiro', 'Engenheiro de Desenvolvimento Frente de Ends', 'Fronteiro Fronteiro', 'Frente Frente Frente', 'Perguntas da Entrevista', 'Análise Front End', Front End Development ',' Front End ', End observação' '' '', 'Perguntas' ',' Perguntas ',' Análise de Frente ', Front End Development', 'Front End', End Ferting ',' Observation '' '', 'Resterving' '' Resterving '' Restation '' Regesters ',' Análise Front End ', Front End Development', 'Front End', End Obstive
O Baidu tenta renderizar os dados pull-down retornando um método SUG com o parâmetro OBJ. Quando você entra no "front-end" novamente sem atualizar a página, solicitações semelhantes não ocorreram. Isso significa que é provável que eles tenham estabelecido um objeto de cache, usado para armazenar temporariamente o objeto solicitado. Quando a mesma palavra for inserida posteriormente, a chave do objeto de cache será recuperada primeiro. Depois que a correspondência é bem -sucedida, o valor do objeto é lido diretamente e não está mais enviando uma solicitação ao servidor, que pode economizar efetivamente custos.
Vamos jogar um tijolo e trazer Jade, vamos falar sobre o verdadeiro protagonista: o método HasownProperty.
Acredito que os JSers não estão familiarizados com o HasownProperty, e estou apenas vendendo água ao lado do rio aqui.
É exclusivo do objeto, usado para determinar se existe uma propriedade na chave de um objeto e o valor de retorno é um valor booleano. Aqui está um exemplo:
A cópia do código é a seguinte:
var test0 = array.prototype.hasownProperty ('split'); // false, porque o método dividido não existe na matriz
var test1 = string.prototype.hasownProperty ('split'); // true, porque o Split é um método embutido para objetos de string
Quando você sabe disso, parece que não basta ver a força do HasownProperty. Então, vamos simplesmente reproduzir o exemplo do Baidu Pull-Down:
A cópia do código é a seguinte:
var dados = {}, saveBJ = function (val) {
if (data.hasownProperty (val)) {// Se o valor enviado existir no objeto de dados, nenhuma solicitação será enviada
var len = dados [val] .Length;
for (var i = 0; i <len; i ++) {
console.log (dados [val] [i]);
}
}outro{
var url = 'http://suggestion.baidu.com/su?wd=' + val;
$ .ajax ({// Por uma questão de exemplos claros, aqui usamos o Ajax de JQuery como exemplo
url: url + '& p = 3 & cb = window.bdsug.sug & sid = 1421_1513_1541_1542_1582 & t = 1353756355137', // o último parâmetro t é um carimbo de tempo
Datatype: 'jsonp',
Tipo: 'Get',
Sucesso: função (res) {
var msg = res.data, len = msg.length;
msg == null && (msg = []);
if (len> 0) {
dados [val] = msg; // Resultados da pesquisa em cache
for (var i = 0; i <len; i ++) {
console.log (msg [i]); // Imprima o resultado da solicitação
}
}
}, erro: function () {
alerta ('erro');
}
});
}
};
Alguns colegas questionaram que, dessa maneira, a memória ocupada pelos dados do objeto de cache se tornará cada vez maior à medida que os valores -chave são armazenados. Então eu quero dizer que isso é inevitável. Para salvar as solicitações do servidor, outros devem ser sacrificados. De fato, o espaço ocupado pelo objeto de cache geralmente é insignificante porque não é "memória residente" e será destruído assim que a página for atualizada. No entanto, podemos dar outra solução, para concordar com um valor de pico para esse objeto, por exemplo, ele apenas permite armazenar 100 pares de valor-chave no máximo. Quando o número excede 100, as dez primeiras chaves armazenadas são excluídas através do operador de exclusão ou simplesmente não são armazenadas; portanto, esse problema pode ser evitado.
O método HasownProperty é particularmente comum na detecção de objetos. Obviamente, os alunos interessados também podem aprender sobre o método da PropertyIsEnumerable. É uma versão aprimorada do HASOWNPROPERTY. Pode detectar suas próprias propriedades e a enumeração das propriedades. Este artigo não explicará em detalhes.