¿Cuál es una trampa potencial al usar typeof bar === “objeto” para determinar si bar es un objeto?

El operador typeof en JavaScript devuelve una string que indica el tipo de datos del operando, ya sea una variable, función u objeto.

Sintaxis: La siguiente es la sintaxis del operador typeof :

typeof operand
// OR 
typeof(operand)

Parámetro: Toma el siguiente parámetro:

• operando: La expresión cuyo tipo necesita ser evaluado.

Ejemplo: ejemplo básico que demuestra el operador typeof .

<script>
    // Output should be "string"
    console.log(typeof "Geeks");
      
    // Output should be "number"
    console.log(typeof 1);
      
    // Output should be "boolean"
    console.log(typeof false);
      
    // Undeclared variable. Output should be "undefined"
    console.log(typeof geeksForGeeks); 
      
    // Output should be "object"
    console.log(typeof { name: "Rajat", gender: "Male" }); 
</script>

Producción:

string
number
boolean
undefined
object

Un objeto en JavaScript es una colección de propiedades y estas propiedades generalmente vienen en forma de pares clave-valor. Se puede considerar como un tipo de datos no primitivo. 

Hay tres métodos diferentes para crear un objeto:

• Por un objeto literal
• Usando cualquier constructor de objetos
• Creando una instancia de la clase Object en JavaScript directamente.

Ejemplo: Crear un objeto por un objeto literal.

Sintaxis:

const object = {property1: value1, property2: value2};  

<script>
    const gfgObject = { 
        name: "Rajat", 
        age: 30,
        gender: "Male" 
    };
       
    // Printing object 
    console.log(gfgObject);
</script>

Producción:

{
   name: 'Rajat',
   age: 30,
   gender: 'Male'
}

Ejemplo: crear un objeto utilizando cualquier constructor de objetos

<script>
  
    // Constructor function ("this" refers
    // to the current object)
    function student(name, age, gender){
        this.name = name;
        this.age = age;
        this.gender = gender;
    }
      
    const s = new student("Rajat",11,"Male");
    console.log(s);
<script>

Producción:

{
   name: 'Rajat',
   age: 11,
   gender: 'Male'
}

Ejemplo: Cree un objeto creando una instancia de la clase Object en JavaScript directamente.

Sintaxis:

const GFG = new Object();  

const GFG = new Object();
  GFG.name = "Rajat";
  GFG.age = 35;
  GFG.gender = "Male";
    
  // Printing object
  console.log(GFG);

Producción:

{
   name: 'Rajat',
   age: 35,
   gender: 'Male'
}

Llegando al tipo de barra === “objeto” , si la variable barra es un objeto, lo que significa que si toma la forma de cualquiera de los tres tipos de objetos mencionados anteriormente, entonces la declaración devolverá verdadero . Inicialmente, typeof bar === “objeto” parece un método fiable para determinar si bar es un objeto o no. Sin embargo, un peligro potencial de usar el mismo es que en el ámbito de JavaScript, incluso el valor primitivo nulo se considera como un objeto. 

En realidad, esto es un error en el lenguaje, ya que nulo debería indicar la ausencia intencional de un valor de objeto, pero devuelve «objeto» cuando se prueba con el operador typeof . Hubo un intento de solucionarlo en el pasado, pero fue rechazado debido a un problema de compatibilidad con versiones anteriores. El siguiente fragmento de código ilustra este problema:

<script>
    const bar = null;
      
    // Logs true to the console
    console.log(typeof bar === 'object'); 
</script>

Producción:

true

Esto se puede evitar si se agrega una verificación simple al código preexistente. Es decir, comprueba si bar !== null. Ahora producirá el resultado esperado ( falso ).

const bar = null;
  
 // Logs false
console.log((bar !== null) && (typeof bar === 'object'));

Producción:

false

Hasta esta etapa, se supone que la barra es una variable. Pero, ¿y si bar es una función? La solución anterior devolverá falso , que es el resultado deseado en la mayoría de los casos, pero si hay un escenario en el que el resultado esperado es verdadero , el código debe modificarse ligeramente de la siguiente manera:

<script>
    function bar() {
        const b = 1;
    }
      
    console.log((bar !== null) && (typeof bar === 'object') ||
    (typeof bar === 'function'));
</script>

Producción:

true

Si bar es una array, la solución anterior devolverá verdadero , que es el resultado deseado en este caso, ya que las arrays se consideran objetos, pero si hay una situación en la que se espera que la salida sea falsa , el código se puede modificar como se muestra a continuación:

<script>
    const bar = [1, 2, 3];
      
    console.log((bar !== null) && (typeof bar === "object") && 
    (toString.call(bar) !== "[object Array]"));
</script>

Producción:

false

Existe una alternativa final que devuelve falso para arrays, valores nulos y funciones, pero verdadero para objetos. El código se ve de la siguiente manera:

<script>
    const bar = { firstName: "foo", lastName: "bar" };
      
    console.log((bar !== null) && (bar.constructor === Object));
</script>

Producción:

true