Erros comuns de JavaScript
Este capítulo aponta alguns erros comuns de JavaScript.
Usando acidentalmente o operador de atribuição
Programas JavaScript podem gerar resultados inesperados se um programador usar acidentalmente um operador de atribuição ( =), em vez de um operador de comparação ( ==) em uma instrução if.
Esta ifinstrução retorna false(como esperado) porque x não é igual a 10:
let x = 0;
if (x == 10)
Esta ifdeclaração retorna true(talvez não conforme o esperado), porque 10 é verdadeiro:
let x = 0;
if (x = 10)
Esta ifdeclaração retorna false(talvez não conforme o esperado), porque 0 é falso:
let x = 0;
if (x = 0)
Uma atribuição sempre retorna o valor da atribuição.
Esperando Comparação Fraca
Na comparação regular, o tipo de dados não importa. Esta ifdeclaração retorna verdadeiro:
let x = 10;
let y = "10";
if (x == y)
Em comparação estrita, o tipo de dados importa. Esta ifdeclaração retorna false:
let x = 10;
let y = "10";
if (x === y)
É um erro comum esquecer que as switchdeclarações usam comparação estrita:
Isso case switchexibirá um alerta:
let x = 10;
switch(x) {
case 10: alert("Hello");
}
Isso case switchnão exibirá um alerta:
let x = 10;
switch(x) {
case "10": alert("Hello");
}
Adição e concatenação confusas
Adição é sobre somar números .
A concatenação consiste em adicionar strings .
Em JavaScript ambas as operações usam o mesmo +operador.
Por causa disso, adicionar um número como um número produzirá um resultado diferente de adicionar um número como uma string:
let x = 10;
x = 10 + 5; //
Now x is 15
let y = 10;
y += "5";
// Now y is "105"
Ao adicionar duas variáveis, pode ser difícil antecipar o resultado:
let x = 10;
let y = 5;
let z = x + y; // Now z is 15
let x = 10;
let y = "5";
let z = x + y; // Now z is "105"
Flutuadores mal-entendidos
Todos os números em JavaScript são armazenados como números de ponto flutuante de 64 bits (Floats).
Todas as linguagens de programação, incluindo JavaScript, têm dificuldades com valores precisos de ponto flutuante:
let x = 0.1;
let y = 0.2;
let z = x + y
// the result in z will not be 0.3
Para resolver o problema acima, ajuda a multiplicar e dividir:
Exemplo
let z = (x * 10 + y * 10) / 10; // z will be 0.3
Quebrando uma string JavaScript
JavaScript permitirá que você divida uma instrução em duas linhas:
Exemplo 1
let x =
"Hello World!";
Mas, quebrar uma instrução no meio de uma string não funcionará:
Exemplo 2
let x = "Hello
World!";
Você deve usar uma "barra invertida" se precisar quebrar uma instrução em uma string:
Exemplo 3
let x = "Hello \
World!";
Erro de ponto e vírgula
Por causa de um ponto e vírgula mal colocado, este bloco de código será executado independentemente do valor de x:
if (x == 19);
{
// code block
}
Quebrando uma declaração de retorno
É um comportamento padrão do JavaScript fechar uma instrução automaticamente no final de uma linha.
Por causa disso, esses dois exemplos retornarão o mesmo resultado:
Exemplo 1
function myFunction(a) {
let power = 10
return a * power
}
Exemplo 2
function myFunction(a) {
let power = 10;
return a * power;
}
JavaScript também permitirá que você divida uma instrução em duas linhas.
Por causa disso, o exemplo 3 também retornará o mesmo resultado:
Exemplo 3
function myFunction(a) {
let
power = 10;
return a * power;
}
Mas, o que acontecerá se você quebrar a instrução de retorno em duas linhas como esta:
Exemplo 4
function myFunction(a) {
let
power = 10;
return
a * power;
}
A função retornará undefined!
Por quê? Porque o JavaScript pensou que você queria dizer:
Exemplo 5
function myFunction(a) {
let
power = 10;
return;
a * power;
}
Explicação
Se uma declaração estiver incompleta como:
let
O JavaScript tentará completar a instrução lendo a próxima linha:
power = 10;
Mas como esta declaração está completa:
return
JavaScript irá fechá-lo automaticamente assim:
return;
Isso acontece porque fechar (terminar) instruções com ponto e vírgula é opcional em JavaScript.
JavaScript fechará a instrução return no final da linha, porque é uma instrução completa.
Nunca quebre uma instrução de retorno.
Acessando Arrays com Índices Nomeados
Muitas linguagens de programação suportam arrays com índices nomeados.
Arrays com índices nomeados são chamados de arrays associativos (ou hashes).
JavaScript não suporta arrays com índices nomeados.
Em JavaScript, arrays usam índices numerados :
Exemplo
const person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
person.length;
// person.length will return 3
person[0];
// person[0] will return "John"
Em JavaScript, os objetos usam índices nomeados .
Se você usar um índice nomeado, ao acessar uma matriz, o JavaScript redefinirá a matriz para um objeto padrão.
Após a redefinição automática, métodos e propriedades de array produzirão resultados indefinidos ou incorretos:
Exemplo:
const person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
person.length; // person.length will
return 0
person[0];
// person[0] will return undefined
Finalizando definições com uma vírgula
Vírgulas à direita na definição de objeto e matriz são legais no ECMAScript 5.
Exemplo de objeto:
person = {firstName:"John", lastName:"Doe", age:46,}
Exemplo de matriz:
points = [40, 100, 1, 5, 25, 10,];
AVISO !!
O Internet Explorer 8 irá falhar.
JSON não permite vírgulas à direita.
JSON:
person = {"firstName":"John", "lastName":"Doe", "age":46}
JSON:
points = [40, 100, 1, 5, 25, 10];
Indefinido não é nulo
Objetos, variáveis, propriedades e métodos JavaScript podem ser undefined.
Além disso, objetos JavaScript vazios podem ter o valor null.
Isso pode dificultar um pouco o teste se um objeto está vazio.
You can test if an object exists by testing if the type is undefined:
Example:
if (typeof myObj === "undefined")
But you cannot test if an object is null, because this will throw an error if the
object is undefined:
Incorrect:
if (myObj === null)
To solve this problem, you must test if an object is not null,
and not undefined.
But this can still throw an error:
Incorrect:
if (myObj !== null && typeof myObj
!== "undefined")
Because of this, you must test for not undefined before you can
test for not null:
Correct:
if (typeof myObj !== "undefined" && myObj !== null)