B3T8 SCRIPTING FRONT

Question 1

¿Para que sirven los sourceMap (ficheros con extensión .map) ?

Answer 1

Ya que los js y css están muy compactados (minify), se generan estos ficheros con el proposito de que podamos depurar en el navegador con un codigo “legible”

Question 2

¿Que son mustache, jade y dust?

Answer 2

Motores de plantillas para front

Question 3

¿Como se le dice al modulo de AJAX despues de hacerle una peticion asincrona, que queremos que nos avise en una función nuestra cuando los datos hayan llegado o estén llegando?

Answer 3

xhr.onreadystatechange = function () {

if(xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {

console.log(xhr.responseText);

}

};

Atención:: readyState puede ser:
1-> Abierto
2-> Cabeceras recibidas
3-> Cargando
4 –> completado –> XMLHttpRequest.DONE

Question 4

¿Como se llama el objeto principal del modulo de AJAX?

Answer 4

xmlHttpRequest

Question 5

¿Con que comando se crea un proyecto “vacio” en angular?

Answer 5

ng new mi-proyecto

(para poder usar ng hay que instalar –> npm install @angular/cli)

Question 6

¿Como se denomina la siguiente expresión y que representa?

(function () {

….

})();

Answer 6

Se denomina expresion IIFE (expresion de funcion invocada inmediatamente)

Sirve para definir y ejecutar una funcion (todo a la vez)

Question 7

¿Que devuelve typeof(null) en javascript?

Answer 7

Object

Question 8

¿Con que “técnica podemos conseguir herencia en javascript?

Answer 8

prototipos

Question 9

Dado que TypeScript es una lenguaje de scripting de alto nivel que no comprenden los navegadores, ¿que habria que hacer?

Answer 9

transpilarlo.

Herramientas –> Babel, traceur y tsc

Question 10

¿Que son jasmine, mocha y jest ?

Answer 10

Herramientas para testing de javascript

Question 11

Indica nuevos lenguajes Javascript que necesitan ser transpilados

Answer 11

TypeScript (Microsoft), Dart(Google), CoffeScript, ClojureScript.

Podríamos utilizar los siguientes transpiladores: Babel, Traceur, Tsc

Question 12

Nombra tres trasnpiladores

Answer 12

Babel, Traceur, Tsc

Question 13

Historia de Javascript

Answer 13

Mocha -> LiveScript -> JavaScript -> EcmaScript 262 -> Ecma Script 6 o ES 2015

(ES == EcmaScript)

Question 14

¿Para que sirve Bower?

Answer 14

Gestor de dependencias/ versiones de librerías (Se instala con npm y tira del fichero bower.json.
La carpeta de paquetería, módulos y dependencias es bower_components

Question 15

¿Para que sirve Gulp/Grunt?

Answer 15

Automatiza desarrollo (minificar JS, Transpilar Sass/Less a SS, test, etc)
Archivo gulpfile.js
–» Blunder -> Empaquetador mejor que Gulp y Grunt

Question 16

¿Para que sirve Yeoman?

Answer 16

Generar estructuras de ficheros y directorios en base a una serie de tipos de proyectos predefinidos

Question 17

¿Qué es React?

Answer 17

Es una librería de código abierto diseñada para crear interfaces de usuario. Mantenido por facebook y la comunidad de software libre.

Question 18

¿Qué es Angular?

Answer 18

Es una plataforma y framework desarrollado en TypeScript que se utiliza para crear y mantener aplicaciones de una sola página (SPA Single Page Application).
Mantenido por Google, de código abierto.

Question 19

¿Qué es Vue?

Answer 19

Vue.js es un framework de JavaScript de código abierto para la construcción de interfaces de usuario y aplicaciones de una sola página.
Mantenido por Evan You, y otros miembros.

Question 20

¿Para que sirve Yarn o npm?

Answer 20

Para gestionar dependencias en los proyectos.
Ambas tiran del fichero package.json.

Question 21

¿Para que sirven herramientas como Webpack, Browserify, Fusevox, Rollup o Parcel?

Answer 21

Para empaquetar nuestros proyectos. Son package bundler.

Question 22

¿Qué es un linter?

Answer 22

Son herramientas de mejora del código mediante análisis del código fuente.
Se entiende como una herramienta a cargo de la mejora del código a través del análisis del código fuente, con el objetivo de identificar fallos o problemas en el sistema

Question 23

¿Qué indican las siglas AJAX?

Answer 23

Asynchronous JavaScript And XML

Question 24

¿Qué parámetros nos indican en una petición AJAX el estado de una petición

Answer 24

• Readystate –>Estado del objeto. 0=sin inicializar; 1= Abierto; 2= Cabeceras recibidas;3 = Cargando; 4= completado

*status –> 200=”OK”; 404=”NOT FOUND”

Para comprobar si la petición ha sido correcta:
readyState igual a 4 y status 200 OK

Question 25

¿Qué tipo de peticiones sustituyen a las peticiones XHR (XmlHttpRequest)?

Answer 25

1. Fetch. No devuelve estados 404 o 500… No es un estándar pero todos los navegadores lo incluyen. Funciona con promesas.
   Ej.:

fetch(‘https://ubahthebuilder.tech/posts/1’)
.then(data => { return data.json(); })
.then(post => { console.log(post.title);
});

2. Axios. Librería para hacer peticiones asíncronas

Question 26

¿Qué añadió ES6 al estandar de Javascript?

Answer 26

Promesas, Clases, Array Functions (forEach, map, filter) y arrow Functions (permiten definir de manera compacta una función convencional)

Question 27

¿Qué son las clausuras o closures en javascript?

Answer 27

Son funciones que pueden acceder a valores fuera de su contexto.

Question 28

¿Para que sirve la funcion JSON.stringify?

Answer 28

Para pasar de objeto javascript a JSON

Question 29

¿Para que sirve la función JSON.parse?

Answer 29

Pasa de JSON a objeto javascript

Question 30

¿Para que sirve la función forEach()?

Answer 30

Recorrer array

Question 31

¿Para que sirve la función map()?

Answer 31

Crea un nuevo array dando opción de cambiar los valores del inicial

Question 32

¿Para que sirve la función filter?

Answer 32

Devuelve un array filtrado

Question 33

¿Para que sirve la función slice()?

Answer 33

Devuelve un array con un rango de elementos indicados. NO MODIFICA EL ARRAY DE ORIGEN

EJ.

Question 34

¿Para que sirve la función splice()?

Answer 34

añade, borra o reemplaza elementos de un array

Question 35

¿Qué son las promesas de Javascript?

Answer 35

Son código Asincrono. Objeto promise. Se llama utilizando “.then()”

Question 36

¿Para que sirven los indicadores async y await?

Answer 36

Para realizar promesas sin tener que estar encadenando .then

Async -> Indica que la petición es asíncrona
Await -> Se utiliza para esperar el resultado de una función asíncrona. (Así no utilizamos el then)

Question 37

Cuando se activa el evento blur de javascript

Answer 37

Al abandonar el foco

Question 38

¿Para que sirve el evento preventdefault de javascript?

Answer 38

Para prevenir el comportamiento por defecto

Question 39

¿Podemos retornar una función desde otra función?

Answer 39

Si.
También se puede asignar una función a una variable y pasar una función como parámetro en otra función

Question 40

¿Es necesario declarar las variables en javascript?

Answer 40

No.

Question 41

Indica las diferencias entre declarar variables con let, var y const

Answer 41

-> Var: variable global
-> let: variable de ámbito bloque (xejemplo entre llaves). No pueden ser redeclaradas.
->const igual que let, pero su valor no puede cambiar

Question 42

¿Cuál es el operador XOR en javascript?

Answer 42

a^b ->Devuelve 1 si ambos operadores son diferentes

Question 43

Indica que devuelve esta comparación:
a??b

Answer 43

Devuelve b si a es null o undefined. Sino devuelve a

Question 44

Qué funciones tenemos disponibles en javascript para utilizar expresiones regulares

Answer 44

• match() -> Devuelve array con valores encontrados
• exec() -> Devuelve solo la primera coincidencia
• test()-> Devuelve true o false
• toString() Returns the string value of the regular expression