▷ Resumen - El cinturón blanco del programador

Sección 2

operadores aritméticos (para realizar operaciones):

+ (suma)

- (resta)

* (multiplicación)

/ (división)

% (módulo)

operadores de comparación:

!= (negación)

> (mayor que)

< (menor que)

>= (mayor o igual que)

<= (menor o igual que)


/* este es
    el resumen visto en esta sección de capítulos
*/
let user = "lector" 
let bookSection = 2 // camelCase (juntar "book" y "section")
let ready = false
let curious = false
let happy = true

console.log("Perfecto, " + user + " ¿estás preparado para avanzar?")
if (ready || curious) { // condición: preparado o curioso
    bookSection++ // Suma 1. Otra forma: bookSection +=1
    if ((ready && curious) || happy) {
        console.log("Estás preparado y curioso o estás feliz")
    }
} else if (happy) { // de lo contrario, en el caso de que estés feliz
    console.log("Aún no estás listo. Pero estás feliz :D")
} else { // de lo contrario...
    console.log("Aún no") // mostramos mensaje
}
curious = !curious
console.log("Ahora ha cambiado tu estado de curiosidad")
console.log(bookSection) // mostramos mensaje

Sección 3

Bucle while:


let num = 2
let multiplier = 0
let product = num * multiplier

while(multiplier < 9) {
    console.log(num + " x " + multiplier + " = " + product)
    multiplier++
    product = num * multiplier
}

Mientras se cumpla la condición…

while(multiplier < 9) {

Se ejecutará el contenido dentro del while.

Bucle do while:


let num = 1

do {
    console.log("estoy dentro del bucle")
    num++;
}
while(num < 1)

Es como el while, pero siempre se ejecuta una primera vez.

Bucle for:


for (let num = 0; num <= 10; num++) { 
    console.log(num)
}

En el bucle for, primero se declara y asigna una variable:

let num = 0

Después la condición que, mientras se cumpla, ejecutará el contenido del bucle:

num <= 10

Por último, la acción que sucederá cuando finalice la itera-ción del bucle. En el caso del ejemplo, sumará 1 a num:

num++

Cada uno de estos pasos del for son separados por punto y coma ( ; ).

for (let num = 0; num <= 10; num++) {

Sección 4

Existen diferentes tipos de funciones. Algunas funciones ya están predefinidas en JavaScript, como console.log().

Las funciones son como los órganos del cuerpo, cada una debe de desempeñar una única función. O al menos, así es como estas deberían de funcionar.

Cuando algo se repite mucho en el código, se debería de extraer esa funcionalidad a una función. No solo es bueno para organizar el código, sino que también es imprescindible si queremos probar el código y evitar grandes dolores de cabeza.

Función con parámetros:

function generateBirthdayMessage(name, years, customMsg) {
    console.log("Hoy " + name + " cumple " + years + " años.")
    console.log(customMsg)
}
generateBirthdayMessage("Manolo", 10, "¡Felicidades Manolito!")
generateBirthdayMessage("Gregoria", 18, "¡Ya eres mayor de edad!")

Función con retorno:

function isEven(num) {
    return (num % 2 == 0)
}

Sección 5

Arrays:

let ejemplo = [10, 20, 30, 40]

ejemplo[0] ➡️ (esto sería 10).
ejemplo[1] ➡️ (esto sería 20).
ejemplo[2] ➡️ (esto sería 30).
ejemplo[3] ➡️ ( esto sería 40).

const usernames = ["Manolo", "Gabriela", "Toni”]
for (let i of usernames) { 
	console.log(i) 
}

Arrays de más de una dimensión:

const users = 
    [
        [
            ["Manolo", "Rodríguez"],
            32
        ],
        [
            ["Gabriela", "Hernández"],
            43
        ],
        [
            ["Toni", "López"],
            18
        ]
    ]
console.log(users[0][0])

Utilizando arrays como listas:

fruits.push("Manzana") ➡️ agrega al final de la lista.
fruits.unshift("Naranja") ➡️ agrega al inicio de la lista.
fruits.pop() ➡️ elimina el último elemento de la lista.
fruits.shift() ➡️ elimina el primer elemento de la lista.
fruits.splice(2, 6) ➡️ elimina los elementos del 2 al 7.
fruits.includes("manzana") ➡️ devuelve "true" o "false" (dependiendo si está o no incluido).
fruits.indexOf("naranja") ➡️ devuelve el índice.
let copia = array.slice("manzana", "pera") ➡️ copia parte de una lista en la variable “copia”.
let fruitsFull = fruitsOne.concat(fruitsTwo) ➡️ junta la primera lista “fruitsOne” con la segunda “fruitsTwo”, formando una lista con los elementos de ambas listas en “fruitsFull”.

Objetos:


const users = 
[
    {username: "Manolo123", years: 25},
    {username: "Gregoria3", years: 32}
]
console.log(users[1].username)

Objetos con arrays:


const books = 
[
  {title: "La mansión de las pesadillas", category: "Suspense"},
  {title: "Abre la mente, piensa diferente", category: "Desarrollo personal"}
]
function addBook(title, category) {
    books.push({title, category})
}
function removeBook(index) {
    books.pop(index)
}
let lastBook = books[books.length - 1]
console.log(lastBook.title)
removeBook(lastBook)
lastBook = books[books.length - 1]
console.log(lastBook.title)
addBook("¿El asesino sigue aquí?", "suspense")
lastBook = books[books.length - 1]
console.log(lastBook.title)

Sección 6

Programación Orientada a Objetos:

La Programación Orientada a Objetos nos permite que el código sea reutilizable, organizado y fácil de mantener.

Características:

Abstracción: Simplifica la complejidad mostrando solo los detalles esenciales de un objeto.
```
const first = new Library()
console.log(first.getLastBook().title)
```

Encapsulamiento: Agrupa datos y funciones dentro de objetos, ocultando detalles internos y exponiendo solo lo necesario.

class Car {
  #fuel = 100

  getFuel() {
    return this.#fuel
  }
}

const myCar = new Car()
console.log(myCar.getFuel())

Herencia: Permite que una clase derive de otra, reutilizando código y facilitando la extensión.

class Vehicle {
    turnOn() {
        console.log("Vehículo arrancado.")
    }
}

class Car extends Vehicle{
}

const myCar = new Car()
myCar.turnOn()

Polimorfismo: Objetos de diferentes clases pueden ser tratados como de una misma superclase, permi-tiendo flexibilidad en el código.

class Animal {
  makeSound() {console.log("Sonido genérico")}
}
class Dog extends Animal {
  makeSound() {console.log("Guau guau")}
}
class Cat extends Animal {
  makeSound() {console.log("Miau")}
}

const myDog = new Dog()
const myCat = new Cat()

myDog.makeSound()
myCat.makeSound()

Ejemplo completo:

class Food {
  #name
  constructor(name) {
    this.#name = name
  }
  getName() {
    return this.#name
  }
}

class Soup extends Food {
  constructor() {
    super('Soup')
  }
}

class Fruit extends Food {
  constructor() {
    super('Fruit');
  }
}

const soup = new Soup()
const fruit = new Fruit()

console.log(soup.getName())
console.log(fruit.getName())

Sección 7

Switch: Estructura de control que según su variable ejecuta una acción.

let num = 2

switch (num) {
  case 3:
    console.log("Bajas a la planta 3.")
  case 2:
    console.log("Bajas a la planta 2.")
  case 1:
    console.log("Bajas a la planta 1.")
  default:
    console.log("Estás en el portal.")
}

Map: Aplica una función a cada elemento de una lista y la retorna.

let numbers = [1, 2, 3]
let doubled = numbers.map(n => n * 2)
console.log(doubled)

Diccionario: Estructura de datos que almacena pares clave-valor.

let dictionary = {
  "manzana": "Una fruta",
  "coche": "Un vehículo"
}

console.log(dictionary["manzana"])
console.log(dictionary["coche"])

Sección 8

Ternarios: Son una forma mucho más breve de escribir nuestro código. Sirve para código sencillo.

condición ? código cuando es true : código cuando es false

Es lo mismo que…

if(condición) {
código cuando es true
} else {
	código cuando es false
}

RegEx: Expresión Regular. Es un patrón que sirve para detectar fragmentos de texto que cumplen ciertas reglas específicas. Por ejemplo, si analizamos un correo electróni-co, podríamos ver que todos los correos electrónicos com-parten algo en común. Tienen arroba @.

Podríamos crear una expresión regular que nos permita va-lidar si un correo electrónico tiene arroba. Y utilizar test pa-ra comprobar si un valor cumple con esa expresión regular.

const mailRegex = /^[\w.-]+@[a-zA-Z\d-]+\.[a-zA-Z]{2,}$/
const myMail = 'contact@madirex.com'
const isValid = mailRegex.test(myMail)

Manejo de errores: Nos permite gestionar correctamente los errores.

Podemos crear una excepción (error) en una función y lue-go controlarla utilizando try catch.

function divide(a, b) {
  if (b === 0) {
    throw new Error('No puedes dividir entre 0')
  }
  return a / b
}

try {
  divide(10, 0)
} catch (error) {
  console.log('Error:', error.message)
}

Sección 9

Refactorización:

Refactorizar es reorganizar o reescribir el código para que sea más claro, limpio y mantenible sin cambiar su funcionalidad.

Por ejemplo, una tarea de refactorización podría ser dividir funciones con muchas líneas de código en funciones más pequeñas.

Punto y coma:

El punto y coma sirve para decir al programa “aquí acaba la instrucción que te estoy dando”. ¿Por qué no es necesario en JavaScript? Porque el parser hace el trabajo de agregar esos punto y comas por ti. En principio, no pasa nada por hacer esto. Y es más cues-tión de gustos usar o no usar el punto y coma (en lenguajes donde es opcional). Pero también es importante que en-tiendas que puede haber ciertos errores poco comunes de-bido a no cerrar correctamente ciertas instrucciones.

Alcance (scope):

No es lo mismo crear una variable fuera de una función que dentro de ella:

let num = 0

function add() {
    num++
}

add()
console.log(num)

Habrá veces que sea necesario declararlas fuera y otras den-tro. Si ejecutamos el código de arriba, obtendremos como resultado 1. Pero, si agregamos el parámetro con el mismo nombre (num) a la función add…

let num = 0

function add(num) {
    num++
}

add()
console.log(num)

Retornará 0.

Tipos de datos:

string: cadena de caracteres. Ejemplo: "Manolo".
number: número. Ejemplo: 32.
boolean: valor verdadero/falso. Ejemplo: true.
undefined: valor no asignado.
null: valor nulo.
bigint: números muy grandes.

Secuencias de escape:

\n ➡️ Salto de línea.
\t ➡️ Tabulación (tab).
\\ ➡️ Barra invertida.
\" ➡️ Comillas dobles.
\' ➡️ Comillas simples.

Resumen - El cinturón blanco del programador

Sección 2

operadores aritméticos (para realizar operaciones):

operadores de comparación:

Sección 3

Sección 4

Sección 5

Sección 6

Sección 7

Sección 8

Sección 9

Buscar

Etiquetas

Niveles

Formulario de contacto

Footer Menu Widget

Madirex