jsBasico

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
+

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 []
+

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); 

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);
+}
+
+

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);
+

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);
+

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);
+

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

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); 

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?`);
+
+