From 058d0c896e7370d95e312629113ed60328c9e23f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?El=20Holand=C3=A9s=20Herrante?= <carlosd99m@gamil.com>
Date: Fri, 15 Jan 2021 17:39:53 -0600
Subject: [PATCH] jsBasico

---
 jsBasico/1-valores.js      | 24 +++++++++++
 jsBasico/1.1-types.js      | 20 ++++++++++
 jsBasico/10-switch.js      | 22 ++++++++++
 jsBasico/11-loops.js       | 22 ++++++++++
 jsBasico/12-arrays.js      | 42 +++++++++++++++++++
 jsBasico/13-arr-methods.js | 82 ++++++++++++++++++++++++++++++++++++++
 jsBasico/14-objects.js     | 29 ++++++++++++++
 jsBasico/2-var.js          | 19 +++++++++
 jsBasico/3-function.js     | 45 +++++++++++++++++++++
 jsBasico/4-scope.js        | 75 ++++++++++++++++++++++++++++++++++
 jsBasico/5-hoisting.js     | 38 ++++++++++++++++++
 jsBasico/6-coercion.js     | 46 +++++++++++++++++++++
 jsBasico/7-truthy-falsy.js | 28 +++++++++++++
 jsBasico/8-conditionals.js | 82 ++++++++++++++++++++++++++++++++++++++
 jsBasico/9-operadores.js   | 46 +++++++++++++++++++++
 15 files changed, 620 insertions(+)
 create mode 100644 jsBasico/1-valores.js
 create mode 100644 jsBasico/1.1-types.js
 create mode 100644 jsBasico/10-switch.js
 create mode 100644 jsBasico/11-loops.js
 create mode 100644 jsBasico/12-arrays.js
 create mode 100644 jsBasico/13-arr-methods.js
 create mode 100644 jsBasico/14-objects.js
 create mode 100644 jsBasico/2-var.js
 create mode 100644 jsBasico/3-function.js
 create mode 100644 jsBasico/4-scope.js
 create mode 100644 jsBasico/5-hoisting.js
 create mode 100644 jsBasico/6-coercion.js
 create mode 100644 jsBasico/7-truthy-falsy.js
 create mode 100644 jsBasico/8-conditionals.js
 create mode 100644 jsBasico/9-operadores.js

diff --git a/jsBasico/1-valores.js b/jsBasico/1-valores.js
new file mode 100644
index 0000000..83fae47
--- /dev/null
+++ b/jsBasico/1-valores.js
@@ -0,0 +1,24 @@
+// Tipos primitivos
+
+40   // Numeros 
+3.14
+
+ "Manuel Duarte"  // Strings (cadenas de texto), Esto es la forma en la que puedo crear algo que se pueda imprimir en la pantalla, o escribir información, que el usuario pueda entender y leer. utilizar palabras, o frases.
+
+ 'Manuel Duarte'
+
+ true   // Booleanos, estos fueron inventados por George Boole, un Matemático británico. y esto hace referencia a cosas que podamos validar.
+ false
+
+ null   // Valores vacios (Empty values), es como un placeholder (espacio reservado para algun valor) de algún valor faltante.
+ 
+ undefined
+
+
+ /* ================================================================ */ 
+ 
+ // Tipos de objetos o no primitivos
+
+ [1, 2, 3, 4] // corchetes // arrays
+ { nombre: 'Manuel' }  // llaves // objetos
+
diff --git a/jsBasico/1.1-types.js b/jsBasico/1.1-types.js
new file mode 100644
index 0000000..eca9270
--- /dev/null
+++ b/jsBasico/1.1-types.js
@@ -0,0 +1,20 @@
+Number 
+Boolean
+String
+undefined
+null
+Object
+Symbol
+
+// typeof es un tipo de operador unitario "Unary operator" que trabaja con 1 operando (variable)
+
+var nombre; 
+
+typeof 30 
+typeof true
+typeof "Manuel" 
+typeof nombre 
+typeof null
+typeof {}
+typeof []
+
diff --git a/jsBasico/10-switch.js b/jsBasico/10-switch.js
new file mode 100644
index 0000000..a400050
--- /dev/null
+++ b/jsBasico/10-switch.js
@@ -0,0 +1,22 @@
+// Switch es una forma diferente de validar, está depende del caso que sea verdad. 
+
+var numero = 1; 
+var resultado; 
+
+/* Switch compara con un === por esa razón los elementos tiene que ser idénticos */ 
+
+switch (numero) {
+    case 1: 
+        resultado = "Sí es uno";
+        break;
+    case 10: 
+        resultado = "Sí es diez";
+        break;
+    case 100:
+        resultado = "Sí es cien";
+        break;
+    default:   
+        resultado = "No match"; 
+}
+
+console.log(resultado); 
\ No newline at end of file
diff --git a/jsBasico/11-loops.js b/jsBasico/11-loops.js
new file mode 100644
index 0000000..13b2aa4
--- /dev/null
+++ b/jsBasico/11-loops.js
@@ -0,0 +1,22 @@
+// Los loops (bucles), son manera rápida y sencilla de hacer algo (una tarea) repetidamente.
+
+var estudiantes = [ 'Maria', 'Sergio', 'Rosa', 'Daniel' ]; 
+
+function saludarEstudiante(estudiante) {
+    console.log(`Hola, ${estudiante}`);
+}
+
+for (var i = 0; i < estudiantes.length; i++) {
+    saludarEstudiante(estudiantes[i]);
+}
+
+for (var estudiante of estudiantes) {
+    saludarEstudiante(estudiante);
+}
+
+while (estudiantes.length > 0) {   // Aquí la tarea se hará siempre y cuando sea true, cuando llegué a false, dejará de hacer la tarea
+    var estudiante = estudiantes.shift();  // shift() es un método que saca un elemento del array de la posición 0 a la última, Pop() comienza de la última a la primera.
+    saludarEstudiante(estudiante);
+}
+
+
diff --git a/jsBasico/12-arrays.js b/jsBasico/12-arrays.js
new file mode 100644
index 0000000..de46d5e
--- /dev/null
+++ b/jsBasico/12-arrays.js
@@ -0,0 +1,42 @@
+// Un array es una estructura de datos, es un objeto tipo lista de alto nivel.
+
+// Los arrays son objetos de tipo lista cuyo prototipo tiene métodos para realizar operaciones de recorrido y mutación
+
+var frutas = []; // Array Literal Syntax 
+
+var frutas = ["Manzana", "Platano", "Cereza", "Fresa"]; 
+console.log(frutas); 
+console.log(frutas.length); // length es una propiedad del array
+
+// Acceder (por índice) a un elemento del Array
+console.log(frutas[0]);   // Los arrays iician en "0" 
+
+
+// === Metodos para mutar arrays ===
+
+
+// .push();
+
+ var masFrutas = frutas.push("Uvas"); // Esté metodo añadirá "Uvas" añ final del array
+ console.log(frutas);
+
+// .pop();
+
+ var utlimo = frutas.pop("Uvas"); // Eliminará "Uvas" del final 
+ console.log(frutas);
+
+// unshift()
+
+var nuevaLogitud = frutas.unshift("Uvas"); // Añade "Uvas" al inicio 
+console.log(frutas);
+
+// shift()
+
+var borrarFruta = frutas.shift("Manzana"); // Elimina "Manzana" del inico
+console.log(frutas);
+
+// .indexOf();
+
+var posicion = frutas.indexOf("Platano"); // te dará la posición de ese item en el array
+console.log(frutas);
+
diff --git a/jsBasico/13-arr-methods.js b/jsBasico/13-arr-methods.js
new file mode 100644
index 0000000..476ee77
--- /dev/null
+++ b/jsBasico/13-arr-methods.js
@@ -0,0 +1,82 @@
+var articulos = [
+    { nombre: 'Bici', costo: 3000 },
+    { nombre: 'TV', costo: 2500 },
+    { nombre: 'Libro', costo: 320 },
+    { nombre: 'Celular', costo: 10000 },
+    { nombre: 'laptop', costo: 20000 },
+    { nombre: 'teclado', costo: 500 },
+    { nombre: 'audifonos', costo: 1700 }
+]
+
+
+// Metodos para recorrer arrays 
+
+
+//   Metodo Filter  
+/* Válida si es un true o false para poder meterlos al nuevo array, y éste método no modifica el array original */
+
+var articulosFiltrados = articulos.filter(function(articulo){
+    return articulo.costo <= 500  /* Menor o igual a 100 */ 
+});
+
+console.log(articulosFiltrados);
+
+ //   Metodo Map 
+
+var nombreArticulos = articulos.map(function(articulo){
+    return articulo.nombre  
+});
+
+console.log(nombreArticulos);
+
+ //   Metodo Find
+ /* De igual forma, con este método se valida un true o false para encontrar un elemento y si está lo regresa y si no, no pasa nada */
+
+var encuentraArticulos = articulos.find(function(articulo){
+    return articulo.nombre === 'laptop';
+});
+
+console.log(encuentraArticulos);
+
+//   Metodo forEach
+
+articulos.forEach(function(articulo){
+    console.log(articulo.nombre);
+});
+
+//   Metodo Some
+/* Este método nos regresa un false o un true para validar si hay o no artículos que cumplan la validación */
+
+var articulosBaratos = articulos.some(function(articulo){
+    return articulo.costo <= 700;
+});
+
+console.log(articulosBaratos); 
+
+//   Metodo Every
+
+/* Este método checa que todos los elementos en el array cumplan con la validación que ponemos, y al final nos regresa un true o un false */
+
+var articulosBaratos = articulos.every(function(articulo){
+    return articulo.costo <= 700;
+});
+
+console.log(articulosBaratos); 
+
+//   Metodo Reduce
+/* Este método corre una función en cada elemento del array, para comenzar a sumar los costos de cada elemento. */
+
+var costoTotal = articulos.reduce(function(totalActual, articulo){
+    return articulo.costo + totalActual;
+}, 0); // El 0 será la cantidad inicial con la que comenzará el totalActual
+
+console.log(costoTotal); 
+
+//   Metodo Includes
+
+var numeros = [1, 2, 3, 4, 5, 6];
+
+var incluyeNumero = numeros.includes(2); 
+
+console.log(incluyeNumero);
+
diff --git a/jsBasico/14-objects.js b/jsBasico/14-objects.js
new file mode 100644
index 0000000..878f16c
--- /dev/null
+++ b/jsBasico/14-objects.js
@@ -0,0 +1,29 @@
+// Un objeto es una colección de propiedades, y una propiedad es una asociación de key (nombre, o clave) y valores.
+
+var objecto = {}; // Object Literal Syntax 
+
+var miAuto = {
+    marca: "Toyota",  // key - value 
+    modelo: "Corolla",
+    annio: 2020,
+    detallesDelAuto: function() {   // Metodo de un objeto (una función dentro de un objeto)
+      return `Auto ${this.modelo} ${this.annio}`;
+  }
+};
+
+miAuto.annio 
+miAuto.modelo 
+
+miAuto.detallesDelAuto(); 
+
+
+// Función constructora 
+
+function auto(marca, modelo, annio) {  // Creas una función con los parametros que va a recibir, 
+    this.marca = marca;   // Utilizamos el "this" para asignar valores a las propiedades del objeto 
+    this.modelo = modelo;
+    this.annio = annio;
+}
+
+var newAuto = new auto("Tesla", "Model 3", 2020);
+
diff --git a/jsBasico/2-var.js b/jsBasico/2-var.js
new file mode 100644
index 0000000..2232181
--- /dev/null
+++ b/jsBasico/2-var.js
@@ -0,0 +1,19 @@
+/* Variable es un lugar en memoria
+Es una representación de algún lugar en la memoria para guardar datos
+ */
+
+var nombre = "Carlos"; // Nombre apuntará en algún lugar en la memoria (nosotros no sabemos donde, pero eso no es importante), pero dirá la señal de = tomará ese string y lo guardará en ese lugar.  y después si queremos utilizar ese valor, utilizaremos la variable Nombre para pedir que nos traigan ese string de memoria.
+
+// = es igual a operador de asignación 
+
+var edad; // Declarar
+edad = 30; // Inicializar 
+
+var elementos = ['Computadora', 'Celular']; // Aquí la variable seleccionará toda una sección para los elementos del array, y después tendremos acceso a toda la sección destinada en memoria.
+
+var persona = {   // de igual forma para el objeto
+    nombre: "Manuel",
+    edad: 30
+}
+
+console.log(elementos[2]); // consola es de igual forma una variable que le pertenece al navegador, con cierto espacio en memoria, y con un tipo de comportamiento especial. Donde Log es un método de la función
\ No newline at end of file
diff --git a/jsBasico/3-function.js b/jsBasico/3-function.js
new file mode 100644
index 0000000..ad275b4
--- /dev/null
+++ b/jsBasico/3-function.js
@@ -0,0 +1,45 @@
+// Las funciones son procedimientos, un conjunto de sentencias o pasos que realizarán una tarea o cálculo con ciertos valores.
+
+// Tenemos dos tipo de funciones en js, function Declaration y function Expression 
+
+// el nombre reservado de function y parametros que recibira esa function 
+
+function miFuncion() { // function declaration Declarativas expresión 
+    return 3; 
+}
+
+miFuncion(); // mandamos llamar la funcion
+
+var miFuncion = function(a,b) {  // function Expression (también conocidas como funciones anónimas)
+    return a + b;
+}
+
+miFuncion(); // mandamos llamar la variable como funcion
+
+
+/* ============================= */
+
+
+function saludarEstudiante(estudiante) {
+    console.log(`Hola ${estudiante}`);  // template strings (Plantillas de cadena de texto)
+}
+
+
+function suma(a,b) {  // está funcion recibe 2 parámetros, que se convierten en un placeholder de valores que se pueden utilizar dentro de la función.
+    var resultado = a + b; 
+}
+
+// Return, cómo regresamos un valor con una function. 
+
+
+
+function suma(a,b) {
+    var resultado =  a + b; 
+    return resultado;
+}
+
+function suma(a,b) {
+    return a + b; 
+}
+
+suma(20, 30); 
\ No newline at end of file
diff --git a/jsBasico/4-scope.js b/jsBasico/4-scope.js
new file mode 100644
index 0000000..7aaa1b9
--- /dev/null
+++ b/jsBasico/4-scope.js
@@ -0,0 +1,75 @@
+/*  Ejemplo del universo, un sistema solar, y un planeta.  */ 
+
+
+// Scope es igual a, donde buscar por cosas (estás cosas son las variables), el Scope es el alcance que tienen las variables, depende de donde las declaremos y las mandamos llamar si tendremos acceso a ellas o no.
+
+// Tenemos dos tipos de Scope, Scope Global y Scope Local.
+
+// ===============
+
+// Ejemplo de lo que es un Scope Global
+
+var miNombre = "Diego"; 
+
+function nombre() {
+    miNombre = "Alonso";
+    return miNombre;
+}
+
+nombre();
+
+console.log(miNombre);
+
+// Ejemplo de lo que es un Scope Local, el Scope local pasa al momento de crear una funcion, esto genera un ámbito diferente al global, al cual no se podrá tener acceso desde el ámbito global 
+
+var miNombre = "Diego"
+
+function nombre() {
+    var miApellido = "Duarte"; 
+    return miNombre + " " + miApellido 
+}
+
+nombre();
+
+console.log(miNombre);
+console.log(miApellido);
+
+//  Ejemplos de como puede ayuar o crear error el tema del scope. 
+
+// Ejemplo 1, cómo con una funcion podemos vambiar el valor de la variable global
+var miNombre = "Diego"
+
+function nombre(usuario) {
+    miNombre = usuario;
+    console.log(miNombre); 
+}
+
+nombre("Oscar");
+
+console.log(`Hola ${miNombre}, cómo estás?`);
+
+
+// Ejemplo 2, cómo podemos evitar reescribir el valor de una variable gracias al scope,
+var miNombre = "Diego"
+
+function nombre(usuario) {
+    var miNombre = usuario;
+    console.log(miNombre); 
+}
+
+nombre("Oscar");
+
+console.log(`Hola ${miNombre}, cómo estás?`);
+
+// Ejemplo 3, cómo si creamos un scope local, y mandamos llamar la variable fuera de la funcion, nos puede crear un problema. 
+
+function nombre(usuario) {
+    var miNombre = usuario;
+    console.log(miNombre); 
+}
+
+nombre("Oscar");
+
+console.log(`Hola ${miNombre}, cómo estás?`);
+
+
diff --git a/jsBasico/5-hoisting.js b/jsBasico/5-hoisting.js
new file mode 100644
index 0000000..4af9056
--- /dev/null
+++ b/jsBasico/5-hoisting.js
@@ -0,0 +1,38 @@
+// Hoisting es cuando las declaraciones de variables y funciones se procesan antes de ejecutar cualquier código, al momento de qe se genere el hosting, las funciones se declarán primero, y despues las variables.
+
+
+// Qué resultado esperas que nos aparezca si corremos este ejemplo? "undefined"
+console.log(miNombre);
+
+var miNombre = "Manuel";
+
+// Lo que sucede con el hoisting
+
+var miNombre = undefined;
+
+console.log(miNombre + "soy hoisting");
+
+miNombre = "Manuel";
+
+
+// ===  Hoisting con funcionts  ===
+
+hey();
+
+function hey() {
+    console.log('Hola ' + miNombre);
+};
+
+var miNombre = 'Manuel';
+
+// Lo que sucede con hoisting 
+
+function hey() {  //La función se declara hasta arriba, y después se declaran las variables.
+    console.log('Hola ' + miNombre);
+};
+
+var miNombre;
+
+hey();
+
+miNombre = 'Manuel';
\ No newline at end of file
diff --git a/jsBasico/6-coercion.js b/jsBasico/6-coercion.js
new file mode 100644
index 0000000..982cdf2
--- /dev/null
+++ b/jsBasico/6-coercion.js
@@ -0,0 +1,46 @@
+// La forma de convertir un type a otro: Coercion 
+
+// === Implicit Coercion === 
+
+var a = 20;
+
+var b = a + ""; 
+
+// más ejemplos
+
+var a = [1,2];
+var b = [3,4]; 
+
+a + b // En este ejemplo, por la concatenación, ambos arrays son obligados a convertirse en strings, y luego se juntan.
+
+// === Explicit coercion ===
+
+var c = String( a );
+
+var d = Number( c );
+
+// Otro ejemplo
+
+var a = 30; 
+var b = a.toString();
+
+var c = "100"; 
+var d = +c; // Unary operator '+' de forma explícita convierte a número
+
+// más ejemplos
+
+var num1 = "3.14"; 
+var num2 = 5 + +num1; 
+
+/*  
+
+Number + Number = Number
+Number + String = String
+String + Number = String
+String + String = String
+
+*/
+
+
+// Todos las propiedades de valor, son strings 
+
diff --git a/jsBasico/7-truthy-falsy.js b/jsBasico/7-truthy-falsy.js
new file mode 100644
index 0000000..e199b39
--- /dev/null
+++ b/jsBasico/7-truthy-falsy.js
@@ -0,0 +1,28 @@
+// Truthy y Falsy 
+
+// Son valores que son verdaderos o falsos 
+
+// Falsy (False)
+
+"" // un string vacío 
+0 -0
+null
+NaN
+false
+undefined
+
+//Truthy (true)
+
+"hola"
+30
+{a:1}
+[1,3]
+true
+function a(){}
+más 
+
+// Para que podemos utilizar esto, para generar condiciones segun el valor que demos. 
+
+if(InputEvent.value) {
+    ...
+}
diff --git a/jsBasico/8-conditionals.js b/jsBasico/8-conditionals.js
new file mode 100644
index 0000000..ab0b8ac
--- /dev/null
+++ b/jsBasico/8-conditionals.js
@@ -0,0 +1,82 @@
+// Esto nos ayudará para poder hacer decisiones.
+
+var esUsuario = true; 
+
+if(esUsuario) {  // con el if validamos que la condición sea true
+    console.log('Tiene acceso al contenido'); 
+}
+
+// Presentamos el else 
+
+var esUsuario = false; 
+
+if(esUsuario) {
+    console.log('Tiene acceso al contenido'); 
+} else {
+    console.log('Tienes que crear una cuenta para poder acceder al contenido');
+}
+
+// Ejemplo de cómo haríamos una validación
+
+var edad = 18; 
+var accion; 
+
+if(edad >= 18) {
+    accion = 'Puede votar'
+} else { // call back 
+    accion = 'No puede votar'
+}
+
+console.log(accion);
+
+// Ejemplo de cómo utilizaremos el else if
+
+var edad = 18; 
+var accion;  
+
+if(edad === 18) {
+    accion = 'Puede votar, será su 1ra votación'
+} else if(edad > 18) { 
+    accion = 'Puede votar'
+} else { // call back 
+    accion = 'Aun no puede votar'
+}
+
+console.log(accion);
+
+
+
+/* ================================================================ */ 
+
+// Operador ternario 
+
+var numero = 1; 
+var resultado; 
+
+if(numero === 1) {
+    resultado = 'Sí son un 1'; 
+} else {
+    resultado = 'No soy un 1'; 
+}
+
+condition ? true : false; 
+
+var numero = 1; 
+var resultado = numero === 1 ? 'Sí son un 1' : 'No soy un 1';
+
+console.log(resultado);
+
+
+// ==============================
+
+
+// Ejercicio, reaizar un piedra, papel o tijeras, utilizando condicionales, una funcion que reciba el parametro con el que vamos a jugar, y me regrese si gane o perdí. 
+
+/*  
+
+Variables piedra, papel y tiejeras 
+una funcion que utilice cindicionales para validar si el parametro que le estoy pasando gana o pierde. 
+
+y que la funcion al final me regrese el resultado de si gané, o  perdí. 
+
+*/ 
\ No newline at end of file
diff --git a/jsBasico/9-operadores.js b/jsBasico/9-operadores.js
new file mode 100644
index 0000000..1da4651
--- /dev/null
+++ b/jsBasico/9-operadores.js
@@ -0,0 +1,46 @@
+
+// Binary operators, y esto es porque significa que están 2 operandos involucrado 
+
+// de operación 
+
+3 + 2
+50 - 10
+10 * 3
+20 / 2
+
+'Diego ' + 'De Granda'
+
+// Unary operator, aquí es porque hay solo 1 operando involucrado 
+
+// Lógicos 
+
+!false // operador not (no)
+
+// Asignación 
+
+var a = 1; 
+
+// comparación 
+
+3 == '3' // es igual
+
+3 === '3' // es estrictamente igual 
+
+5 < 3, 5 <= 3, 5 > 3, 5 >= 3 // menor, menor o igual, mayo, mayor o igual 
+
+a && b // operador and (y), este operador genera una valicación siempe y cuando ambas variables sean verdad, "var 1 y var 2"
+
+true || false // operador or (o), este operador genera una validacion siempre y cuando cuaquier de as variables sea verdad, "var 1 o var 2"
+
+
+/* ================================================================ */ 
+
+// Operador que solo se pueden utilizar con variables 
+
+var edad = 40;
+
+edad++;  // operador de incremento por 1
+edad += 2; 
+
+edad;
+