1
00:00:00,690 --> 00:00:16,109
Bueno, lo que voy a hacer es intentar orientaros un poquito, que creo que con el vídeo y con una pequeña explicación, sobre la última parte de esta lección.

2
00:00:16,109 --> 00:00:34,649
Hasta ahora lo que habíamos conseguido era crear un sitio web estático en donde podíamos presentar información, pero el usuario no había interactuación.

3
00:00:34,649 --> 00:00:46,829
Es una información que la tenemos bien configurada, la tenemos bien organizada, la presentación es correcta, pero no hay interactuación.

4
00:00:47,009 --> 00:00:59,509
El usuario no es capaz de modificar la información que aparece ahí, no se puede modificar la información que aparece ahí, interactuando con esa información.

5
00:00:59,509 --> 00:01:04,049
¿por qué? porque es una página estática

6
00:01:04,049 --> 00:01:06,129
o sea, me estoy refiriendo a interactuación

7
00:01:06,129 --> 00:01:10,450
por ejemplo, si yo quiero

8
00:01:10,450 --> 00:01:15,650
esto sería un ejemplo de página dinámica

9
00:01:15,650 --> 00:01:20,430
yo aquí, por ejemplo, me cojo un color

10
00:01:20,430 --> 00:01:23,650
y veis que yo puedo, con el ratón

11
00:01:23,650 --> 00:01:26,269
trazar líneas de distinto color

12
00:01:26,269 --> 00:01:31,030
y esto pues me permitiría dibujar con el ratón

13
00:01:31,030 --> 00:01:32,930
yo puedo llegar a dibujar

14
00:01:32,930 --> 00:01:35,230
hay una interactuación clara

15
00:01:35,230 --> 00:01:38,569
entre la información que me aparece en la página web

16
00:01:38,569 --> 00:01:40,189
y el usuario

17
00:01:40,189 --> 00:01:42,870
¿cómo se ha conseguido eso?

18
00:01:43,170 --> 00:01:46,150
pues evidentemente es lógico pensar

19
00:01:46,150 --> 00:01:49,250
que para que exista esa interactuación

20
00:01:49,250 --> 00:01:53,250
tenemos que usar algún tipo de programa

21
00:01:53,250 --> 00:01:55,109
algún tipo de lenguaje

22
00:01:55,109 --> 00:01:57,290
de programación

23
00:01:57,290 --> 00:01:59,689
que hemos visto hasta ahora

24
00:01:59,689 --> 00:02:00,609
que la programación

25
00:02:00,609 --> 00:02:02,650
nos va a permitir eso

26
00:02:02,650 --> 00:02:05,870
a partir de una entrada

27
00:02:05,870 --> 00:02:07,409
dar una determinada salida

28
00:02:07,409 --> 00:02:10,169
el programa

29
00:02:10,169 --> 00:02:11,990
como lo veis está aquí

30
00:02:11,990 --> 00:02:15,349
este es el código

31
00:02:15,349 --> 00:02:17,569
de esta página web

32
00:02:17,569 --> 00:02:18,310
que no hemos visto

33
00:02:18,310 --> 00:02:20,050
este código es bastante complejo

34
00:02:20,050 --> 00:02:21,930
yo no os voy a pedir que hagáis

35
00:02:21,930 --> 00:02:23,590
un código tan complejo como este

36
00:02:23,590 --> 00:02:33,030
Pero sí nos permite un poco analizarlo, porque si os dais cuenta, este código tiene estructura de página web.

37
00:02:33,930 --> 00:02:47,050
Aquí hay un HTML que empieza, un HTML que termina, un encabezado que empieza y que termina.

38
00:02:47,050 --> 00:02:52,129
o sea que hay algo metido en ese encabezado, pero el encabezado termina aquí

39
00:02:52,129 --> 00:02:58,949
y luego hay un cuerpo donde también hay un cierto código que es el que tenemos ahí.

40
00:03:00,090 --> 00:03:04,789
Esta es una página que está escrita con un lenguaje de programación

41
00:03:04,789 --> 00:03:12,849
que es muy utilizado en las páginas web dinámicas que se conoce con el nombre de Javascript.

42
00:03:12,849 --> 00:03:16,930
Javascript es un lenguaje de programación

43
00:03:16,930 --> 00:03:23,189
que es un lenguaje de programación en contraposición a lo que hemos visto en C++

44
00:03:23,189 --> 00:03:26,629
es un lenguaje de programación orientado a objetos

45
00:03:26,629 --> 00:03:30,409
es decir, que nosotros vamos a programar objetos

46
00:03:30,409 --> 00:03:33,090
concretamente los objetos que tenemos ahí

47
00:03:33,090 --> 00:03:38,729
¿esto qué indica o qué supone?

48
00:03:38,729 --> 00:04:01,509
Pues supone que vamos a tener que programar o que aparecer tanto en el encabezado, en el encabezado es donde está el verdadero programa, entre estas etiquetas que se llaman scripts, igual que teníamos en las hojas de estilo style, en este caso tenemos las etiquetas scripts,

49
00:04:01,509 --> 00:04:25,970
Entre esas etiquetas script yo lo que voy es a meter un programa, un programa que está escrito en javascript y en la parte del cuerpo de la página lo que voy a tener es los objetos que ha programado ese programa.

50
00:04:25,970 --> 00:04:41,329
Entonces, la primera diferenciación es con respecto a los programas C++ que hemos utilizado y Python, es que en este caso necesitamos objetos que programar, ¿vale?

51
00:04:41,329 --> 00:04:44,329
aquí bueno pues

52
00:04:44,329 --> 00:04:45,889
ya os digo que este no

53
00:04:45,889 --> 00:04:48,610
este es un poco complicado porque este programa

54
00:04:48,610 --> 00:04:51,310
es un programa con gráficos

55
00:04:51,310 --> 00:04:52,290
y entonces pues tiene

56
00:04:52,290 --> 00:04:54,930
varias funciones

57
00:04:54,930 --> 00:04:56,610
realmente si alguien ha utilizado

58
00:04:56,610 --> 00:04:57,110
Scratch

59
00:04:57,110 --> 00:05:00,329
son un poco como las funciones

60
00:05:00,329 --> 00:05:02,350
de las flechas que aparecen en Scratch

61
00:05:02,350 --> 00:05:04,389
pero bueno

62
00:05:04,389 --> 00:05:07,050
es un programa

63
00:05:07,050 --> 00:05:08,470
digamos que puede

64
00:05:08,470 --> 00:05:10,490
decir que parece que tiene una cierta

65
00:05:10,490 --> 00:05:19,329
complejidad, un cierto grado de complejidad. ¿Qué vamos a hacer? Pues esencialmente Java tiene muchas

66
00:05:19,329 --> 00:05:28,889
cosas en común con C++ en cuanto a sintaxis y en cuanto a comandos. Por ejemplo, como en el C++

67
00:05:28,889 --> 00:05:37,629
los programas, aunque sean orientados a objetos, pues pueden ser secuenciales, pueden ser ramificados

68
00:05:37,629 --> 00:05:48,009
y pueden ser bucles y al igual que en C++ cuando tenemos un programa secuencial

69
00:05:48,009 --> 00:05:55,709
pues tenemos que identificar y definir las variables y ver los tipos de variables que son

70
00:05:55,709 --> 00:06:02,970
después tendremos que hacer las operaciones y dar los resultados.

71
00:06:02,970 --> 00:06:21,529
Si tenemos una ramificación, las ramificaciones necesitan la sentencia if con una condición, después una serie de acciones y en Java se sigue usando el if, condición y una serie de acciones.

72
00:06:21,529 --> 00:06:37,529
Y para crear bucles, pues existen varias formas, pero en C++, os recuerdo que usamos el FOR y que usamos el DO WHILE y en Javascript también tenemos esas sentencias.

73
00:06:38,730 --> 00:06:44,529
Entonces, esencialmente, programarse programa igual, ¿vale?

74
00:06:45,350 --> 00:06:50,449
La programación en Java es más o menos igual que la programación en C++.

75
00:06:50,449 --> 00:07:00,009
lo que nos va lo que va a variarse son como nosotros definimos los objetos vale veamos un

76
00:07:00,009 --> 00:07:10,370
ejemplo un ejemplo más sencillo que éste vale más asequible para vosotros vale pues imaginaos

77
00:07:11,990 --> 00:07:17,990
y ahora lo voy a subir imaginaos que tenemos nuestra nuestro sitio web que ya tenemos aquí

78
00:07:17,990 --> 00:07:25,629
entonces vamos al apartado de javascript y veis que aquí hay un programa ahí ya

79
00:07:25,629 --> 00:07:29,930
hay una interacción en un programa muy sencillo que lo que hace es si yo le

80
00:07:29,930 --> 00:07:39,980
meto dos números nos da el producto a pues no nos da pero es que no puesto

81
00:07:39,980 --> 00:07:46,220
ninguno puesto 34 vale si yo le meto dos números nos da el valor del producto de

82
00:07:46,220 --> 00:07:54,319
esos dos números vale claro esto es si todo bueno si os acordáis del c plus plus y de los

83
00:07:54,319 --> 00:08:00,660
elementos básicos de programación pues es un típico programa secuencial sin mayor sin mayores

84
00:08:00,660 --> 00:08:10,379
pretensiones es súper fácil entonces vamos a ver vamos a ver dicho programa y para ver dicho

85
00:08:10,379 --> 00:08:26,019
programa vamos a editarle aquí podéis encontrar en internet ya os digo es esencialmente tanto

86
00:08:26,019 --> 00:08:45,200
la sentencia vale que este no me lo puede abrir tengo que abrirlo con otro esencialmente tanto

87
00:08:45,200 --> 00:08:53,759
las sentencias como la gramática es la misma vale en este caso para definir la variable o

88
00:08:53,759 --> 00:08:58,419
o sea, para indicar que vamos a empezar un programa con una variable que es k,

89
00:08:58,840 --> 00:09:04,480
vamos a hacer una especie de función, entonces le ponemos el nombre que es multiplicando,

90
00:09:05,100 --> 00:09:10,320
tenemos dos variables n1 y n2, y el resultado es una función

91
00:09:10,320 --> 00:09:17,080
que lo que hace es multiplicar los números y dar el valor de esa variable.

92
00:09:18,320 --> 00:09:21,720
Entonces, para ver esta función que tenemos aquí,

93
00:09:21,720 --> 00:09:24,600
y esto es lo que quizás sí que sea diferente

94
00:09:24,600 --> 00:09:28,279
tenemos que hacer unas entradas

95
00:09:28,279 --> 00:09:30,820
veis que aquí tenemos las entradas

96
00:09:30,820 --> 00:09:33,840
las entradas de los valores

97
00:09:33,840 --> 00:09:35,899
entonces yo lo que hago es

98
00:09:35,899 --> 00:09:37,639
a través del documento

99
00:09:37,639 --> 00:09:39,919
crearme un formulario

100
00:09:39,919 --> 00:09:41,159
o sea

101
00:09:41,159 --> 00:09:44,679
que no necesariamente tiene que ser como formulario

102
00:09:44,679 --> 00:09:46,179
lo podéis hacer sin formulario

103
00:09:46,179 --> 00:09:48,220
pero crearnos un formulario

104
00:09:48,220 --> 00:09:50,679
si hubieseis visto un poquito de

105
00:09:50,679 --> 00:09:55,440
de bases de datos, de access, pues no os parecería normal

106
00:09:55,440 --> 00:09:59,379
porque en access lo que se programa, en Visual Basic

107
00:09:59,379 --> 00:10:02,820
se programa un poco muy parecido, es muy parecido a esto

108
00:10:02,820 --> 00:10:07,679
se hace un formulario y entonces esos apartaditos

109
00:10:07,679 --> 00:10:11,539
del formulario son los que, los valores de esos apartaditos

110
00:10:11,539 --> 00:10:14,559
del formulario son los que se utilizan para hacer este programa

111
00:10:14,559 --> 00:10:18,620
y en esencia es lo que hemos hecho aquí, la función lo que hace

112
00:10:18,620 --> 00:10:20,740
es simplemente obtener esos valores

113
00:10:20,740 --> 00:10:22,700
y dar el resultado, o sea, esta parte

114
00:10:22,700 --> 00:10:24,220
donde pone function

115
00:10:24,220 --> 00:10:26,779
realmente es para crear

116
00:10:26,779 --> 00:10:28,139
ese formulario

117
00:10:28,139 --> 00:10:31,120
como veis el programa, este sería el programa

118
00:10:31,120 --> 00:10:32,840
en Javascript, que está

119
00:10:32,840 --> 00:10:33,440
sacado

120
00:10:33,440 --> 00:10:36,759
y como lo hacemos

121
00:10:36,759 --> 00:10:39,139
como lo implementamos en una página web

122
00:10:39,139 --> 00:10:41,980
pues igual que hemos visto

123
00:10:41,980 --> 00:10:43,539
el otro, ¿no?

124
00:10:43,799 --> 00:10:46,779
¿cómo podemos implementar esto en una página web?

125
00:10:48,860 --> 00:10:49,139
bueno

126
00:10:49,139 --> 00:11:02,259
Pues fijaros, este no me gusta, voy a usar otro porque este vamos a hacerle aquí, vamos a ir paso por paso.

127
00:11:03,399 --> 00:11:11,720
En una página web habéis visto el programa que podríamos implementar en Java.

128
00:11:11,720 --> 00:11:29,419
Pues para incluirlo dentro de la página web se incluye en el encabezado y entre las etiquetas script y veis que este es el mismo, exactamente el mismo programa que os he enseñado antes, que es un programa de tipo Java.

129
00:11:29,419 --> 00:11:51,100
Lo incluimos ahí. Y para que se ejecute, tenemos que establecer dentro del cuerpo cómo va a ser, vamos, tenemos que definir en definitiva, tenemos que definir con estas variables que tenemos aquí, tenemos que definir el formulario.

130
00:11:51,100 --> 00:12:14,779
O sea, que es un poco como en Scratch, primero se definen los objetos, y en este caso, como tienen que ser visibles, se tienen que definir dentro del cuerpo, y esos objetos son los que después, en la etiqueta script, vamos a programar, ¿vale?

131
00:12:14,779 --> 00:12:17,919
ahora

132
00:12:17,919 --> 00:12:20,480
igual que ocurría con las hojas de estilo

133
00:12:20,480 --> 00:12:22,200
todo lo que está

134
00:12:22,200 --> 00:12:24,100
en la etiqueta script

135
00:12:24,100 --> 00:12:26,620
lo podemos hacer

136
00:12:26,620 --> 00:12:28,159
en un documento aparte

137
00:12:28,159 --> 00:12:30,200
y después hacer un link

138
00:12:30,200 --> 00:12:32,539
la ventaja

139
00:12:32,539 --> 00:12:34,600
pues igual que en el caso de las hojas de estilo

140
00:12:34,600 --> 00:12:36,259
cuando nosotros queremos definir

141
00:12:36,259 --> 00:12:37,179
muchos estilos

142
00:12:37,179 --> 00:12:40,539
pues el encabezado se puede hacer muy largo

143
00:12:40,539 --> 00:12:41,659
entonces

144
00:12:41,659 --> 00:12:43,059
este script

145
00:12:43,059 --> 00:12:44,899
este programa jave

146
00:12:44,899 --> 00:12:47,019
de java es un programa muy facilito

147
00:12:47,019 --> 00:12:49,340
muy sencillito, pero si por ejemplo

148
00:12:49,340 --> 00:12:51,159
metieses el otro, el del paint

149
00:12:51,159 --> 00:12:53,080
pues ese es un programa bastante

150
00:12:53,080 --> 00:12:55,200
más complejo y claro

151
00:12:55,200 --> 00:12:57,100
pues meterlo

152
00:12:57,100 --> 00:12:59,399
con código dentro del encabezado

153
00:12:59,399 --> 00:13:01,320
puede resultar

154
00:13:01,320 --> 00:13:02,960
mucho más tedioso, vale

155
00:13:02,960 --> 00:13:05,320
entonces en este caso lo que vamos

156
00:13:05,320 --> 00:13:06,840
a hacer es

157
00:13:06,840 --> 00:13:12,779
hacer un link

158
00:13:12,779 --> 00:13:14,379
hacer un link

159
00:13:14,379 --> 00:13:23,139
O sea, crear con todo lo que está en el Java, todo lo que tenemos aquí dentro de las etiquetas script,

160
00:13:23,620 --> 00:13:31,500
creamos un documento que tiene como formato JS, ¿vale?

161
00:13:32,039 --> 00:13:36,659
Que implica que es un documento en JavaScript, JavaScript, ese es de JS.

162
00:13:36,659 --> 00:14:04,460
Y luego lo que hacemos es, mediante una etiqueta de este tipo, la etiqueta script, en este caso lo que hacemos es un link, ves que aquí el src siempre se refiere a un link, lo linkamos a este documento.

163
00:14:04,460 --> 00:14:25,820
Y en el cuerpo tenemos que definir el formulario, ¿vale? O sea, aquí en el cuerpo, en la parte, en la celda de la tabla donde nosotros vamos a, queremos que se ejecute ese Javascript, hemos definido el formulario.

164
00:14:25,820 --> 00:14:54,340
De tal manera que si ahora yo abro mi sitio web y me voy a Javascript, pues me voy a encontrar que sigue teniendo mi tema, que conservo mi tema, que conservo el formato de mi tabla, pero que ahora yo puedo ejecutar el Javascript en esta hoja.

165
00:14:54,340 --> 00:15:04,480
la cuestión sería que tendríais que hacer vosotros un programa

166
00:15:04,480 --> 00:15:07,200
yo he escogido el multiplicando

167
00:15:07,200 --> 00:15:09,220
porque de todos los posibles programas

168
00:15:09,220 --> 00:15:11,320
es que si hacéis un sumar

169
00:15:11,320 --> 00:15:13,600
sumar es un poquito más complicado

170
00:15:13,600 --> 00:15:16,879
porque a la hora de captar el formulario

171
00:15:16,879 --> 00:15:19,159
le pasa lo mismo que en el Visual Basic

172
00:15:19,159 --> 00:15:20,200
a la hora de sumar

173
00:15:20,200 --> 00:15:23,440
él lo puede entender no como una suma

174
00:15:23,440 --> 00:15:27,139
Sino que une los dos dígitos

175
00:15:27,139 --> 00:15:28,919
Entonces hay que tener un poco de cuidado

176
00:15:28,919 --> 00:15:30,919
Multiplicar es más sencillo

177
00:15:30,919 --> 00:15:35,440
Me conformo con que me hagáis el programa de multiplicar

178
00:15:35,440 --> 00:15:37,779
Yo voy a intentar trabajar

179
00:15:37,779 --> 00:15:39,299
No quedarme en multiplicar

180
00:15:39,299 --> 00:15:41,620
Y voy a intentar hacer un programa Java

181
00:15:41,620 --> 00:15:47,200
Cuyo resultado sea el factorial de un número

182
00:15:47,200 --> 00:15:48,940
¿Vale? Eso es mi reto

183
00:15:48,940 --> 00:15:53,820
el vuestro, pues si sois capaces de llegar hasta aquí

184
00:15:53,820 --> 00:15:56,899
ya sería suficiente para vosotros

185
00:15:56,899 --> 00:15:59,440
y si no yo me quedo aquí multiplicando

186
00:15:59,440 --> 00:16:03,159
pero yo voy a intentar hacer el factorial

187
00:16:03,159 --> 00:16:10,120
y si alguien quiere, tiene tiempo y le apetece

188
00:16:10,120 --> 00:16:11,659
pues que lo vaya haciendo

189
00:16:11,659 --> 00:16:17,960
de momento yo creo que como introducción

190
00:16:17,960 --> 00:16:23,620
¿Vale? Es suficiente y espero caberos aclararlo.

191
00:16:23,620 --> 00:16:31,399
De todas formas, vamos a explicarlo mañana en clase por si surgen dudas, que me imagino que surgirán muchas.

192
00:16:31,980 --> 00:16:39,559
Pero como hay algunos que no podéis entrar en Teams, pues os los dejo aquí grabado, que siempre servirá de orientación.

193
00:16:39,860 --> 00:16:40,940
Un saludo y hasta luego.