1
00:00:01,310 --> 00:00:03,150
Comencemos esta sección

2
00:00:03,150 --> 00:00:05,883
aprendiendo sobre la desestructuración de arreglos.

3
00:00:07,320 --> 00:00:09,690
Entonces, como dije en el video de introducción,

4
00:00:09,690 --> 00:00:12,840
en esta sección básicamente vamos a seguir aprendiendo

5
00:00:12,840 --> 00:00:16,740
sintaxis básica y características básicas de JavaScript,

6
00:00:16,740 --> 00:00:21,270
pero ahora con un enfoque en JavaScript más moderno.

7
00:00:21,270 --> 00:00:23,200
Y el tema de esta sección

8
00:00:23,200 --> 00:00:26,860
será para simular una aplicación de parto a pie.

9
00:00:26,860 --> 00:00:29,720
Y en concreto un restaurante italiano

10
00:00:29,720 --> 00:00:31,950
¿Cuál es este dato inicial aquí?

11
00:00:31,950 --> 00:00:34,860
que ya tenemos en los archivos de inicio.

12
00:00:34,860 --> 00:00:38,190
Y entonces este se llama Classico Italiano.

13
00:00:38,190 --> 00:00:41,400
Así que ya abrí los archivos de inicio aquí

14
00:00:41,400 --> 00:00:42,740
para este proyecto.

15
00:00:42,740 --> 00:00:44,050
Bueno.

16
00:00:44,050 --> 00:00:45,890
Ahora aprendiendo temas complejos

17
00:00:45,890 --> 00:00:49,710
como los que vamos a abordar en la sección

18
00:00:49,710 --> 00:00:52,860
es realmente mejor hacerlo de forma aislada.

19
00:00:52,860 --> 00:00:55,070
De esta manera puedes entender exactamente

20
00:00:55,070 --> 00:00:56,880
lo que estoy tratando de enseñarte

21
00:00:56,880 --> 00:00:58,590
sin tener que pensar en

22
00:00:58,590 --> 00:01:01,530
otras cinco cosas al mismo tiempo.

23
00:01:01,530 --> 00:01:04,950
Y entonces estoy aislando solo este restaurante

24
00:01:04,950 --> 00:01:07,610
y sin construir una interfaz de usuario

25
00:01:07,610 --> 00:01:11,870
para que podamos centrarnos solo en el lenguaje JavaScript aquí.

26
00:01:11,870 --> 00:01:15,390
Y algunas personas dirán que esto es aburrido

27
00:01:15,390 --> 00:01:19,320
pero créanme, tengo suficiente experiencia en la enseñanza

28
00:01:19,320 --> 00:01:23,490
saber que algunos temas se aprenden mejor de forma aislada.

29
00:01:23,490 --> 00:01:25,720
y para mi lo mas importante

30
00:01:25,720 --> 00:01:28,960
es que realmente aprenderás en este curso.

31
00:01:28,960 --> 00:01:29,833
Ahora, por supuesto,

32
00:01:30,721 --> 00:01:32,530
también hay temas que se pueden aplicar

33
00:01:32,530 --> 00:01:34,740
a un proyecto visual.

34
00:01:34,740 --> 00:01:36,730
Y es por eso que en la siguiente sección,

35
00:01:36,730 --> 00:01:39,250
tenemos un proyecto realmente genial

36
00:01:39,250 --> 00:01:41,410
con una increíble interfaz de usuario

37
00:01:41,410 --> 00:01:44,560
donde vamos a aprender sobre los métodos de matriz,

38
00:01:44,560 --> 00:01:48,540
pero por ahora centrémonos en las estructuras de datos integradas

39
00:01:48,540 --> 00:01:51,230
y operadores avanzados modernos.

40
00:01:51,230 --> 00:01:54,283
Y nuevamente, comenzando con la desestructuración de la matriz.

41
00:01:55,220 --> 00:01:58,320
Así que la desestructuración es una característica de ESX

42
00:01:58,320 --> 00:02:01,450
y es básicamente una forma de descomprimir valores

43
00:02:01,450 --> 00:02:05,900
de una matriz o un objeto en variables separadas.

44
00:02:05,900 --> 00:02:07,910
En otras palabras, desestructurar

45
00:02:07,910 --> 00:02:11,230
es romper una estructura de datos compleja

46
00:02:11,230 --> 00:02:14,970
en una estructura de datos más pequeña como una variable.

47
00:02:14,970 --> 00:02:17,630
Así que para arreglos usamos desestructuración

48
00:02:17,630 --> 00:02:19,880
para recuperar elementos de la matriz

49
00:02:19,880 --> 00:02:23,223
y almacenarlos en variables de una manera muy fácil.

50
00:02:24,230 --> 00:02:27,563
Entonces, comencemos con una matriz muy simple.

51
00:02:29,170 --> 00:02:31,590
Y ahora si quisiéramos recuperar cada uno

52
00:02:31,590 --> 00:02:35,200
en su propia variable sin desestructurar,

53
00:02:35,200 --> 00:02:36,773
lo haríamos así.

54
00:02:37,930 --> 00:02:40,650
Digamos que quisiéramos nombrarlos AB C.

55
00:02:40,650 --> 00:02:44,250
Y entonces escribiríamos el nombre de la matriz,

56
00:02:44,250 --> 00:02:46,463
que olvidé por completo aparecer.

57
00:02:47,680 --> 00:02:50,980
Entonces nuestro cero y luego simplemente duplicar esta línea

58
00:02:51,890 --> 00:02:56,070
que estoy usando el comando o la opción L cuatro.

59
00:02:56,070 --> 00:03:00,110
Y no estoy seguro de si eso es realmente un atajo en el código VS.

60
00:03:00,110 --> 00:03:02,120
Déjame ver aquí.

61
00:03:02,120 --> 00:03:07,120
Y al parecer no lo es, veamos aquí la selección duplicada.

62
00:03:08,260 --> 00:03:10,350
Así que es esta selección duplicada aquí

63
00:03:10,350 --> 00:03:12,940
y puede configurar un acceso directo para eso.

64
00:03:12,940 --> 00:03:14,340
Y entonces solo haré eso.

65
00:03:17,240 --> 00:03:21,200
Entonces B y ese sería el elemento número uno.

66
00:03:21,200 --> 00:03:24,860
y el número dos sería C.

67
00:03:24,860 --> 00:03:28,400
Así es como recuperaríamos estos tres elementos.

68
00:03:28,400 --> 00:03:30,350
Pero ahora con la desestructuración

69
00:03:30,350 --> 00:03:33,170
en realidad podemos declarar las tres variables

70
00:03:33,170 --> 00:03:34,870
al mismo tiempo.

71
00:03:34,870 --> 00:03:38,810
Así que déjame mostrarte cómo tan constante

72
00:03:38,810 --> 00:03:41,310
y luego usamos los corchetes.

73
00:03:41,310 --> 00:03:44,860
Y eso es porque estamos, desestructurando una matriz.

74
00:03:44,860 --> 00:03:48,490
Y ahora podemos declarar tres variables al mismo tiempo.

75
00:03:48,490 --> 00:03:51,140
Y ahora no estoy usando AB y C

76
00:03:51,140 --> 00:03:52,860
porque ya los usamos.

77
00:03:52,860 --> 00:03:56,203
Así que vamos con XY y Z,

78
00:03:57,150 --> 00:04:02,040
y luego simplemente estableceré eso igual a la matriz.

79
00:04:02,040 --> 00:04:02,873
Y eso es.

80
00:04:03,790 --> 00:04:06,600
No, vamos a verlos ahora en la consola.

81
00:04:09,070 --> 00:04:12,120
guárdelo, y luego necesitamos iniciar nuestro servidor en vivo

82
00:04:13,977 --> 00:04:14,977
con un nuevo terminal.

83
00:04:16,440 --> 00:04:18,840
Y de hecho puedo presionar la tecla de tabulación ahora

84
00:04:18,840 --> 00:04:20,460
y luego escribirá automáticamente

85
00:04:20,460 --> 00:04:21,883
el resto del comando,

86
00:04:26,230 --> 00:04:27,633
luego cierra eso.

87
00:04:31,740 --> 00:04:32,580
y como puedes ver

88
00:04:32,580 --> 00:04:36,030
aquí llegamos a dos resultados, dos, tres y cuatro.

89
00:04:36,030 --> 00:04:38,220
Así que los elementos de la matriz.

90
00:04:38,220 --> 00:04:41,110
Así que básicamente escribimos esta sintaxis aquí

91
00:04:41,110 --> 00:04:44,070
y luego esto se convertirá en el primer elemento de la matriz,

92
00:04:44,070 --> 00:04:46,540
este el segundo y este el tercero.

93
00:04:46,540 --> 00:04:51,000
Y entonces esto aquí está desestructurando esta matriz aquí

94
00:04:51,000 --> 00:04:52,760
desde el lado derecho.

95
00:04:52,760 --> 00:04:53,593
Bueno.

96
00:04:53,593 --> 00:04:57,150
Y, por supuesto, esto parece una matriz, pero en realidad no lo es.

97
00:04:57,150 --> 00:05:00,140
Es solo la tarea de desestructuración.

98
00:05:00,140 --> 00:05:03,680
Entonces, cada vez que JavaScript vea esto aquí en el lado izquierdo

99
00:05:03,680 --> 00:05:08,220
del signo igual, sabe que debe desestructurar.

100
00:05:08,220 --> 00:05:10,520
Ahora, cuando hagas esto, no olvides

101
00:05:10,520 --> 00:05:13,933
para declarar también las variables usando const.

102
00:05:15,250 --> 00:05:16,530
Bueno.

103
00:05:16,530 --> 00:05:18,550
Y también quería notar que

104
00:05:18,550 --> 00:05:20,760
a pesar de que hicimos la desestructuración

105
00:05:20,760 --> 00:05:24,500
que suena un poco distractor, ¿verdad?

106
00:05:24,500 --> 00:05:27,423
La matriz original, por supuesto, no se ve afectada.

107
00:05:29,520 --> 00:05:33,140
Bien, entonces no estamos destruyendo aquí la matriz.

108
00:05:33,140 --> 00:05:38,140
solo estamos desestructurando, así que lo estamos desempacando, ¿de acuerdo?

109
00:05:38,540 --> 00:05:40,780
Y ahora trabajemos un poco con los datos

110
00:05:40,780 --> 00:05:42,350
de nuestro restaurante.

111
00:05:42,350 --> 00:05:46,720
Así que aquí vemos que en realidad tenemos un par de arreglos.

112
00:05:46,720 --> 00:05:50,780
Así las categorías, el menú de inicio y el menú principal.

113
00:05:50,780 --> 00:05:54,283
Así que saquemos algunos elementos de las categorías.

114
00:05:55,670 --> 00:05:56,600
entonces digamos

115
00:05:58,010 --> 00:06:00,770
y luego la tarea de desestructuración

116
00:06:00,770 --> 00:06:04,660
Primero y segundo, bien.

117
00:06:04,660 --> 00:06:06,120
Y ahora ves aquí

118
00:06:06,120 --> 00:06:08,760
que no tenemos que tomar todos los elementos

119
00:06:08,760 --> 00:06:10,260
fuera de la matriz.

120
00:06:10,260 --> 00:06:13,150
Entonces esto solo tomará el primero y el segundo.

121
00:06:13,150 --> 00:06:16,750
Así que simplemente seguirá el orden de los elementos aquí.

122
00:06:16,750 --> 00:06:19,403
y básicamente solo tomaremos estos dos.

123
00:06:21,100 --> 00:06:24,290
Y ahora la matriz de la que queremos extraer

124
00:06:24,290 --> 00:06:27,993
y eso es restaurant.categories.

125
00:06:31,280 --> 00:06:32,720
Solo para echar un vistazo ahora

126
00:06:34,840 --> 00:06:37,960
y de hecho tenemos comida italiana y pizzería

127
00:06:37,960 --> 00:06:41,940
que son exactamente los dos primeros elementos de la matriz.

128
00:06:41,940 --> 00:06:43,060
Pero ahora digamos

129
00:06:43,060 --> 00:06:46,447
que solo queríamos llevarnos la primera categoría.

130
00:06:46,447 --> 00:06:49,550
Así que este y un tercero.

131
00:06:49,550 --> 00:06:52,060
Así que digamos que esta es la categoría principal

132
00:06:52,060 --> 00:06:55,120
y este es el secundario por alguna razón.

133
00:06:55,120 --> 00:06:56,360
Bueno, para hacer eso

134
00:06:56,360 --> 00:06:59,913
simplemente dejamos un agujero en el operador de desestructuración.

135
00:07:00,930 --> 00:07:03,980
Así que lo que quiero decir es sólo esto.

136
00:07:03,980 --> 00:07:07,280
Y ahora se omitirá el segundo elemento.

137
00:07:07,280 --> 00:07:08,970
al que iria aqui

138
00:07:08,970 --> 00:07:13,223
y luego este segundo año simplemente se convierte en este tercer elemento.

139
00:07:15,250 --> 00:07:18,950
Y ahora, para que lo veas un segundo ahora es vegetariano

140
00:07:18,950 --> 00:07:22,080
que es el elemento número tres bien.

141
00:07:22,080 --> 00:07:25,700
Y así, no tenemos que crear variables.

142
00:07:25,700 --> 00:07:28,640
para todas las cosas que quizás ni siquiera necesitemos.

143
00:07:28,640 --> 00:07:31,600
Entonces, si solo necesitamos tomar esto y esto,

144
00:07:31,600 --> 00:07:34,610
simplemente omitimos el elemento en el medio, está bien.

145
00:07:37,940 --> 00:07:39,650
Y esto es realmente poderoso.

146
00:07:39,650 --> 00:07:43,490
Y usamos la desestructuración para hacer muchas cosas geniales.

147
00:07:43,490 --> 00:07:45,750
Por ejemplo, digamos que el dueño

148
00:07:45,750 --> 00:07:49,010
del restaurante ahora decidió cambiar el principal

149
00:07:49,010 --> 00:07:51,240
y la categoría secundaria.

150
00:07:51,240 --> 00:07:54,530
Así que ahora mismo la primaria es italiana.

151
00:07:54,530 --> 00:07:56,510
y la secundaria es vegetariana

152
00:07:56,510 --> 00:07:58,323
pero ahora querían cambiarlo.

153
00:07:59,420 --> 00:08:04,420
Así que primero cambiemos el nombre aquí.

154
00:08:04,420 --> 00:08:09,420
a principal y secundaria, solo para hacerlo un poco más obvio.

155
00:08:10,970 --> 00:08:13,030
secundario.

156
00:08:13,030 --> 00:08:16,500
Y si tuviéramos que cambiar estas dos variables,

157
00:08:16,500 --> 00:08:19,000
entonces sin desestructurar,

158
00:08:19,000 --> 00:08:21,133
tendríamos que hacerlo así.

159
00:08:22,160 --> 00:08:24,833
Necesitaríamos crear una variable temporal,

160
00:08:25,960 --> 00:08:29,580
y luego para que asignáramos uno de ellos,

161
00:08:29,580 --> 00:08:31,070
así que digamos principal,

162
00:08:31,070 --> 00:08:33,600
y luego podríamos cambiar a main.

163
00:08:33,600 --> 00:08:37,000
Diríamos que principal es igual a secundario.

164
00:08:38,350 --> 00:08:43,350
y luego secundario es igual a temp

165
00:08:43,810 --> 00:08:46,890
porque ahí es donde almacenamos temporalmente

166
00:08:46,890 --> 00:08:49,120
el valor de main, ¿verdad?

167
00:08:49,120 --> 00:08:51,600
No podíamos simplemente hacer principal igual secundario

168
00:08:51,600 --> 00:08:53,950
y luego secundario es igual a principal

169
00:08:53,950 --> 00:08:56,840
porque para entonces ya habríamos sobreescrito

170
00:08:56,840 --> 00:08:58,880
la variable principal, ¿verdad?

171
00:08:58,880 --> 00:09:01,560
Y es por eso que necesitamos esta variable temporal

172
00:09:01,560 --> 00:09:02,523
en el centro.

173
00:09:03,650 --> 00:09:05,440
Así es como lo haríamos,

174
00:09:05,440 --> 00:09:08,830
pero con la desestructuración podemos hacerlo mucho más fácil.

175
00:09:08,830 --> 00:09:10,470
Y así es como lo hacemos.

176
00:09:10,470 --> 00:09:13,610
Primero, creamos una matriz con ambos

177
00:09:13,610 --> 00:09:15,770
y el primero va a ser el secundario

178
00:09:17,200 --> 00:09:20,243
y luego el segundo será el principal.

179
00:09:21,410 --> 00:09:22,780
Y en realidad, antes de hacer eso

180
00:09:22,780 --> 00:09:24,873
déjame mostrarte que esto funcionó.

181
00:09:26,840 --> 00:09:30,730
Entonces principal y secundaria

182
00:09:30,730 --> 00:09:32,680
y ahora deberíamos verlos cambiados.

183
00:09:34,460 --> 00:09:35,730
Ah, okey.

184
00:09:35,730 --> 00:09:38,163
Aquí, tenemos que cambiar de rumbo, para dejar,

185
00:09:40,100 --> 00:09:44,393
porque estamos reasignando aquí a una const en la línea 24.

186
00:09:45,780 --> 00:09:47,320
Así que intentemos eso ahora.

187
00:09:47,320 --> 00:09:51,070
Y efectivamente, lo que era italiano ahora es vegetariano

188
00:09:51,070 --> 00:09:53,743
y lo que era vegetariano ahora es italiano.

189
00:09:54,670 --> 00:09:59,250
Así que este año funcionó, pero ahora eliminemos esto.

190
00:09:59,250 --> 00:10:02,560
para que podamos hacerlo usando la desestructuración.

191
00:10:02,560 --> 00:10:05,690
Entonces, como decía, para cambiar a dos variables

192
00:10:05,690 --> 00:10:08,460
usando la desestructuración, primero comenzaríamos

193
00:10:08,460 --> 00:10:13,340
creando una nueva matriz con las dos variables invertidas.

194
00:10:13,340 --> 00:10:16,060
Así que primero secundario y luego principal,

195
00:10:16,060 --> 00:10:18,253
y luego podemos simplemente distraerlos.

196
00:10:19,270 --> 00:10:24,270
Así que principal y secundario es igual a la desestructuración

197
00:10:26,440 --> 00:10:28,070
de esta matriz.

198
00:10:28,070 --> 00:10:30,710
Y ahora no estamos usando let o const aquí

199
00:10:30,710 --> 00:10:33,470
porque simplemente estamos reasignando los valores

200
00:10:33,470 --> 00:10:35,280
de las dos variables.

201
00:10:35,280 --> 00:10:37,170
Así como lo hicimos aquí,

202
00:10:37,170 --> 00:10:41,773
pero ahora no necesitamos una variable temporal en el medio.

203
00:10:44,860 --> 00:10:46,870
Así que vamos a comprobar ahora.

204
00:10:46,870 --> 00:10:51,400
Y de hecho el resultado es el mismo, pero esto es mucho más fácil.

205
00:10:51,400 --> 00:10:55,660
Y este es un truco aquí que en realidad uso todo el tiempo.

206
00:10:55,660 --> 00:10:57,470
Así que déjame mostrarte aquí

207
00:10:57,470 --> 00:11:02,037
o en realidad escriba aquí, cambiando variables.

208
00:11:05,930 --> 00:11:07,060
Bueno.

209
00:11:07,060 --> 00:11:09,020
Así que ese es un truco muy bueno.

210
00:11:09,020 --> 00:11:11,420
Y otro truco con la desestructuración

211
00:11:11,420 --> 00:11:14,660
es que podemos tener una función, devolver una matriz

212
00:11:14,660 --> 00:11:17,760
y luego podemos destruir inmediatamente el resultado

213
00:11:17,760 --> 00:11:19,540
en diferentes variables.

214
00:11:19,540 --> 00:11:23,070
Y esto básicamente nos permite devolver múltiples valores.

215
00:11:23,070 --> 00:11:24,403
de una función.

216
00:11:25,471 --> 00:11:28,603
Entonces intentemos eso y escribamos una función para pedir comida.

217
00:11:29,690 --> 00:11:31,891
Así que aquí en nuestro restaurante

218
00:11:31,891 --> 00:11:33,730
ahora agreguemos un método

219
00:11:35,300 --> 00:11:36,793
y voy a llamarlo orden.

220
00:11:38,040 --> 00:11:39,570
Así que esta será una función.

221
00:11:39,570 --> 00:11:41,600
y aceptará dos parámetros.

222
00:11:41,600 --> 00:11:44,003
un índice para el menú de inicio.

223
00:11:44,880 --> 00:11:48,263
Así que este menú y luego un índice para el menú principal.

224
00:11:49,280 --> 00:11:51,980
Y luego la persona ordenará básicamente

225
00:11:51,980 --> 00:11:55,330
dando el índice para comer de los menús.

226
00:11:55,330 --> 00:11:59,290
Así que algo muy simple sólo para ilustrar el punto aquí.

227
00:11:59,290 --> 00:12:04,290
Así que digamos el índice de inicio y el índice principal.

228
00:12:08,870 --> 00:12:11,230
De acuerdo, entonces simplemente regresaremos ahora.

229
00:12:11,230 --> 00:12:15,273
el contenido de las matrices en función de los índices dados.

230
00:12:16,550 --> 00:12:19,600
Así que vuelve y así, como dije,

231
00:12:19,600 --> 00:12:22,780
vamos a devolver una matriz y luego vamos a

232
00:12:22,780 --> 00:12:27,780
this.startermenu está bien.

233
00:12:28,090 --> 00:12:31,610
Y recuerda cómo se establece esta palabra clave aquí

234
00:12:31,610 --> 00:12:33,820
como aprendimos en la última sección.

235
00:12:33,820 --> 00:12:38,300
Y ahora vamos a la posición del índice de inicio.

236
00:12:38,300 --> 00:12:40,700
que pasamos a la función.

237
00:12:40,700 --> 00:12:42,233
Bien, ¿eso tiene sentido?

238
00:12:43,580 --> 00:12:46,610
Luego lo mismo con el menú principal.

239
00:12:48,020 --> 00:12:52,293
en la posición del índice principal que ha pasado.

240
00:12:53,770 --> 00:12:54,850
Está bien.

241
00:12:54,850 --> 00:12:58,640
Así que aquí estamos, por supuesto, sin hacer ninguna desestructuración todavía.

242
00:12:58,640 --> 00:13:02,150
pero ahora es el momento en que lo haremos.

243
00:13:02,150 --> 00:13:07,150
Así que llamemos orden o, de hecho, restaurante.pedir

244
00:13:09,870 --> 00:13:13,123
y usemos dos y cero.

245
00:13:13,970 --> 00:13:18,593
Entonces queremos el elemento número dos del menú de inicio.

246
00:13:19,540 --> 00:13:23,400
Así que el pan de ajo y el número cero del menú principal,

247
00:13:23,400 --> 00:13:25,350
que es pizza.

248
00:13:25,350 --> 00:13:30,350
Así que vamos a recibir una matriz con eso, ¿verdad?

249
00:13:30,650 --> 00:13:32,100
Déjame mostrarte eso.

250
00:13:35,350 --> 00:13:38,420
Y de hecho es pan de ajo y pizza.

251
00:13:38,420 --> 00:13:41,323
Y ahora podemos simplemente distraer eso.

252
00:13:45,230 --> 00:13:48,244
Así que esta es la tarea de desestructuración.

253
00:13:48,244 --> 00:13:52,780
Y entonces digamos arranque y principal

254
00:13:52,780 --> 00:13:54,563
debe ser igual a estos dos resultados.

255
00:13:56,450 --> 00:14:00,693
Así que eso los registró como motor de arranque y principal.

256
00:14:04,550 --> 00:14:08,800
Ah, y ahora esto ya estaba definido antes.

257
00:14:08,800 --> 00:14:11,743
Así que llamemos a este de aquí, el plato principal.

258
00:14:16,060 --> 00:14:19,883
Y ahora sí, tenemos el pan de ajo y la pizza.

259
00:14:22,410 --> 00:14:25,340
Muy bien, así es como básicamente recibimos

260
00:14:26,320 --> 00:14:30,833
dos valores de retorno de una función.

261
00:14:33,150 --> 00:14:34,890
Bien, entonces por supuesto

262
00:14:34,890 --> 00:14:38,020
podríamos haber hecho eso sin desestructurar

263
00:14:38,020 --> 00:14:40,690
y todavía devolver una matriz de la función,

264
00:14:40,690 --> 00:14:42,660
pero esta es una forma muy práctica

265
00:14:42,660 --> 00:14:45,350
de luego crear inmediatamente dos variables

266
00:14:45,350 --> 00:14:47,560
fuera de una llamada de función.

267
00:14:47,560 --> 00:14:48,770
Bueno.

268
00:14:48,770 --> 00:14:52,060
Y ahora que entiendes cómo funciona la desestructuración

269
00:14:52,060 --> 00:14:54,220
demos un paso más allá

270
00:14:54,220 --> 00:14:57,883
porque ¿qué sucede si tenemos una matriz anidada?

271
00:14:59,040 --> 00:15:00,900
Así que digamos anidado

272
00:15:03,630 --> 00:15:07,713
y con anidado, nos referimos a una matriz dentro de otra.

273
00:15:08,780 --> 00:15:09,900
entonces digamos

274
00:15:09,900 --> 00:15:13,403
que sabemos aquí tienen otra matriz, cinco y seis.

275
00:15:14,960 --> 00:15:17,450
Entonces, una matriz dentro de una matriz.

276
00:15:17,450 --> 00:15:19,710
Y no estoy seguro si hicimos eso antes,

277
00:15:19,710 --> 00:15:22,940
pero por supuesto eso es perfectamente aceptable.

278
00:15:22,940 --> 00:15:25,300
Entonces como un pequeño ejercicio

279
00:15:25,300 --> 00:15:30,203
¿Cómo podemos obtener este valor aquí y toda esta matriz?

280
00:15:31,980 --> 00:15:34,870
Bueno, simplemente definimos dos nuevas variables

281
00:15:34,870 --> 00:15:37,217
utilizando la asignación de desestructuración

282
00:15:37,217 --> 00:15:40,620
y llamémoslos I y J

283
00:15:40,620 --> 00:15:43,650
y recuerda que no queremos en el medio,

284
00:15:43,650 --> 00:15:45,083
así que simplemente lo salteamos.

285
00:15:46,050 --> 00:15:49,220
Así que simplemente deja un espacio y luego otra coma.

286
00:15:49,220 --> 00:15:51,240
y luego este va a ser J

287
00:15:52,500 --> 00:15:56,003
es igual a dos la matriz de la que deben tomarse.

288
00:16:01,140 --> 00:16:04,330
Y de hecho obtenemos el número dos.

289
00:16:04,330 --> 00:16:07,370
y luego la matriz cinco y seis.

290
00:16:07,370 --> 00:16:10,200
Genial, pero ¿y si realmente quisiéramos

291
00:16:10,200 --> 00:16:12,320
todos los valores individuales?

292
00:16:12,320 --> 00:16:14,540
Bueno, entonces esencialmente

293
00:16:14,540 --> 00:16:18,890
tiene que hacer la desestructuración dentro de la desestructuración.

294
00:16:18,890 --> 00:16:23,000
Eso suena complicado, pero no lo es.

295
00:16:23,000 --> 00:16:24,920
Así que saquemos estos aquí

296
00:16:25,870 --> 00:16:29,180
y vamos a crear ahora tres variables.

297
00:16:29,180 --> 00:16:34,180
Entonces uno para este uno para los cinco y uno para los seis.

298
00:16:34,330 --> 00:16:36,780
Así que vamos a saltarnos los cuatro de nuevo.

299
00:16:36,780 --> 00:16:41,400
Así que voy a ser yo entonces otra vez todo aquí

300
00:16:41,400 --> 00:16:43,600
y ahora aquí podemos destruir

301
00:16:43,600 --> 00:16:46,060
esta matriz interna inmediatamente.

302
00:16:46,060 --> 00:16:49,340
Entonces usamos la reestructuración aquí nuevamente

303
00:16:49,340 --> 00:16:54,170
en ahora J para el primer elemento y K para el segundo.

304
00:16:54,170 --> 00:16:55,503
Así que cuatro, cinco y seis.

305
00:16:56,950 --> 00:16:57,800
y luego otra vez

306
00:16:58,980 --> 00:17:03,980
la matriz de la que tomar, y luego echemos un vistazo.

307
00:17:04,690 --> 00:17:08,150
Y ahora esto debería darnos dos, cinco y seis.

308
00:17:08,150 --> 00:17:10,277
como variables separadas.

309
00:17:10,277 --> 00:17:15,277
Y sí, así es como funciona la desestructuración anidada.

310
00:17:16,570 --> 00:17:18,750
Básicamente tenemos que hacer la desestructuración

311
00:17:18,750 --> 00:17:21,770
dentro de la desestructuración.

312
00:17:21,770 --> 00:17:22,730
Bueno.

313
00:17:22,730 --> 00:17:25,950
Y ahora para terminar solo hay otra característica

314
00:17:25,950 --> 00:17:28,720
de desestructuración que quiero mostrarles.

315
00:17:28,720 --> 00:17:31,080
Entonces también podemos establecer valores predeterminados

316
00:17:31,080 --> 00:17:34,130
para las variables cuando las estamos extrayendo.

317
00:17:34,130 --> 00:17:36,560
Y eso va a ser muy útil en el caso

318
00:17:36,560 --> 00:17:38,977
que no sabemos la longitud de la matriz,

319
00:17:38,977 --> 00:17:42,430
y esto a veces puede suceder en aplicaciones del mundo real,

320
00:17:42,430 --> 00:17:44,100
como verás más adelante.

321
00:17:44,100 --> 00:17:47,510
Entonces, si tenemos una matriz que es más corta de lo que pensamos,

322
00:17:47,510 --> 00:17:50,260
entonces podríamos intentar desempaquetar la matriz

323
00:17:50,260 --> 00:17:53,310
en puestos que ni siquiera existen.

324
00:17:53,310 --> 00:17:57,490
Así que permítanme decir aquí solo valores predeterminados

325
00:17:57,490 --> 00:18:01,400
y aquí anida la desestructuración.

326
00:18:03,810 --> 00:18:06,513
Así que estoy aprendiendo muchas cosas aquí sobre la desestructuración.

327
00:18:07,700 --> 00:18:10,930
Y ahora digamos que tenemos esta matriz

328
00:18:10,930 --> 00:18:12,970
ocho y nueve,

329
00:18:12,970 --> 00:18:15,640
y luego estamos tratando de distraerlo.

330
00:18:15,640 --> 00:18:16,540
Así que finge

331
00:18:16,540 --> 00:18:19,453
que en realidad no conocemos bien la matriz.

332
00:18:20,490 --> 00:18:22,310
Y entonces podríamos tratar de tomar

333
00:18:22,310 --> 00:18:27,060
tres elementos fuera de la matriz utilizando nuevamente la desestructuración

334
00:18:27,060 --> 00:18:31,673
así que llamémoslos PQ y R.

335
00:18:33,420 --> 00:18:38,420
Y luego intentemos bloquearlos todos PQ y R.

336
00:18:38,470 --> 00:18:42,870
Y ahora aquí nos quedamos indefinidos como el tercero.

337
00:18:42,870 --> 00:18:45,000
Así que esto sería básicamente lo mismo.

338
00:18:45,000 --> 00:18:48,610
como tratando de leer el elemento en la posición número dos

339
00:18:48,610 --> 00:18:49,880
de esta matriz

340
00:18:49,880 --> 00:18:53,520
pero solo tiene elementos en la posición cero y uno.

341
00:18:53,520 --> 00:18:56,040
Y entonces, por lo tanto, nos quedamos indefinidos.

342
00:18:56,040 --> 00:18:59,240
Pero como dije, podemos establecer valores predeterminados.

343
00:18:59,240 --> 00:19:02,550
Entonces eso es simplemente configurarlos todos en uno

344
00:19:03,440 --> 00:19:08,013
y entonces, nuestra R se convertirá en uno.

345
00:19:09,480 --> 00:19:10,313
Excelente.

346
00:19:10,313 --> 00:19:14,913
Y si eliminamos este elemento, Q también se convertirá en uno.

347
00:19:16,420 --> 00:19:17,300
Bueno.

348
00:19:17,300 --> 00:19:20,150
Y como dije, esto a veces puede ser útil.

349
00:19:20,150 --> 00:19:23,880
Por ejemplo, cuando obtenemos datos de una API.

350
00:19:23,880 --> 00:19:26,210
Y entonces probablemente usaremos este

351
00:19:26,210 --> 00:19:29,200
y en realidad todo lo que hicimos en su conferencia

352
00:19:29,200 --> 00:19:30,963
un poco más tarde en el curso.