Scribd
Cargar
29 vistas60 páginas

Unidad04 javascriptPPT-primeraParte 1

Este documento presenta una introducción al lenguaje de programación JavaScript. Explica que es un lenguaje interpretado, multiplataforma, orientado a objetos y basado en prototipos. Menciona que fue creado por Brendan Eich en 1995 y estándarizado por ECMA. Resalta algunas características de la sintaxis como la tipificación dinámica y la falta de punto y coma. Finalmente, describe conceptos básicos como variables, operadores, condicionales, bucles y funciones.

Cargado por

Patricia Sandoval
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
29 vistas60 páginas

Unidad04 javascriptPPT-primeraParte 1

Este documento presenta una introducción al lenguaje de programación JavaScript. Explica que es un lenguaje interpretado, multiplataforma, orientado a objetos y basado en prototipos. Menciona que fue creado por Brendan Eich en 1995 y estándarizado por ECMA. Resalta algunas características de la sintaxis como la tipificación dinámica y la falta de punto y coma. Finalmente, describe conceptos básicos como variables, operadores, condicionales, bucles y funciones.

Cargado por

Patricia Sandoval
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
Está en la página 1/ 60

Javascript

Programación Web I / Móvil I

Comisión Miércoles Noche Comisión Viernes Mañana


Alicia Rosenthal Ing. Gabriel Panik
Ing. Damián Spizziri Dis. Alicia Rosenthal
JAVASCRIPT

• Lenguaje Interpretado
• Multiplataforma
• Debilmente Tipado y Dinámico
• Orientado a Objetos y Eventos
• Imperativo
• Basado en prototipos
JAVASCRIPT
• Creado por Brendan Eich,
programador de Netscape v2.0
en 1995. ->Livescript ->javascript

• Microsoft lanzó
Jscript para Internet
Explorer 3.0
ECMAScript
ECMA
European Computer Manufacturers Association
https://www.w3schools.com/js/js_versions.asp

Estandarizar de un lenguaje de script multiplataforma e


independiente de cualquier empresa
ECMAScript
Librerías JAVASCRIPT
Frameworks JAVASCRIPT

REACT JS VUE JS ANGULAR JS


Frameworks JAVASCRIPT
Frameworks JAVASCRIPT
INCLUIR JS en HTML

<head>
<meta charset="UTF-8">
<script>
alert ("Primer Script");
</script>
</head>
INCLUIR JS en Archivo Externo
1. Crear un archivo con la extensión .js dentro
de una carpeta llamada js
2. Vincular el código javascript a nuestro html

<head>
<meta charset="UTF-8">
<script src="js/codigo.js">
</script>
</head>
MOSTRAR DATOS
• //popup
alert ("");

• //en el documento HTML


document.write ("");

• //en la consola
console.log("");
SINTAXIS JAVASCRIPT
• No se tienen en cuenta los espacios en
blanco y las nuevas líneas
• Se distinguen las mayúsculas y minúsculas
• No se define el tipo de las variables
• No es necesario terminar cada sentencia
con el carácter de punto y coma
• Se pueden incluir comentarios
• Una sola línea //
• Varias líneas (entre /* y */)
Variables

• Almacenar un dato
• Se crean con la palabra reservada var

//declaración
var nombre;
o let nombre;

//inicialización
nombre ="Pablo";
Variables

El nombre de una variable:

• NO puede empezar con un número


• NO puede usar carácteres especiales, ni
espacios en blanco
• Se puede utilizar el signo $ y el guión
bajo (_)
• Distingue Mayúsculas de Minúsculas
Variables
Convención para los nombres de Variables:
camelCase
Primera palabra toda en minúscula, primera letra
de cada palabra siguiente Mayúsculas

Por ejemplo:
var nombreApellido;
var numeroDocumento;
Tipos de Datos Primitivos
TIPO Valores

Number Numéricos incluidos números


negativos y decimales
String Cadenas de Texto. Comillas simples o
dobles.
Boolean Valores posibles true o false
Null Nulos o vacíos
Undefined Sin definir, cuando una variable no fue
inicializada.
Symbol Nuevo tipo en JavaScript introducido
en la versión ECMAScript Edition 6
PEDIR DATOS

Palabra reservada prompt

prompt("Mensaje al usuario");

var nombre;

nombre = prompt("Ingrese su nombre");


Constantes

• Almacenar un dato NO Variable


• Se crean con la palabra reservada const

//declaración
const PI = 3.14;
Constantes
Convención para los nombres de
Constantes:
UPPERCASE
Toda la palabra en MAYÚSCULA

Por ejemplo:
const PI;
const IVA;
Operadores de Asignación
•=
• +=, -=, *=, /=

Ejemplos:
numeroUno = 8;
numeroDos = 3;
numeroUno += 3;
Operadores Aritméticos

• +
• -
• *
• /
• %
• ++ (Incremento)
• -- (decremento)
Operadores Lógicos
• Negación (!)
• AND (&&)
• OR (||)
Operadores Lógicos

Ejemplos:
a = 8;
b = 3;
c = 3;
document.write( (a == b) && (c > b) );
document.write( (a == b) && (b == c) );
document.write( (a == b) || (b == c) );
document.write( (b <= c) );
document.write( !(b <= c) );
Operadores Relacionales
•>, >= Mayor, mayor o igual
•<, <= Menor, menor o igual
•== Igual
•!= Distinto
Operadores Relacionales

var numero1 = 3;
var numero2 = 5;
resultado = numero1 > numero2;
resultado = numero1 < numero2;
numero1 = 5; numero2 = 5;
resultado = numero1 >= numero2;
resultado = numero1 <= numero2;
resultado = numero1 == numero2;
resultado = numero1 != numero2;
numero1 = 5; numero2 = 4;
resultado = numero1 == numero2 ;
resultado = numero1 === numero2;
PARSEAR DATOS
• isNaN(variable);
//devuelve true si no lo es

• parseInt(variable);
//convierte en número entero

• parseFloat(variable);
//convierte en número flotante

• String(variable);
//convierte en cadena de texto
CONDICIONALES IF

if(condicion){
//instrucciones a ejecutar
si se cumple la condición
}
CONDICIONALES ELSE
if(condicion){

} else{
//instrucciones a ejecutar
si NO se cumple la condición
anterior
}
CONDICIONALES ELSE if
if(condicion){

} else if(condicion){
//instrucciones a ejecutar
si NO se cumple la condición
anterior y SI esta
}
CONDICIONALES SWITCH
1
2
switch(nomVariable) {
3 case "opcion1" :
4
5 instrucciones;
6 break;
7
8 case "opcion2" :
9
1
instrucciones;
0 break;
1
1 ......................
1 case "opcionN" :
2
1 instrucciones;
3
1
break;
4 default :
instrucciones;
}
CONDICIONALES SWITCH
switch(numero) {
case 5:
...
break;
case 8:
...
break;
case 20:
...
break;
default:
...
break;
}
CONDICIONALES SWITCH
switch(numero) {
case 5:
...
break;
case 8:
...
break;
case 20:
...
break;
default:
...
break;
}
BUCLE FOR

for(var i=0;i<=valor;i++){
//instrucciones a repetir
}
BUCLE WHILE
while(condicion a
evaluar){
// bloque a ejecutar
mientras la condición
sea verdadera
}
CONDICIONALES ELSE if
do{

} while(condicion)
SINTAXIS

Declaración de una función:

function nombreFuncion( ){
//instrucciones
}
SINTAXIS

Llamado a esa función:

nombreFuncion();
Ejemplo
function sumar(){
var num1 = 5;
var num2 = 8;
var suma = num1 + num2;
document.write("Total: "+suma);
}
sumar();
FUNCIONES CON PARAMETROS
function nombreFunc(parametros...){

nombreFuncion(parametro1, prametro2);
FUNCIONES CON PARAMETROS
function sumar(num1,num2){
var suma = num1 + num2;
document.write("Total: "+suma);
}
sumar(3,6);
FUNCIONES VALOR RETORNO
function nombreFuncion(){
return variable;
}
FUNCIONES VALOR RETORNO
function sumar(num1,num2){
var suma = num1 + num2;
return suma;
}
document.write(sumar(4,5));
FUNCIONES útiles Números

toFixed();
Devuelve el número original con tantos decimales como
los indicados por el parámetro digitos y realiza los
redondeos necesarios.

var numero1 = 4564.34567;


numero1.toFixed(2); // 4564.35
numero1.toFixed(6); // 4564.345670

numero1.toFixed(); // 4564
FUNCIONES útiles Números

isNaN();
Permite proteger a la aplicación de posibles valores
numéricos no definidos

isNaN(numero1);// devuelve true si no


es un número.
FUNCIONES útiles Cadenas

length
Calcula la longitud de una cadena de texto (el número de
caracteres que la forman)

var mensaje = "Hola Mundo";

var numeroLetras = mensaje.length;


FUNCIONES útiles Cadenas

+ o concat
(Se emplean para concatenar varias cadenas de texto)

var mensaje1 = "Hola";


var mensaje2 = " Mundo";

var mensaje = mensaje1 + mensaje2;

var mensaje3 = mensaje1.concat(mensaje2);


FUNCIONES útiles Cadenas
toUpperCase()
Transforma el texto en mayúscula

var mensaje1 = "Hola";


var mensaje2 = mensaje1.toUpperCase();

toLowerCase()
Transforma el texto en minúscula
var mensaje1 = "Hola";
var mensaje2 = mensaje1.toLowerCase();
FUNCIONES útiles Cadenas
charAt()
Obtiene el caracter que en la posición indicada

var mensaje = "Hola";


var letra = mensaje.charAt(0); // letra = H
letra = mensaje.charAt(2); // letra = l

substring(inicio, final)
Toma una porción del texto
var mensaje = "Hola Mundo";
var porcion = mensaje.substring(2) //"la Mundo"
porcion = mensaje.substring(1, 8); //"ola Mun"
FUNCIONES útiles Cadenas
indexOf(caracter)
(Calcula la posición en la que se encuentra el carácter
indicado dentro de la cadena de texto. Si el carácter se
incluye varias veces dentro de la cadena de texto, se
devuelve su primera posición empezando a buscar desde
la izquierda. Si la cadena no contiene el carácter, la
función devuelve el valor -1)

var mensaje = "Hola Carola";


var posicion = mensaje.indexOf('a');
//posicion =3
posicion = mensaje.indexOf('b'); // posicion=-1
FUNCIONES útiles Cadenas
lastIndexOf(caracter)
(calcula la última posición en la que se encuentra el
carácter indicado dentro de la cadena de texto. Si la
cadena no contiene el carácter, la función devuelve el
valor -1. La posición devuelta se calcula empezando a
contar desde el principio de la palabra)

var mensaje = "Hola Carola";


var posicion = mensaje.lastIndexOf('a');
//posicion =10
posicion = mensaje.lastIndexOf('b'); //
posicion=-1
Arrays

let variable1 = new Array();

let variable1 = new Array(10);

let variable1 = new Array(2, "hola",

true, 45.34);
Arrays

let variable1 = new Array();

variable1[0] = 2;

variable1[1] = "hola";

variable1[2] = true;

variable1[3] = 45.34;
Arrays

let dias = ["Lunes", "Martes", "Miércoles",

"Jueves", "Viernes", "Sábado", "Domingo"];

for(var i=0; i<7; i++) {

alert(dias[i]);

}
Arrays

let dias = ["Lunes", "Martes", "Miércoles",

"Jueves", "Viernes", "Sábado", "Domingo"];

for(i in dias) {

alert(dias[i]);

}
Arrays

let dias = ["Lunes", "Martes", "Miércoles",

"Jueves", "Viernes", "Sábado", "Domingo"];

dias.forEach((item)=>{

alert(item);

});
Funciones útiles para arrays
Funciones útiles para arrays
Funciones útiles para arrays
Juego piedra, papel y tijera
Cree un archivo html con un javascript
asociado. El cual le deberá pedir al usuario
que ingrese las palabras piedra, papel o tijera.
Cree un array con estos 3 valores. El
programa deberá elegir aleatoriamente un
valor del array y compararlo con lo ingresado
por el usuario

También podría gustarte