Review concepts to keep knowledge fresh: JavaScript

What is the correct way to declare a new variable that you can change? 
>> 
let = myName
Let variable can be changed after they are created

What is the outcome of this statement? 
>> 
3 is printed to the console
What are variables used for in JavaScript? 
>> 
For storing or holding data

What is the outcome of the following code snippet?
console.log('Hello world'); 
>>> 
Hello world is printed to the console

What is the correct way to call the random method on the Math global object?
>> 
Math.random()

What is string interpolation?
>> 
Using template literals to embed variables into strings.

Which of the following code snippets would cause an error?
>> 
const food = 'chicken';
food = 'sushi';

What will the following code print to the console? 
>>
let num = 10;
num *= 3;
console.log(num); 
*= will multiply the num by 3 and then reassign the value of num to that result.

Which of the following is an example of a single line comment?
>>  
// creates a single line comment

What is the correct way to call a string’s built-in method?
>>
'here'.toUpperCase(); is a built-in method.

What is string concatenation? 

>>
String concatenation is the process of joining strings together.
 

Console.log(`My name is ${myName}. I am ${myAgeInDogYears} years old in dog years.`);

//Create a variable named myAge, and set it equal to your age as a number.

const myAge =  20;

//Create a variable named earlyYears and save the value 2 to it. Note, the value saved to this variable will change.

let earlyYears = 2;

earlyYears *= 10.5;

// Since we already accounted for the first two years, take the myAge variable, and subtract 2 from it.Set the result equal to a variable called laterYears. We’ll be changing this value later. 

let laterYears = myAge - 2;

// Multiply the laterYears variable by 4 to calculate the number of dog years accounted for by your later years. Use the multiplication assignment operator to multiply and assign in one step.

laterYears *= 4;

console.log(earlyYears);

console.log(laterYears);

let myAgeInDogYears =  earlyYears + laterYears;

console.log(myAgeInDogYears);

//Write your name as a string, call its built-in method .toLowerCase(), and store the result in a variable called myName.

let myName = "Micamilo".toLowerCase();

console.log(`My name is ${myName}. I am ${myAgeInDogYears} years old in dog years.`); 

Review Variables

 

1. Variables hold reusable data in a program and associate it with a name.
2. Variables are stored in memory.
3. The var keyword is used in pre-ES6 versions of JS.
4. let is the preferred way to declare a variable when it can be reassigned, and const is the preferred way to declare a variable with a constant value.
5. Variables that have not been initialized store the primitive data type undefined.
6. Mathematical assignment operators make it easy to calculate a new value and assign it to the same variable.
7. The + operator is used to concatenate strings including string values held in variables.
8. In ES6, template literals use backticks ` and ${} to interpolate values into a string.
9. The typeof keyword returns the data type (as a string) of a value.

Mathematical Assignment Operators

 let w = 4;

w = w + 1;

console.log(w); // Output: 5

let x = 20;

x -= 5; // Can be written as x = x - 5

console.log(x); // Output: 15

 

let y = 50;

y *= 2; // Can be written as y = y * 2

console.log(y); // Output: 100

 

let z = 8;

z /= 2; // Can be written as z = z / 2

console.log(z); // Output: 4

let levelUp = 10;

let powerLevel = 9001;

let multiplyMe = 32;

let quarterMe = 1152;

// Use the mathematical assignments in the space below

// These console.log() statements below will help you check the values of the variables.

// You do not need to edit these statements. 

console.log('The value of levelUp:', levelUp); 

console.log('The value of powerLevel:', powerLevel); 

console.log('The value of multiplyMe:', multiplyMe); 

console.log('The value of quarterMe:', quarterMe);

levelUp+=5;

powerLevel-=100;

multiplyMe*=11;

quarterMe/=4;

Just like the previous mathematical assignment operators (+=, -=, *=, /=), the variable’s value is updated and assigned as the new value of that variable. 

let gainedDollar = 3;

let lostDollar = 50;

gainedDollar++;

lostDollar--;

let myName = 'Natalia';

let myCity = 'Mexico City';

console.log(`My name is ${myName}. My favorite city is ${myCity}.`)

JAVASCRIPT Built-in Objects: Prints

 

When we use console.log() we’re calling the .log() method on the console object. 

Let’s see console.log() and some real string methods in action!

• Data is printed, or logged, to the console, a panel that displays messages, with console.log().
• 
  
• We can write single-line comments with // and multi-line comments between /* and */.
• 
  
• There are 7 fundamental data types in JavaScript: strings, numbers, booleans, null, undefined, symbol, and object.
• 
  
• Numbers are any number without quotes: 23.8879
• 

• Strings are characters wrapped in single or double quotes: 'Sample String'
• 

• The built-in arithmetic operators include +, -, *, /, and %.
• 
  
• Objects, including instances of data types, can have properties, stored information. The properties are denoted with a . after the name of the object, for example: 'Hello'.length.
• 
  
• Objects, including instances of data types, can have methods which perform actions. Methods are called by appending the object or instance with a period, the method name, and parentheses. For example: 'hello'.toUpperCase().
• 
  
• We can access properties and methods by using the ., dot operator.
• 
  
• Built-in objects, including Math, are collections of methods and properties that JavaScript provides.
• 
  

//random number prints

console.log(Math.random() *100);

// * 100

console.log(Math.floor(Math.random() *100));

//ceil number, smaller than 43.8

console.log(Math.ceil(43.8));

// Integer number, false or true

console.log(Number.isInteger(2017));

In JavaScript, there are seven fundamental data types

 

• Number:  Any number, including numbers with decimals: 4, 8, 1516, 23.42.
• String: Any grouping of characters on your keyboard (letters, numbers, spaces, symbols, etc.) surrounded by single quotes: ' ... ' or double quotes " ... ", though we prefer single quotes. Some people like to think of string as a fancy word for text.
• Boolean: This data type only has two possible values— either true or false (without quotes). It’s helpful to think of booleans as on and off switches or as the answers to a “yes” or “no” question.
• Null: This data type represents the intentional absence of a value, and is represented by the keyword null (without quotes).
• Undefined: This data type is denoted by the keyword undefined (without quotes). It also represents the absence of a value though it has a different use than null. undefined means that a given value does not exist.
• Symbol: A newer feature to the language, symbols are unique identifiers, useful in more complex coding. No need to worry about these for now.
• Object: Collections of related data.
• 
  

Preparación para la prueba de acceso - Javascript

 

• Como definir una función o una variable (Link 1 / Link 2)
• Como crear condiciones a la ejecución de tu código (Link 1 / Link 2)
• Acceder a distintos tipos de datos (Link 1 / Link 2)
• Repetir con bucles (Link 1 / Link 2 

Introducción a JavaScript

Capítulo 3. Programación básica

Las variables en JavaScript se crean mediante la palabra reservada var

La palabra reservada var solamente se debe indicar al definir por primera vez la variable, lo que se denomina declarar una variable. 

El nombre de una variable también se conoce como identificador y debe cumplir las siguientes normas:

• Sólo puede estar formado por letras, números y los símbolos $ (dólar) y _ (guión bajo).
• El primer carácter no puede ser un número.

Correcto:

var $numero1;

var _$letra;

var $$$otroNumero;

Incorrecto:

var 1numero;       // Empieza por un número

var numero;1_123;  // Contiene un carácter ";"

Numéricas

var iva = 16;        // variable tipo entero

var total = 234.65;  // variable tipo decimal

Booleanos

Una variable de tipo boolean almacena un tipo especial de valor que solamente puede tomar dos valores: true (verdadero) o false (falso). No se puede utilizar para almacenar números y tampoco permite guardar cadenas de texto.

var clienteRegistrado = false;

var ivaIncluido = true;

Arrays

var nombre_array = [valor1, valor2, ..., valorN];

var dias = ["Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado", "Domingo"];

Cadenas de texto

var mensaje = "Bienvenido a nuestro sitio web";

var nombreProducto = 'Producto ABC';

var letraSeleccionada = 'c';

/* El contenido de texto1 tiene comillas simples, por lo que

    se encierra con comillas dobles */

var texto1 = "Una frase con 'comillas simples' dentro";

/* El contenido de texto2 tiene comillas dobles, por lo que

    se encierra con comillas simples */

var texto2 = 'Una frase con "comillas dobles" dentro';

Si se quiere incluir... Se debe incluir...

Este mecanismo de JavaScript se denomina "mecanismo de escape" de los caracteres 

problemáticos, y es habitual referirse a que los caracteres han sido "escapados".

Una nueva línea \n

Un tabulador \t

Una comilla simple \'

Una comilla doble \"

Una barra inclinada \\

Asignación

var texto1 = 'Una frase con \'comillas simples\' dentro';

var texto2 = "Una frase con \"comillas dobles\" dentro";

/* Error, la asignación siempre se realiza a una variable,

    por lo que en la izquierda no se puede indicar un número */

5 = numero1;

// Ahora, la variable numero1 vale 5

numero1 = 5;

// Ahora, la variable numero1 vale 4

numero1 = numero2;

Incremento y decremento

var numero = 5;

++numero;

alert(numero);  // numero = 6

var numero = 5;

--numero;

alert(numero);  // numero = 4

var numero1 = 5;

var numero2 = 2;

numero3 = numero1++ + numero2;

// numero3 = 7, numero1 = 6

var numero1 = 5;

var numero2 = 2;

numero3 = ++numero1 + numero2;

// numero3 = 8, numero1 = 6

Por tanto, en la instrucción numero3 = numero1++ + numero2;, el valor de numero1 se incrementa después de realizar la operación (primero se suma y numero3 vale 7, después se incrementa el valor de numero1 y vale 6). Sin embargo, en la instrucción numero3 = ++numero1 + numero2;, en primer lugar se incrementa el valor de numero1 y después se realiza la suma (primero se incrementa numero1 y vale 6, después se realiza la suma y numero3 vale 8).

Lógicos 

El resultado de cualquier operación que utilice operadores lógicos siempre es un valor lógico o booleano

Negación

La negación lógica se obtiene prefijando el símbolo ! al identificador de la variable.

var visible = true;

alert(!visible);  // Muestra "false" y no "true"

variable	!variable
true	false
false	true

• Si la variable contiene un número, se transforma en false si vale 0 y en true para cualquier otro número (positivo o negativo, decimal o entero).
• Si la variable contiene una cadena de texto, se transforma en false si la cadena es vacía ("") y en true en cualquier otro caso.

var cantidad = 0;

vacio = !cantidad;  // vacio = true

cantidad = 2;

vacio = !cantidad;  // vacio = false

var mensaje = "";

mensajeVacio = !mensaje;  // mensajeVacio = true

mensaje = "Bienvenido";

mensajeVacio = !mensaje;  // mensajeVacio = false

AND

variable1	variable2	variable1 && variable2
true	true	true
true	false	false
false	true	false
false	false	false

var valor1 = true;

var valor2 = false;

resultado = valor1 && valor2; // resultado = false

valor1 = true;

valor2 = true;

resultado = valor1 && valor2; // resultado = true

Matemáticos

var numero1 = 10;

var numero2 = 5;

resultado = numero1 / numero2;  // resultado = 2

resultado = 3 + numero1;        // resultado = 13

resultado = numero2 – 4;        // resultado = 1

resultado = numero1 * numero 2; // resultado = 50

Se trata del operador "módulo", que calcula el resto de la división entera de dos números. Si se divide por ejemplo 10 y 5, la división es exacta y da un resultado de 2. El resto de esa división es 0, por lo que módulo de 10 y 5 es igual a 0.

JavaScript se indica mediante el símbolo %

var numero1 = 10;

var numero2 = 5;

resultado = numero1 % numero2; // resultado = 0

numero1 = 9;

numero2 = 5;

resultado = numero1 % numero2; // resultado = 4

Los operadores matemáticos también se pueden combinar con el operador de asignación para abreviar su notación:

var numero1 = 5;

numero1 += 3;  // numero1 = numero1 + 3 = 8

numero1 -= 1;  // numero1 = numero1 - 1 = 4

numero1 *= 2;   // numero1 = numero1 * 2 = 10

numero1 /= 5;   // numero1 = numero1 / 5 = 1

numero1 %= 4;   // numero1 = numero1 % 4 = 1

Relacionales

Los operadores relacionales definidos por JavaScript son idénticos a los que definen las matemáticas: mayor que (>), menor que (<), mayor o igual (>=), menor o igual (<=), igual que (==) y distinto de (!=).

var numero1 = 3;

var numero2 = 5;

resultado = numero1 > numero2; // resultado = false

resultado = numero1 < numero2; // resultado = true

numero1 = 5;

numero2 = 5;

resultado = numero1 >= numero2; // resultado = true

resultado = numero1 <= numero2; // resultado = true

resultado = numero1 == numero2; // resultado = true

resultado = numero1 != numero2; // resultado = false

var texto1 = "hola";

var texto2 = "hola";

var texto3 = "adios";

resultado = texto1 == texto3; // resultado = false

resultado = texto1 != texto2; // resultado = false

(a es menor que b, b es menor que c, A es menor que a, etc.)

resultado = texto3 >= texto2; // resultado = false

// El operador "=" asigna valores

var numero1 = 5;

resultado = numero1 = 3;  // numero1 = 3 y resultado = 3

// El operador "==" compara variables

var numero1 = 5;

resultado = numero1 == 3; // numero1 = 5 y resultado = false

var valores = [true, 5, false, "hola", "adios", 2];

Determinar cual de los dos elementos de texto es mayor

var resultados = valores [3] > valores [4];

alert(resultado);

Utilizando exclusivamente los dos valores booleanos del array, 

determinar los operadores necesarios para obtener un resultado true y 

otro resultado false

var valor1 = valores[0]; true

var valor2 = valores [2]; false

var resultado = valor1 || valor2;

alert( resultado)

true

var resultado = valor1 && valor2;

alert(resultado)

false 

Determinar el resultado de las cinco operaciones 

matemáticas realizadas con los dos elementos numéricos

var num1 = valores[1];

var num2 = valores[5];

var suma = num1 + num2;

alert(suma);

var resta =  num1-num2;

alert(resta);

var multiplicacion = num1*num2;

alert(multiplicacion);

var division = num1/numb2;

alert(division);

var modulo= num1 % num2;

alert(modulo);

Estructura if

"si se cumple esta condición, hazlo; si no se cumple, haz esto otro."

if(condicion) {

  ...

}

Si la condición se cumple (es decir, si su valor es true) se ejecutan todas las instrucciones que se encuentran dentro de {...}. 

var mostrarMensaje = true;

if(mostrarMensaje) {

  alert("Hola Mundo");

}

En este caso, la condición es una comparación entre el valor de la variable mostrarMensaje y el valor true. El mensaje sí que se muestra al usuario ya que la variable mostrarMensaje tiene un valor de true




var mostrarMensaje = true; // Se comparan los dos valores if(mostrarMensaje == false) { ... } // Error - Se asigna el valor "false" a la variable if(mostrarMensaje = false) { ... }

Estructura if...else

"si se cumple esta condición, hazlo; si no se cumple, haz esto otro".

Si la condición se cumple (es decir, si su valor es true) se ejecutan todas las instrucciones que se encuentran dentro del if(). Si la condición no se cumple (es decir, si su valor es false) se ejecutan todas las instrucciones contenidas en else { }. 

if(condicion) {

  ...

}

else {

  ...

}

var edad = 18;

if(edad >= 18) {

  alert("Eres mayor de edad");

}

else {

  alert("Todavía eres menor de edad");

}

var nombre = "";

if(nombre == "") {

  alert("Aún no nos has dicho tu nombre");

}

else {

  alert("Hemos guardado tu nombre");

}

https://drive.google.com/file/d/1wbPC_5ywNgvzO7AIWfxi1SumUR507d8t/view?usp=sharing

https://drive.google.com/file/d/1TS-vcFMeerrMNIz9Mqc9icc6sCbif2JH/view?usp=sharing

VARIABLES Y OPERADORES:

https://drive.google.com/file/d/1OIxiGFRZTrcaQyGx339oleHCSFIAWPd7/view?usp=sharing

CONDICIONES IF EJERCICIO:

https://drive.google.com/file/d/1t3XamqCMw1adCUpbXTBVUqSwhtpcySJO/view?usp=sharing