heanfig/lodash.html

## lodash.html
<html>
<head>
	<title>Lodash mis primeros pasos</title>
</head>
<body>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.2.0.min.js"></script>
<script type="text/javascript" src="https://raw.githubusercontent.com/lodash/lodash/4.0.0/dist/lodash.min.js"></script>
<div id="salida">
</div>
<script type="text/html" id="template">
	<h1>hola <%= nombre %> tu edad es <span style="color:red"> <%= edad %> </span> </h1>
</script>
<script type="text/javascript">

//_.isEmpty() -> valida si un arreglo esta vacio
var arreglo = [];
var estaVacio = _.isEmpty(arreglo);

//_.difference() -> realiza una comparacion entre 2 arreglos y retorna la diferencia entre los 2
var arreglo1 = [1,2,3,4,5,6,7,8];
var arreglo2 = [1,2,3,4,5,6];
var diferencia = _.difference(arreglo1,arreglo2);
console.log(diferencia);

//para estructuras mas complejas podemos usar differenceBy
var alumnos = [{'nombre':'maria'},{'nombre':'alvaro'},{'nombre':'pedro'}]
var alumnosaprobados = [{'nombre':'maria'}];
//en este caso sacamos la diferencia de los 2 y me retornaria los no aprobados
var noaprobados = _.differenceBy(alumnos,alumnosaprobados,'nombre');
console.log(noaprobados);


//para reasignar valores de arreglos y manipular sus iteraciones usamos map
var numeros = [2,3,1,54,7,3,6,4,6];
//debe de retornar el numero multiplicado por 3 en este caso se usa map
var procesoNumeros = _.map(numeros,function(n){
	return n * 3;
});
console.log(procesoNumeros);

//LODASH + JQUERY
//si queremos manejar templates podemos usar una estructura mas compleja y unirlo con librerias
//var plantilla = _.template('<h1>hola <%= nombre %> tu edad es <span style="color:red"> <%= edad %> </span> </h1>');
//o tambien podemos usar jquery
var plantilla = _.template( $("#template").html() );
var plantillacompilada = plantilla({ 'nombre': 'fred', 'edad': 23});
$("#salida").html(plantillacompilada);

</script>
</body>
</html>
	<html>
	<head>
	<title>Lodash mis primeros pasos</title>
	</head>
	<body>
	<script type="text/javascript" src="https://code.jquery.com/jquery-2.2.0.min.js"></script>
	<script type="text/javascript" src="https://raw.githubusercontent.com/lodash/lodash/4.0.0/dist/lodash.min.js"></script>
	<div id="salida">
	</div>
	<script type="text/html" id="template">
	<h1>hola <%= nombre %> tu edad es <span style="color:red"> <%= edad %> </span> </h1>
	</script>
	<script type="text/javascript">

	//_.isEmpty() -> valida si un arreglo esta vacio
	var arreglo = [];
	var estaVacio = _.isEmpty(arreglo);

	//_.difference() -> realiza una comparacion entre 2 arreglos y retorna la diferencia entre los 2
	var arreglo1 = [1,2,3,4,5,6,7,8];
	var arreglo2 = [1,2,3,4,5,6];
	var diferencia = _.difference(arreglo1,arreglo2);
	console.log(diferencia);

	//para estructuras mas complejas podemos usar differenceBy
	var alumnos = [{'nombre':'maria'},{'nombre':'alvaro'},{'nombre':'pedro'}]
	var alumnosaprobados = [{'nombre':'maria'}];
	//en este caso sacamos la diferencia de los 2 y me retornaria los no aprobados
	var noaprobados = _.differenceBy(alumnos,alumnosaprobados,'nombre');
	console.log(noaprobados);


	//para reasignar valores de arreglos y manipular sus iteraciones usamos map
	var numeros = [2,3,1,54,7,3,6,4,6];
	//debe de retornar el numero multiplicado por 3 en este caso se usa map
	var procesoNumeros = _.map(numeros,function(n){
	return n * 3;
	});
	console.log(procesoNumeros);

	//LODASH + JQUERY
	//si queremos manejar templates podemos usar una estructura mas compleja y unirlo con librerias
	//var plantilla = _.template('<h1>hola <%= nombre %> tu edad es <span style="color:red"> <%= edad %> </span> </h1>');
	//o tambien podemos usar jquery
	var plantilla = _.template( $("#template").html() );
	var plantillacompilada = plantilla({ 'nombre': 'fred', 'edad': 23});
	$("#salida").html(plantillacompilada);

	</script>
	</body>
	</html>