Javascript

Mantenerse actualizado con las últimas novedades en desarrollo web es complicado. Siempre están apareciendo nuevas versiones de todo tipo. Y cuando te descuidas algo queda deprecated (obsoleto). Por ello me he decidido dedicarme una tarde para actualizar mis conocimientos y hacer un upgrade de ES5 (el estándar más aceptado de Javascript) por ES6.

Una de las sensaciones que más me han gustado a sido la de no necesitar JQuery. Es lo suficiente productivo y maduro para trabajar de forma habitual a otros lenguajes. Además, ha mejorado la iteraciones de los bucles, con una semejanza a Python bien llevada. Con un nuevo formateo de clases actual. Y declaración de variables mejor definidos. Ya no todo será global.

A continuación dejo comentado mis apuntes. Dejen comentarios si ven alguna incoherencia o corrección.

// Variables
let sBloque = 'Naranja'
var sGeneral = 'Manzana'
const SCONSTANTE = 'Zanahoria'

// JSON

let oComp = {
	nombre: 'fresa',
	peso: 20,
	sabor: 'dulce' 
};

console.log(oComp.nombre + ' es ' + oComp.sabor + ' y pesa ' + oComp.peso)

// Funcion con valor por defecto
function fConDefault(x, y=12) {

}

// Funcion con un array de argumentos
function fConArgInfinitos(x, ...y) {
	return x * y.length;
}
fConArgInfinitos(3, "hello", true) == 6


// Loop de iteracion
let aFibonacci = [1, 1, 2, 3, 5, 8]

for (let n of aFibonacci) {
	console.log(n)
}

// Clase
class Maldad {

	// Constructor
	constructor() {
		this.sNombre = "Dolor"
	}

	// Funciones
	soyFuncional() {
		console.log('FUNCION: Yo funciono, ¿Y tú?') 
	}
	// Gets
	get nombre() {
		return this.sNombre
	}
	// Sets
	set nombre(insNom) {
		this.sNombre = insNom
	}

	// Static
	static FECHA() {
		return new Date();
	}
}

// Crear objeto
let miMaldad = new Maldad()

// Usar funcion
miMaldad.soyFuncional()

// Usar SET
miMaldad.nombre = 'Moradura'

// Usar GET
console.log("GET: " + miMaldad.nombre)
console.log("STATIC: " + Maldad.FECHA())


///// Concadenar variables directamente

let iScoreVal = 1, iScoreLev = 3

console.log(`El Valencia va a ${iScoreVal} y el Levante ${iScoreLev}`)

// Bloque
let libro = `
En un lugar
de la macha
`

////////// IMPORT

// lib/math.js
export function sum(x, y) {
	return x + y;
}

export var pi = 3.141593;

// app.js
import * as math from "lib/math";
alert("2π = " + math.sum(math.pi, math.pi));

// otherApp.js
import {sum, pi} from "lib/math"; alert("2π = " + sum(pi, pi));

// Ejecutar cuando se cargue 
System.import('lib/math').then(function(m) { 
	alert("2π = " + m.sum(m.pi, m.pi));
});

/////// Estructura de datos

// Set (Conjuntos)
let setPelis = new Set(); // No permite repeticiones
setPelis.add('Lo que el viento se llevó')
setPelis.add('Lo que el viento se llevó')
setPelis.add('La gran evasion')
// Solo tendría dos elementos

// Comprobar si existe
console.log('SET: Tiene la Gran evasion? ' + setPelis.has('La gran evasion'))

// Ver la longitud
console.log('SET: ' + setPelis.size) // 2

// Maps
let mapPrecios = new Map();
mapPrecios.set("Martini", 12);
mapPrecios.set(setPelis, 34);
console.log('MAPS: Precio de Martini ' + mapPrecios.get('Martini'))

// Weak Maps
var wm = new WeakMap();
wm.set(setPelis, { extra: 42 });
wm.size === undefined

// Weak Sets
var ws = new WeakSet();
ws.add({ data: 42 });

/////////// Nuevas bibliotecas

// Number
console.log('EPSILON: ' + Number.EPSILON)
console.log('IsInteger: ' + Number.isInteger(5))
console.log('IsNaN: ' + Number.isNaN('5'))

// Math
console.log('Acosh: ' + Math.acosh(5))

// Array
let aABC = ['a', 'b', 'c']
console.log(aABC.find(x => x == 'a')) // a
console.log(aABC.findIndex(x => x == 'b')) // 1 
console.log(aABC.copyWithin(2, 0)) // ['a', 'b', 'a'] Arg1 Donde Arg2 El que
aABC[2] = 'c'
console.log(aABC.entries()) // iterator [0, "a"], [1,"b"], [2,"c"] ¡No va en Firefox!
console.log(aABC.keys()) // iterator 0 1 2 ¡No va en Firefox!
console.log(aABC.values()) // iterator a b c ¡No va en Firefox!