JavaScript detecta valores originais, valores de referência e atributos

No JavaScript, geralmente vemos o código como este: uma comparação de variáveis ​​com o NULL (esse uso é muito problemático), usado para determinar se uma variável recebe um valor razoável. por exemplo:

 var controller = {Process: function (itens) {if (itens! == null) {// Método de escrita ruim items.sort (); items.foreach (function (item) {// execute alguma lógica});}}}

Nesse código, o método Process () obviamente espera que os itens sejam uma matriz, porque vemos itens têm classificação () e foreach (). A intenção deste código é muito óbvia: se os itens do parâmetro não forem um número de grupo, a próxima operação será interrompida. O problema com este método de escrita é que a comparação com o NULL não pode realmente impedir erros. O valor dos itens pode ser 1, uma string ou mesmo qualquer objeto. Esses valores não são iguais a nulos, que por sua vez causarão um erro quando o método Process () for executado para classificar ().

Comparar apenas com o NULL não fornece informações suficientes para determinar se a execução de código subsequente é realmente segura. Felizmente, o JavaScript nos fornece muitas maneiras de detectar o verdadeiro valor de uma variável.

Detectar valor original

Existem 5 tipos primitivos (também conhecidos como tipos de dados simples) em JavaScript: string, número, booleano, indefinido e nulo. Se você deseja que um valor seja string, número, booleano ou indefinido, a melhor opção é usar o operador TIPOOF, que retorna uma string que representa o tipo.

Para strings, o tipo de retorna "string".

Para números, o tipo de retorna "número".

Para booleano, o tipo de retorna "booleano".

Para o tipo de retorno indefinido, "indefinido".

A sintaxe básica do tipo OF é: TIPOOF VARIABLE, você também pode usar o TypeOf (variável), embora essa seja a sintaxe JavaScript legal, que faz com que o tipo de pareça uma função e não um operador. Em vista disso, recomendamos escrever sem colchetes.

O uso do tipo OF para detectar esses 4 tipos primitivos é muito seguro. Vamos dar uma olhada nos seguintes exemplos.

 // detectar "string" if (typeof name === "string") {outro nome = name.substring (3);} // detectar "número" if (typeof count === "número") {updateCount (count);} // detectar "boolean" if (typeof found === "" boolean "& found);" (typeof myApp === "indefinido") {myApp = {// outro código};}

O operador TIPOOF é exclusivo, pois não relatará um erro quando usado com uma variável não declarada. Variáveis ​​e variáveis ​​indefinidas com valor indefinido retornarão "indefinidas" via tipoof.

O último tipo primitivo NULL, através do tipo de, retornará "objeto", que parece estranho e é considerado um bug sério na especificação padrão; portanto, ao programar, você deve impedir o uso do tipo de detectar tipos nulos.

 console.log (tipo de nulo); // "objeto"

Simplesmente comparar com o nulo geralmente não contém informações suficientes para determinar se o tipo de valor é legal, portanto, o nulo geralmente não é usado em declarações de detecção.

Mas há uma exceção, se o valor esperado for realmente nulo, você poderá comparar diretamente com o NULL. Por exemplo:

 // Se você precisar detectar nulo, use este método var element = document.getElementById ("my-div"); if (element! == null) {element.classname = "found";}

Se o elemento DOM não existir, o valor obtido pelo document.getElementById () será nulo. Este método retorna um nó ou retorna nulo. Como o NULL é uma saída previsível no momento, o resultado de retorno pode ser detectado usando o operador de identidade === ou o operador não identificador! ==.

Além da string, número, booleano, indefinido e objeto mencionado acima, o valor de retorno do operador do tipo Of também tem função. Do ponto de vista técnico, as funções também são objetos em JavaScript, não tipos de dados. No entanto, as funções têm algumas propriedades especiais, por isso é necessário distinguir funções de outros objetos pelo operador TypeOf. Esse recurso será usado na função de detecção posteriormente.

Detectar valores de referência

No JavaScript, exceto pelos valores originais, todos os valores de referência (também chamados de objetos). Os tipos de referência comumente usados ​​são: objeto, matriz, data e regexp. Esses tipos de referência são objetos internos no JavaScript. O operador TIPOOF retorna "objeto" ao julgar esses tipos de referência.

 console.log (typeof {}); // "objeto" console.log (typeof []); // "objeto" console.log (typeof new date ()); // "objeto" console.log (typeof new regexp ()); // "objeto" console.log (typeof new regexp ()); // "objeto"

A melhor maneira de detectar um tipo de valor referenciado é usar a instância do operador. A sintaxe básica de instanceof é:

 Instância de valor do construtor // detectar data if (Instância do valor da data) {console.log (value.getlyear);} // Detect ErrorIf (Value Instância do erro) {throw value;} // detectar expressão regular if (value Instância de regexp) {if (value.test (outro)) {console.log ("

Uma característica interessante da instância é que ela não apenas detecta o construtor que constrói esse objeto, mas também detecta a cadeia de protótipo. A cadeia do protótipo contém muitas informações, incluindo o padrão de herança usado para definir o objeto. Por exemplo, por padrão, cada objeto herda do objeto; portanto, a instância do valor do objeto de cada objeto retorna ture. por exemplo:

 var agora = new Date (); console.log (agora instanceof objeto); // o natureconsole.log (agora a dataf Date); // O operador NatureInstanceof também pode detectar tipos personalizados, como: função pessoa (nome) {this.name = name;} var Me = new Pessoa ("nicholas"); console.log (me objeto me objeto); // The NatureConsole.log (ME Instulyof Pessoa); // A natureza

O tipo de pessoa é criado neste código de amostra. A variável me é uma instância da pessoa, então eu a pessoa é verdadeira. Como mencionado acima, todos os objetos são considerados instâncias de objeto, então eu a instância do objeto também é uma vez.

Ao detectar tipos embutidos e personalizados em JavaScript, a melhor maneira de fazer isso é usar o operador da instância, que é a única maneira de fazê-lo.

Mas há uma limitação séria. Supondo que ambos os quadros do navegador (quadros) tenham uma pessoa construtora, e a pessoa que a instância do FrameApersonInstance no quadro A é passada no quadro B, os seguintes resultados serão:

console.log (FremeaPersonInstance Instância de FrameaPerson) // Ture

console.log (FrameaPersonInstance Instância do quadroBPerson) // false

Embora as definições das duas pessoas sejam exatamente iguais, elas são consideradas tipos diferentes em diferentes quadros. Existem dois tipos internos muito importantes que também têm esse problema: matriz e função; portanto, detectá-los geralmente não usa a instância.

Função de detecção

Tecnicamente falando, as funções no JavaScript são tipos de referência e também há construtor de funções. Cada função é um exemplo, por exemplo:

 function myfunc () {} // Método de escrita ruim console.log (função myfuncef); // verdadeiro

No entanto, esse método não pode ser usado entre quadros, porque cada quadro possui seu próprio construtor de funções. Felizmente, o operador TypeOf também pode ser usado para funções, retornando "função".

 function myfunc () {} // bom método de escrita console.log (typeof myfunc === "function"); // verdadeiro

A melhor maneira de detectar uma função é usar o TypeOf porque ela pode ser usada entre quadros.

Há uma limitação para usar o tipo de detectar funções. No IE 8 e os navegadores anteriores do IE, o tipo de tipoof é usado para detectar que as funções nos nós do DOM retornem "objeto" em vez de "função". por exemplo:

 // ieconsole.log (typeof document.createElement); // "object" console.log (typeof document.getElementById); // "object" console.log (typeof document.getElementByTagName); // "object" console.log (typeof document.getElementByTagName); // "objeto"

Esse fenômeno estranho ocorre porque os navegadores têm diferenças na implementação do DOM. Em resumo, essas versões anteriores do IE não implementaram o DOM como um método JavaScript interno, resultando no tipo de operador interno de identificação dessas funções como objetos. Como o DOM está claramente definido, sabendo que um membro do objeto existe significa que é um método, os desenvolvedores costumam usar o operador em detectar os métodos DOM, como:

 // Detecte o método DOM if ("QuerySelectorAll" no documento) {var images = document.QuerySelectorAll ("img");}

Este código verifica se o QuerySelectorAll está definido no documento e, nesse caso, use esse método. Embora não seja o método ideal, é a maneira mais segura de detectar se o método DOM existe no IE 8 e os navegadores anteriores. Em todos os outros casos, o operador TIPOOF é a melhor opção para detectar funções JavaScript.

Detectar matriz

Um dos problemas mais antigos de domínio cruzado do JavaScript está passando matrizes entre os quadros. O desenvolvedor logo descobriu que a instância do Array não pode retornar o resultado correto nesse cenário. Como mencionado acima, cada quadro possui seu próprio construtor de matriz, portanto, as instâncias em um quadro não serão reconhecidas em outro quadro.

Houve muitas pesquisas sobre como detectar tipos de matriz em JavaScript e, finalmente, Kangax deu uma solução elegante:

 função isarray (value) {return object.prototype.toString.call (value) === "[objeto Array]";}

Kangax descobriu que chamar o método ToString () de um valor retorna a string padrão resulta em todos os navegadores. Para as matrizes, a sequência retornada é "[Array do Objeto]" e não há necessidade de considerar qual quadro a instância da matriz é construída. Esse método geralmente é muito útil ao identificar objetos internos, mas não use esse método para objetos personalizados.

O ECMAScript5 introduz oficialmente o Array.esArray () em JavaScript. O único objetivo é detectar com precisão se um valor é uma matriz. Como as funções de Kangax, Array.isArray () também pode detectar valores passados ​​através de quadros, tantas bibliotecas de classe JavaScript atualmente implementam esse método da mesma forma.

 function isarray (value) {if (typeof Array.isArray === "function") {return Array.ISArray (value);} else {return object.prototype.toString.Call (value) === "[Array do objeto]";}}

IE 9+, Firefox 4+, Safari 5+, Opera 10.5+ e Chrome implementam o método Array.esArray ().

Detectar propriedades

Outro cenário em que nulo (e indefinido) é quando detecta se existe um atributo em um objeto, como:

 // Redação ruim: detecte valores falsos if (object [PropertyName]) {// algum código} // gravações ruins: compare com nulo if (object [PropertyName]! = Null) {// algum código} // gravações ruins: compare com indefinido se (object [propertyName]! =

Cada julgamento no código acima realmente verifica o valor do atributo pelo nome fornecido, em vez de julgar se existe o atributo referido pelo nome especificado. No primeiro julgamento, o resultado será errado quando o valor da propriedade for um valor falso, como: 0, "" (string vazia), falsa, nula e indefinida, afinal, esses são os valores legais da propriedade.

A melhor maneira de determinar se existe um atributo é usar o operador IN. O operador no IN simplesmente julga se a propriedade existe sem ler o valor da propriedade. Se a propriedade do objeto de instância existir ou herdar do protótipo do objeto, o operador no IN retornará true. por exemplo:

 var object = {count: 0,related: null};// Good writing if ("count" in object) {// The code here will be executed}// Bad writing: Detect false values ​​​​if (object["count"]) {// The code here will not be executed}// Good writing if ("related" in object) {// The code here will be executed}// Bad writing, check if (object["related"] != null) {// O código aqui não será executado}

Se você deseja apenas verificar se existe uma determinada propriedade do objeto de instância, use o método HasOwnProperty (). Todos os objetos JavaScript herdados do objeto têm esse método. Se essa propriedade existir na instância, ele retornará true (se essa propriedade existir apenas no protótipo, ele retornará false). Deve -se notar que, no IE 8 e nas versões anteriores do IE, os objetos DOM não herdam do objeto; portanto, esse método não inclui. Ou seja, você deve verificar se o método HasOwnProperty () do objeto DOM existe antes de chamá -lo.

 // Esta é uma boa maneira de escrever if (object.HasownProperty ("Related")) {// Execute o código aqui} // se você não tiver certeza se é um objeto DOM, escreva se ("hasOwnProperty" no objeto && Object.HasownProperty ("Relacionado") {// Execute O código}

Como existem o IE 8 e as versões anteriores do IE, ao julgar se os atributos do objeto de instância existem, prefiro usar o operador no IN. HasOwnProperty () só será usado ao julgar as propriedades da instância.

Independentemente de quando você precisar detectar a existência de uma propriedade, use o operador ou o hasownProperty (). Fazer isso pode evitar muitos bugs.

O exposto acima é a detecção JavaScript de valores originais, valores de referência e atributos introduzidos pelo editor. Espero que seja útil para todos. Se você tiver alguma dúvida, deixe -me uma mensagem e o editor responderá a todos a tempo. Muito obrigado pelo seu apoio ao site wulin.com!