-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy path16_JavaScript.html
175 lines (131 loc) · 6.79 KB
/
16_JavaScript.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
<!-- Introducción a Javascript -->
<!-- ● ¿Qué es y para qué se usa?
● Conceptos generales. Sintaxis básica.
● Variable, ¿qué es y cómo declararla? Tipos.
● Asignación y cambio del valor.
● Operadores aritméticos.
● Conversión a entero y flotante. -->
<!-- ¿Qué es JavaScript?
JavaScript (JS) es un lenguaje de programación, un mecanismo con el que podemos
indicarle al navegador qué tareas debe realizar, en qué orden y cuántas veces, entre
otras. Con JS agregamos comportamiento a nuestro sitio, permitiendo al usuario
interactuar con él, rompiendo con la idea de una web estática.
Junto con HTML y CSS es la tercera pieza fundamental del desarrollo web.
ECMAScript es el estándar que a partir del año 2015 a la actualidad se encarga de regir
como debe ser interpretado y funcionar el lenguaje JavaScript. En la actualidad, JS
puede ser interpretado y procesado por una multitud de plataformas, entre las que se
encuentran los navegadores web.
Versiones de ECMAScript
Javascript ha sufrido modificaciones que los navegadores han debido
implementar para proporcionar soporte a cada versión de ECMAScript
cuanto antes.
Características de JavaScript
● Lenguaje del lado del cliente: El código se ejecuta en el cliente (navegador).
No se necesita acceso al servidor.
● Orientado a objetos: Utiliza clases y objetos como estructuras reutilizables.
● De tipado débil o no tipado: No es necesario especificar el tipo de dato
al declarar una variable.
● De alto nivel: Su sintaxis se encuentra alejada del nivel máquina,
más cercano a un lenguaje de las personas.
● Lenguaje interpretado: El navegador convierte las líneas de código en el
lenguaje de la máquina sin necesidad de realizar un proceso de
compilado.
● Muy utilizado por desarrolladores: Es uno de los lenguajes más
demandados de los últimos años por su versatilidad y su infinita
capacidad para crear plataformas cada vez más atractivas.
● Interactividad con el usuario: Podemos validar el formato de los datos
de un formulario (una dirección de email directamente desde el
navegador del cliente), ahorrando tiempo y recursos del servidor.
Comenzando con JavaScript
El código de nuestro script debe ser incorporado al código HTML, de forma
similar a lo que ocurre con las hojas de estilo CSS. Existen tres formas de
agregar código JavaScript a una página web. Una de ellas es utilizar la
etiqueta < script> en el < head> de nuestro documento (una referencia interna).
La ubicación de la etiqueta <script>
Según cómo esté ubicada la etiqueta <script> el navegador descarga
ejecuta el archivo JavaScript en momentos diferentes:
1. En <head>: antes de empezar a dibujar la página, cuando está en blanco.
2. En <body>: cuando la página se haya dibujado hasta el <script>.
3. Antes de </body>: cuando la página se haya dibujado en su totalidad.
La consola de JavaScript
Para acceder a la consola Javascript del navegador pulsamos CTRL+SHIFT+J.
Un clásico ejemplo utilizado cuando se comienza a programar es crear un
programa que muestre por pantalla un texto, generalmente el texto «Hola
Mundo». O mostrar el resultado de alguna operación matemática. A
continuación, el código JS para realizar ambas tareas:
console.log("Hola Mundo");
console.log(2 + 2);
Podemos mostrar texto, valores numéricos, etc. separados por comas:
console.log("¡Hola a todos! Observen este número: ", 5 + 18);
En esta consola podemos escribir funciones o sentencias de JavaScript que
se ejecutan en la página que se encuentra en la pestaña actual del
navegador. De esta forma podemos observar los resultados que nos
devuelve en la consola al realizar diferentes acciones.
JS posee, además de console.log, varias instrucciones similares para
interactuar con el desarrollador:
console.log():
console.warn();
console.error();
clear()
Incorporando un archivo externo
Podemos vincular al documento HTML un archivo con extensión .js usando
la etiqueta <script>, haciendo referencia al nombre del archivo JavaScript
con el atributo src (source):
<html>
<head>
<title>Título de la página</title>
<script src="index.js"></script>
</head>
<body>
<p>Ejemplo de texto.</p>
</body>
</html>
Los archivos .js se suelen incorporar en una carpeta llamada “js”.
Comentarios
Los comentarios son utilizados por los programadores para anotaciones.
No son tenidos en cuenta por el navegador. Son un buen recurso cuando queremos omitir
la ejecución de ciertas instrucciones.
//Comentarios en línea
/*
Comentarios
en bloque...
*/
Variables | ¿Qué son?
Es un pequeño espacio en la memoria, donde se guarda un dato. Podemos
imaginarlas como “cajitas” dentro de nuestro programa. Tienen tres
características:
● Nombre: debe ser representativo de la información que contiene. Se utiliza
para diferenciar unas de otras y hacer referencia a ellas.
● Tipo de dato: puede ser número, texto, valores booleanos, etc.
● Contenido: el valor concreto que posee el dato almacenado.
Se llaman variables porque pueden cambiar su valor a lo largo del programa.
Un programa puede tener muchas variables, y cada una de ellas tendrá un
nombre que la identifique, un valor y un tipo de dato.
Variables | ¿Cómo se declaran?
Una variable que se ha declarado con var pero a la que no se le asignó un
valor se dice que está indefinida (no conocemos el tipo de dato):
var num3;
En este caso la variable está “vacía”, no está definido el valor que colocará en
memoria. No se ha asociado ningún contenido a esa variable.
var num4 = 5;
Las sentencias en JS finalizan con “;”. Lo anterior corresponde a la
declaración de la variable “num4” con un valor numérico entero de “5”.
Variables | ¿Cómo se nombran?
Los nombres de las variables (o identificadores) permiten distinguir una de
otras. Para asignar los nombres de las variables debemos seguir ciertas
reglas:
Un identificador de JavaScript debe comenzar con una letra, un guión bajo (
_ ) o un signo de dólar ( $ ). Los siguientes caracteres también pueden ser
dígitos ( 0 - 9 ). JavaScript distingue entre mayúsculas y minúsculas (es
case-sensitive).
Se recomienda usar la escritura camelCase en el nombre de variables que
tienen más de una palabra.
Podemos cambiar el valor de una variable durante el flujo del programa:
var IVA= 21;
IVA= 10.5;
console.log(IVA);
El = es el operador de asignación, y permite asignar un valor a una variable.
Ese valor puede ser el resultado de una operación aritmética, que se evalúa y
luego se asigna su resultado a la variable: var resultado= (1 + 3) * 2;
Luego de ejecutar esa línea, la variable “resultado” contiene el valor “8”.
-->