---

Este capítulo señala algunos errores comunes de JavaScript.

---

Uso accidental del operador de asignación (=)

Los programas JavaScript pueden generar resultados inesperados si un programador utiliza accidentalmente un operador de asignación (=), en lugar de un operador de comparación (==) en una declaración if.

Esta declaración if devuelve false (como se esperaba) porque x no es igual a 10:

let x = 0;
if (x == 10)

Esta declaración if devuelve true (tal vez no como se esperaba), porque 10 es true:

let x = 0;
if (x = 10)

Esta declaración if devuelve false (tal vez no como se esperaba), porque 0 es false:

let x = 0;
if (x = 0)

Una asignación siempre devuelve el valor de la asignación.

---

Esperando una comparación vaga

En una comparación regular, el tipo de datos no importa. Esta declaración if devuelve true:

let x = 10;
let y = "10";
if (x == y)

En una comparación estricta, el tipo de datos sí importa. Esta declaración if devuelve false:

let x = 10;
let y = "10";
if (x === y)

Es un error común olvidar que las declaraciones switch utilizan una comparación estricta:

Este caso switch mostrará una alerta:

let x = 10;
switch(x) {
  case 10: alert("Hola");
}

Este caso switch no mostrará una alerta:

let x = 10;
switch(x) {
  case "10": alert("Hola");
}

---

Suma y concatenación confusas

La suma consiste en sumar números.

La concatenación consiste en agregar cadenas.

En JavaScript ambas operaciones utilizan el mismo operador +.

Debido a esto, sumar un número como número producirá un resultado diferente al de sumar un número como una cadena:

let x = 10;
x = 10 + 5;       // Ahora x es 15

let y = 10;
y += "5";        // Ahora y es "105"

Al sumar dos variables, puede resultar difícil anticipar el resultado:

let x = 10;
let y = 5;
let z = x + y;     // Ahora z es 15

let x = 10;
let y = "5";
let z = x + y;     // Ahora z es "105"

---

Malentendido sobre floats

Todos los números en JavaScript se almacenan como float de 64 bits (Floats).

Todos los lenguajes de programación, incluido JavaScript, tienen dificultades con valores precisos de float:

let x = 0.1;
let y = 0.2;
let z = x + y            // El resultado de z no será 0.3

Para resolver el problema anterior, es útil multiplicar y dividir:

let z = (x * 10 + y * 10) / 10;       // z será 0.3

---

Rompiendo una cadena de JavaScript

JavaScript le permitirá dividir una declaración en dos líneas:

Ejemplo:

let x =
"Hola mundo";

Pero romper una declaración en medio de una cadena no funcionará:

Ejemplo:

let x = "Hola
mundo";

Debes utilizar una "barra invertida" si debe dividir una declaración en una cadena:

Ejemplo:

let x = "Hola \
mundo";

---

Colocar mal el punto y coma

Debido a un punto y coma mal colocado, este bloque de código se ejecutará independientemente del valor de x:

if (x == 19);
{
  // bloque de codigo
}

---

Romper una declaración de retorno

Es un comportamiento predeterminado de JavaScript cerrar una declaración automáticamente al final de una línea.

Por este motivo, estos dos ejemplos arrojarán el mismo resultado:

Ejemplo 1:

function myFunction(a) {
  let power = 10 
  return a * power
}

Ejemplo 2:

function myFunction(a) {
  let power = 10;
  return a * power;
}

JavaScript también le permitirá dividir una declaración en dos líneas.

Debido a esto, el ejemplo 3 también arrojará el mismo resultado:

Ejemplo 3:

function myFunction(a) {
  let
  power = 10; 
  return a * power;
}

Pero, ¿qué pasará si divides la declaración de retorno en dos líneas como esta?

Ejemplo 4:

function myFunction(a) {
  let
  power = 10; 
  return
  a * power;
}

La función devolverá undefined

¿Por qué? Porque JavaScript pensó que querías decir:

Ejemplo:

function myFunction(a) {
  let
  power = 10; 
  return;
  a * power;
}

---

Explicación

Si una declaración está incompleta como:

let

JavaScript intentará completar la declaración leyendo la siguiente línea:

power = 10;

Pero como esta declaración está completa:

return

JavaScript lo cerrará automáticamente así:

return;

Esto sucede porque cerrar (finalizar) declaraciones con punto y coma es opcional en JavaScript.

JavaScript cerrará la declaración de devolución al final de la línea, porque es una declaración completa.

Nunca rompas una declaración de devolución.

---

Acceder a matrices con índices con nombre

Muchos lenguajes de programación admiten matrices con índices con nombre.

Las matrices con índices con nombre se denominan matrices asociativas (o hashes).

JavaScript no admite matrices con índices con nombre.

En JavaScript, las matrices utilizan índices numerados:

Ejemplo:

const person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
person.length;       // person.length retornará 3
person[0];           // person[0] retornará "John"

En JavaScript, los objetos utilizan índices con nombre.

Si utiliza un índice con nombre, al acceder a una matriz, JavaScript redefinirá la matriz como un objeto estándar.

Después de la redefinición automática, los métodos y propiedades de la matriz producirán resultados indefinidos o incorrectos:

Ejemplo

const person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
person.length;      // person.length retornará 0
person[0];          // person[0] retornará undefined

---

Definiciones finales con coma

Las comas finales en la definición de objetos y matrices son legales en ECMAScript 5.

Ejemplo objeto:

person = {firstName:"John", lastName:"Doe", age:46,}

Ejemplo array:

points = [40, 100, 1, 5, 25, 10,];

ADVERTENCIA

Internet Explorer 8 fallará.

JSON no permite comas finales.

JSON:

person = {"firstName":"John", "lastName":"Doe", "age":46}

JSON:

points = [40, 100, 1, 5, 25, 10];

---

Undefinied no es nulo

Los objetos, variables, propiedades y métodos de JavaScript pueden no estar definidos.

Además, los objetos JavaScript vacíos pueden tener el valor nulo.

Esto puede hacer que sea un poco difícil probar si un objeto está vacío.

Puede probar si un objeto existe probando si el tipo no está definido:

Ejemplo:

if (typeof myObj === "undefined")

Pero no puedes probar si un objeto es nulo, porque esto arrojará un error si el objeto no está definido:

Incorrecto:

if (myObj === null)

Para resolver este problema, debes probar si un objeto no es nulo ni está indefinido.

Pero esto aún puede generar un error:

Incorrecto:

if (myObj !== null && typeof myObj !== "undefined")

Debido a esto, debes probar que no sea indefinido antes de poder probar que no sea nulo:

Correcto:

if (typeof myObj !== "undefined" && myObj !== null)

---

W3Schools es el sitio de desarrolladores web más grande del mundo.