Scribd
Cargar
6K vistas

LECTURA JavaScript

Este documento explica los conceptos básicos de JavaScript. JavaScript es un lenguaje de programación multiplataforma orientado a objetos que se utiliza principalmente para hacer que las páginas web sean interactivas. El código JavaScript se puede incluir en documentos HTML de varias formas y contiene variables, arrays, objetos y otros elementos. JavaScript también se puede usar en el lado del servidor, por ejemplo con Node.js, para agregar más funcionalidad a un sitio web.

Cargado por

Kenneth Cervantes
Derechos de autor
© © All Rights Reserved
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
6K vistas

LECTURA JavaScript

Este documento explica los conceptos básicos de JavaScript. JavaScript es un lenguaje de programación multiplataforma orientado a objetos que se utiliza principalmente para hacer que las páginas web sean interactivas. El código JavaScript se puede incluir en documentos HTML de varias formas y contiene variables, arrays, objetos y otros elementos. JavaScript también se puede usar en el lado del servidor, por ejemplo con Node.js, para agregar más funcionalidad a un sitio web.

Cargado por

Kenneth Cervantes
Derechos de autor
© © All Rights Reserved
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
Está en la página 1/ 11

Conocimientos básicos de JavaScript

¿Qué es JavaScript? JavaScript es un lenguaje de programación multiplataforma orientado a objetos que se


utiliza para hacer que las páginas web sean interactivas (p. ej., Que tienen animaciones complejas, botones
en los que se puede hacer clic, menús emergentes, etc.).
También hay versiones de JavaScript de lado del servidor más avanzadas, como Node.js, que te permiten
agregar más funcionalidad a un sitio web que simplemente descargar archivos (como la colaboración en
tiempo real entre varias computadoras). Dentro de un entorno (por ejemplo, un navegador web), JavaScript se
puede conectar a los objetos de su entorno para proporcionar control programático sobre ellos.
JavaScript contiene una biblioteca estándar de objetos, como Array, Date y Math, y un conjunto básico de
elementos del lenguaje como operadores, estructuras de control y declaraciones.
El núcleo de JavaScript se puede extender para una variedad de propósitos completándolo con objetos
adicionales; por ejemplo:
• JavaScript de lado del cliente extiende el núcleo del lenguaje al proporcionar objetos para controlar un
navegador y su Modelo de objetos de documento (DOM por Document Object Model). Por ejemplo, las
extensiones de lado del cliente permiten que una aplicación coloque elementos en un formulario HTML y
responda a eventos del usuario, como clics del mouse, formularios para ingreso de datos y navegación de
páginas.

• JavaScript de lado del servidor amplía el núcleo del lenguaje al proporcionar objetos relevantes para
ejecutar JavaScript en un servidor. Por ejemplo, las extensiones de lado del servidor permiten que una
aplicación se comunique con una base de datos, brinde continuidad de información de una invocación a otra
de la aplicación o realice manipulación de archivos en un servidor.

Esto significa que, en el navegador, JavaScript puede cambiar la apariencia de la página web (DOM). Y, del
mismo modo, el JavaScript de Node.js en el servidor puede responder a solicitudes personalizadas desde el
código escrito en el navegador.
Cómo incluir JavaScript.
El código JavaScript se encierra entre etiquetas <script> y se incluye en cualquier parte del documento.
Aunque es correcto incluir cualquier bloque de código en cualquier zona de la página.
Incluir JavaScript en el mismo documento
La primera opción para incluir código JavaScript es dentro de la cabecera del documento (dentro de la
etiqueta <head>):
Definir JavaScript en un archivo externo.
Las instrucciones JavaScript se pueden incluir en un archivo externo de tipo JavaScript que los documentos HTML
enlazan mediante la etiqueta <script>. Se pueden crear todos los archivos JavaScript que sean necesarios y cada
documento HTML puede enlazar tantos archivos JavaScript como necesite.

Los archivos de tipo JavaScript son documentos normales de texto con la extensión .js, que se pueden crear
con cualquier editor de texto.
Incluir JavaScript en los elementos HTML
Este método consiste en incluir trozos de código JavaScript dentro del código HTML de la página.

El inconveniente de este método es que ensucia innecesariamente el código HTML de la página y complica el
mantenimiento del código JavaScript.
Sintaxis.
La sintaxis de JavaScript es muy similar a la de otros lenguajes de programación como Java y C. Las normas
básicas que definen la sintaxis de JavaScript son las siguientes:
No se tienen en cuenta los espacios en blanco y las nuevas líneas, el intérprete de JavaScript ignora
cualquier espacio en blanco sobrante, por lo que el código se puede ordenar de forma adecuada para
entenderlo mejor (tabulando las líneas, añadiendo espacios, creando nuevas líneas, etc.)
 Se distinguen las mayúsculas y minúsculas 
No se define el tipo de las variables: al crear una variable, no es necesario indicar el tipo de dato que
almacenará. De esta forma, una misma variable puede almacenar diferentes tipos de datos durante la
ejecución del script.
No es necesario terminar cada sentencia con el carácter de punto y coma (;): en la mayoría de lenguajes
de programación, es obligatorio terminar cada sentencia con el caracter ; . Aunque JavaScript no obliga a
hacerlo, es conveniente seguir la tradición de terminar cada sentencia con el carácter del punto y coma (;).
Se pueden incluir comentarios: los comentarios se utilizan para añadir información en el código fuente del
programa. Aunque el contenido de los comentarios no se visualiza por pantalla, sí que se envía al navegador
del usuario junto con el resto del script, por lo que es necesario extremar las precauciones sobre la
información incluida en los comentarios.

Comentarios en JavaScript.
JavaScript define dos tipos de comentarios: los de una sola línea y los que ocupan varias líneas.
Los comentarios de una sola línea se definen añadiendo dos barras oblicuas (//) al principio de la línea.

Ejemplo de comentario de una sola línea:


// a continuación se muestra un mensaje
alert("mensaje de prueba");

Los comentarios multilínea se definen encerrando el texto del comentario entre los simbolos /*y*/.

Ejemplo de comentario de varias líneas:


/*
Los comentarios de varias líneas son muy útiles cuando se necesita incluir bastante información
en los comentarios */ alert("mensaje de prueba");
Variables
Las variables en JavaScript se pueden declarar de diferentes formas:
➢ Directamente.
num1 = 3;
num2 = 1;
res = num1 + num2;
Mediante la palabra reservada var.
var num1 = 3;
var num2 = 1;
var res = num1 + num2;

Mediante la palabra reservada let. 
let num1 = 3; 
let num2 = 1;
let res = num1 + num2;
Al definir variables con var se tiene algunas desventajas: 
La primera es el scope o ámbito. - Se crean de forma global a partir de donde se declaran. 
Redeclaración.- Si no estamos en modo estricto nos permite redeclarar las variables. 

Al definir variables con let se respeta el scope y no lo extiende a la función más cercana. Si la declaramos en
un if, sólo dentro del if será accesible. 
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.
Constantes
Para declarar una constante se utiliza la palabra reservada const, recordemos que una constante nunca
cambia su valor. 
const PI = 3.14159;

Tipos de variables
Todas las variables de JavaScript se crean de la misma forma (mediante la palabra reservada var o let), la
forma en la que se les asigna un valor depende del tipo de valor que se quiere almacenar (números, textos,
etc.)
Numéricas
Se utilizan para almacenar valores numéricos enteros. En este caso, el valor se asigna indicando
directamente el número entero o decimal.
var iva = 16; // variable tipo entero
var total = 234.65; // variable tipo decimal
Cadenas de texto
Se utilizan para almacenar caracteres, palabras y/o frases de texto. Para asignar el valor a la variable, se
encierra el valor entre comillas dobles o simples, para delimitar su comienzo y su final:
var mensaje = "Bienvenido a nuestro sitio web";
var nombreProducto = 'Producto Refresco’;
var letraSeleccionada = 'c';
En ocasiones, el texto que se almacena en las variables no es tan sencillo. Si por ejemplo el propio texto
contiene comillas simples o dobles, la estrategia que se sigue es la de encerrar el texto con las comillas
(simples o dobles) que no utilice el texto:
/* El contenido de texto1 tiene comillas simples, por lo que
se encierra con comillas dobles */
let texto1 = "Una frase con 'comillas simples' dentro";
/* El contenido de texto2 tiene comillas dobles, por lo que
se encierra con comillas simples */
let texto2 = 'Una frase con "comillas dobles" dentro';
No obstante, a veces las cadenas de texto contienen tanto comillas simples como dobles. Además, existen
otros caracteres que son difíciles de incluir en una variable de texto (tabulador, ENTER, etc.) Para resolver
estos problemas, JavaScript define un mecanismo para incluir de forma sencilla caracteres especiales y
problemáticos dentro de una cadena de texto.
El mecanismo consiste en sustituir el carácter problemático por una combinación simple de caracteres. A
continuación, se muestra la tabla de conversión que se debe utilizar:

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

Una nueva línea \n

Un tabulador \t

Una comilla simple \'

Una comilla doble \"

Una barra inclinada \\


De esta forma, el ejemplo anterior que contenía comillas simples y dobles dentro del texto se puede rehacer
de la siguiente forma:
var texto1 = 'Una frase con \'comillas simples\' dentro';
var texto2 = "Una frase con \"comillas dobles\" dentro";
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".
Array
Un arreglo es un conjunto de elementos de cualquier tipo de dato y se declara de la siguiente forma:
var especialidad = [“Programacion”,”Electronica”, ”Mecatronica”,”Electricidad”];

alert(especialidad[0]);
O también podemos declararlos de la siguiente forma:
var especialidad = new Array(“Programacion”, ”Electronica”, ”Mecatronica”,”Electricidad”);
alert(especialidad[0]);
Recordemos que los arreglos de Javascript no están tipeados. Es por ello que podemos inicializar un array
con diferentes tipos de datos: cadenas, enteros, booleanos,… En este caso podríamos tener la siguiente
inicialización de un array:
var miarray = new Array("Victor",34,true);
Object
Un objeto es una colección de propiedades, y una propiedad es una asociación entre un nombre (o clave) y un valor. Un
valor de una propiedad puede ser una función, en cuyo caso la propiedad es conocida.

var carro = { “marca” : ”Ford”,


“modelo” : ”Fiesta”,
“year” : 2019,
“color” : “Rojo”
}
Booleanos
Las variables de tipo boolean o booleano también se conocen con el nombre de variables de tipo lógico.
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.
Los únicos valores que pueden almacenar estas variables son true y false, por lo que no pueden utilizarse los
valores verdadero y falso. A continuación, se muestra un par de variables de tipo booleano:
var clienteRegistrado = false;
var ivaIncluido = true;

Undefined
Una variable a la que no se le ha asignado valor, o no se ha declarado en absoluto (no se declara, no existe)
son de tipo undefined. Un método o sentencia también devuelve undefined si la variable que se está
evaluando no tiene asignado un valor.
Null
El valor null es un literal de Javascript que representa intencionalmente un valor nulo o "vacío".
// carro existe, pero no tiene tipo ni valor:
var carro = null;
NaN
La propiedad global NaN es un valor que representa Not-A-Number.
var cadena = “hola”;
alert(cadena * 2);
Tipos de Operadores
JavaScript tiene los siguientes tipos de operadores.
➢ Operadores de asignación
➢ Operadores de comparación
➢ Operadores aritméticos
➢ Operadores bit a bit
➢ Operadores lógicos
➢ Operadores de cadena de caracteres
➢ Operador condicional (ternario)
➢ Operador coma
➢ Operadores unarios
➢ Operadores relacionales

Operadores de asignación
Un operador de asignación asigna un valor al operando de la izquierda en función del valor del operando de la
derecha. El operador básico de asignación es el de igual (=), que asigna el valor del operando de la derecha
al operando de la izquierda. Por ejemplo, x = y, está asignando el valor de y a x.
También existen operadores compuestos de asignación que son la forma abreviada de las operaciones de la
siguiente tabla:

Operadores de asignación Nombre Operador abreviado  Significado

Operadores de asignación x=y x=y

Asignación de adición x += y x=x+y

Asignación de sustracción x -= y x=x-y

Asignación de multiplicación  x *= y x=x*y

Asignación de división x /= y x=x/y

Asignación de resto x %= y x=x%y

Asignación de exponenciación  x **= y x = x ** y

Asignación de desplazamiento a la x <<= y x = x << y


izquierda
Asignación de desplazamiento a la x >>= y x = x >> y
derecha
Asignación de desplazamiento a la x >>>= y x = x >>> y
derecha sin signo
Asignación AND binaria x &= y x=x&y

Asignación XOR binaria x ^= y x=x^y

Asignación OR binaria x |= y x=x|y

Operadores de comparación
Un operador de comparación compara sus operandos y devuelve un valor lógico en función de si la
comparación es verdadera (true) o falsa (false). Los operadores pueden ser numéricos, de cadena de
caracteres (Strings), lógicos o de objetos. Las cadenas de caracteres son comparadas basándose en un
orden lexicográfico estándar, usando valores Unicode. En la mayoría de los casos, si los dos operandos no
son del mismo tipo, JavaScript intenta convertirlos en el tipo apropiado para permitir la comparación,
generalmente esta conversión se realiza de manera numérica. Las únicas excepciones que tiene esta
conversión son los operadores === y !== que ejecutan comparaciones de igualdad o desigualdad de manera
estricta (chequeando si ambos operandos son del mismo tipo). Estos operadores no intentan convertir los
operandos a un tipo compatible antes de comprobar su igualdad. La siguiente tabla describe los operadores
de comparación en base al siguiente código de ejemplo:

var var1 = 3;
var var2 = 4;
Operadores aritméticos
Los operadores aritméticos toman los valores numéricos (tanto literales como variables) de sus operandos y
devuelven un único resultado numérico. Los operadores aritméticos estándar son la suma (+), la resta (-), la
multiplicación (*) y la división (/). Estos operadores funcionan como en la mayoría de los lenguajes de
programación cuando son usados con números de coma flotante (en particular, tenga en cuenta que la
división por cero produce Infinity). Por ejemplo:
1 / 2; // 0.5
1 / 2 == 1.0 / 2.0; // es true
Además de las operaciones de aritmética estándar (+, -, * y /), JavaScript brinda los siguientes operadores
aritméticos descritos en la tabla:




Operadores lógicos
Los operadores lógicos son comúnmente utilizados con valores booleanos; estos operadores devuelven un
valor booleano. Sin embargo, los operadores && y || realmente devuelven el valor de uno de los operandos,
asi que si estos operadores son usados con valores no booleanos, podrían devolver un valor no booleano. En
la siguiente tabla se describen los operadores lógicos:


Operador condicional (ternario)
El operador condicional es el único operador de JavaScript que necesita tres operandos. El operador asigna
uno de dos valores basado en una condición. La sintaxis de este operador es:
condición ? valor1 : valor2
Si la condición es true, el operador tomará el valor1, de lo contrario tomará el valor2. Puedes usar el operador
condicional en cualquier lugar que use un operador estándar.
Por ejemplo,
var estado = (edad >= 18) ? "adulto" : "menor";
typeof
El operador typeof es usado de las siguientes maneras:
➢ typeof operando
➢ typeof (operando)

El operador typeof devuelve una cadena de caracteres indicando el tipo del operando evaluado. En los
ejemplos anteriores operando hace referencia a la cadena de caracteres, variable, palabra clave u objeto del
que se intenta obtener su tipo. Los paréntesis son opcionales.
Supongamos que definimos las siguientes variables:
var miFuncion = new Function("5 + 2");
var forma = "redonda";
var largo = 1;
var hoy = new Date();

El operador typeof devolverá los siguientes resultados en estas variables:


typeof miFuncion; // devuelve "function"
typeof forma; // devuelve "string"
typeof largo; // devuelve "number"
typeof hoy; // devuelve "object"
typeof noExiste; // devuelve "undefined"
Con las palabras clave true y null, el operador typeof devuelve los siguientes resultados:
typeof true; // devuelve "boolean"
typeof null; // devuelve "object"
Con los números o las cadenas de caracteres, el operador typeof devuelve los siguientes resultados:
typeof 62; // devuelve "number"
typeof 'Hello world'; // devuelve "string"
En el caso de que se utilice como operando una propiedad, el operador typeof devolverá el tipo de dicha
propiedad:
typeof document.lastModified; // devuelve "string"
typeof window.length; // devuelve "number"
typeof Math.LN2; // devuelve "number"
Precedencia de operadores
La precedencia de operadores determina el orden en que estos son aplicados cuando se evalúa una
expresión. Esta precedencia puede ser alterada usando paréntesis.
La siguiente tabla describe la precedencia de operadores, de mayor a menor importancia.

También podría gustarte