Cuestionario Javascript 2016

Se acerca el cierre de este año 2016 y toca hacer un repaso rápido a las novedades que se han ido introduciendo poco a poco en el lenguaje Javascript.

Ya sea gracias al soporte de los navegadores, o la propia evolución del estándar ECMAScript, contamos a día de hoy con una sintaxis casi completamente renovada, nuevos y útiles métodos extraídos de otros lenguajes y bibliotecas, multitud de APIs (tanto de nuevo cuño como alternativas), mucha azúcar sintáctica, y hasta una nueva primitiva como Symbol.

Este test, que inicia una nueva sección de este blog, puede ser de utilidad para comprobar cómo hemos ido asimilando todas estas novedades. Si bien es cierto que se trata de ejemplos muy forzados (e intencionadamente complejos), nos obligan a pensar cada línea mentalmente para no perder el hilo.

Esta prueba trata exclusivamente sobre el lenguaje Javascript, no sobre sus bibliotecas, herramientas o frameworks más utilizados. Tampoco se contempla aquí la plataforma Node.js.

No hay que confundir Javascript con sus frameworks y bibliotecas. Mientras que el primero es un lenguaje de programación, el resto son solo herramientas en continuo cambio sujetas a la moda del momento.

Te animamos a tomarte un rato libre, de unos 30 minutos, para probar tus habilidades y compartir tus resultados e impresiones en los comentarios.
¡Suerte!

Instrucciones para la prueba online

Duración aproximada: 30 minutos.

Criterio de evaluación

- La prueba se compone de 10 preguntas tipo test.
- Cada respuesta correcta suma 1 punto.
- Cada respuesta errónea resta 0.25 puntos.
- Una pregunta sin responder, no suma ni resta puntos.

¡No se permite ojear en la consola del navegador!

Parámetros por defecto… ¿Qué valores nos pinta esta función?

let fn = ( foo = 'default1', bar = 'default2' ) => console.info( foo, bar );
 
fn( undefined, null );

default1, null
undefined, null
default1, default2
undefined, undefined

Hoisting según la declaración de variables: ¿qué devuelven los siguientes logs?

x = y = 'global';
 
( () => {
    console.info( x );
    console.info( y );
 
    var x = 'local';
    let y = 'local';
} )();

undefined, undefined
local, local
global, global
undefined, ReferenceError

Retornos con el operador coma: ¿qué resultado obtenemos en este fragmento?

let double = ( x ) => x * 2,
    triple = ( x ) => x * 3;
 
let result = ( double( 4 ), triple( 4 ) );
 
console.info( result );

12
8 12
8
SyntaxError

Parámetros auto referentes y declaraciones repetidas… ¡qué lío!

const fn = ( x, f = () => x ) => {
    var x,
        y = x;
 
    x = 2;
 
    return [ x, y, f() ];
}; 
 
console.info( fn( 1 ) );

[2, undefined, 1]
[2, 1, 1]
[1, undefined, 1]
[2, undefined, 2]

Trabajo con arreglos: ¿qué conjunto obtenemos en esta operación?

let setA = new Set( [ 'Monday', 'Tuesday', 'Friday', 'Saturday' ] ),
    setB = new Set( [ 'Tuesday', 'Sunday', 'Wednesday', 'Thursday' ] ),
 
    setC = new Set( [ ...setA, ...setB ] );
 
console.info( setC.size );

Mas trabajos con arreglos, programación funcional y mutabilidad

const removeItemFromArr = ( arr, item ) => arr.filter( e => e !== item );
 
 
let foo = [ 'thumb-1', 'thumb-2', 'thumb-3', 'thumb-4' ];
 
console.info( removeItemFromArr( foo, 'thumb-2', 'thumb-5' ) );
console.info( foo );

undefined, [«thumb-1», «thumb-2», «thumb-3», «thumb-4»]
[«thumb-1», «thumb-2», «thumb-3», «thumb-4»], [«thumb-1», «thumb-2», «thumb-3», «thumb-4»]
[«thumb-1», «thumb-3», «thumb-4»], [«thumb-1», «thumb-3», «thumb-4»]
[«thumb-1», «thumb-3», «thumb-4»], [«thumb-1», «thumb-2», «thumb-3», «thumb-4»]

¿¿¿Qué le han hecho a mi Javascript???

let fn = {
    s ( ...args ) {
        return args.reduce( ( a, b ) => a + b, 0 );        
    }    
};
 
console.info( fn.s( 10, 20, 30 ) );

SyntaxError
30
60
NaN

Desestructurando y arrastrando, que es gerundio…

let [ x, ...[ y, z ] ] = [ 'a', 'b', 'c' ];
 
console.info( x, y, z );

a, [b, c] undefined
a, b, c
[a], [b], [c]
a, [undefined, undefined], undefined

Indefinición, parcialidad, asociación y anonimato con flechas… ¿Qué puede salir de todo esto?

let fn = ( ( x, y ) => x + y ).bind( undefined, 1 );
 
console.info( fn( 10 ) );

«undefined1»
NaN
undefined
11

Hey, ¡esas llaves!… ¿Qué pinta cada log de esta criatura?

( () => {
    let x = 'foo';
 
    if ( x ) {
        let x = 'bar';
        console.info( x );
    }
 
    console.info( x );
} ) ();

bar, foo
foo, foo
bar, bar
SyntaxError: redeclaration of formal parameter x

Preguntas contestadas:

Preguntas correctas: | Preguntas erróneas:

Tu Puntuación Total:

{8} Comentarios.

Javier Saldaña
25Nov2016/

Excelente Test hehehehehe he sacado 5 (6ok, 4err). No debería sentirme feliz, pero estoy así hehehehe
Elena Torro
26Nov2016/

7,5 🙂
- Carlos Benítez
  27Nov2016/
  
  Enhorabuena!
  Aprovecho los comentarios para agradecerte públicamente la idea de re hacer el viejo cuestionario de 2011 con algo más moderno. 🙂
  
  Saludos!
Flavio Corpa
28Nov2016/

9/10
jjdltc
08Dic2016/

¿¡Qué le han hecho a mi Javascript!?
Me ha gustado, ahora a re-pensar las que no acerte.
Ushiosan23
28Abr2017/

En la parte del comentario donde pones que hay un bug en la consola de chrome, me doy cuenta que el resultado bueno no sale ni en la consola de firefox ya que me arroja «array[2,1,1]» (hasta en la consola de Babel me sale lo mismo) no se si sea el mismo bug o los resultados de las preguntas están mal.
Aprovecho para decir que saque 5/10 me falta aprender más sobre la nueva forma de programar en ES6
- Carlos Benítez
  02May2017/
  
  Hola!
  Efectivamente, la especificación ECMA ha aclarado ese aspecto y ahora, todos los navegadores, incluido Babel, han modificado sus intérpretes de acuerdo a ella.
  
  He modificado la pregunta y he eliminado la advertencia para que no dé lugar a más confusión.
  
  Gracias por el apunte!!
Aarón García Hervás
10Jul2017/

Llego tarde pero… 10/10

Cuestionario Javascript 2016

Instrucciones para la prueba online

Criterio de evaluación

{8} Comentarios.

Deja un comentario Cancelar respuesta