1
00:00:01,190 --> 00:00:04,150
Así que hablamos de estas matrices de desestructuración,

2
00:00:04,150 --> 00:00:07,090
pero también podemos desestructurar objetos.

3
00:00:07,090 --> 00:00:08,623
Así que hagámoslo ahora.

4
00:00:10,090 --> 00:00:13,030
Y esta vez vamos a escribir el código

5
00:00:13,030 --> 00:00:15,380
antes de la conferencia anterior.

6
00:00:15,380 --> 00:00:18,050
Así que escribe aquí después de este objeto de restaurante,

7
00:00:18,050 --> 00:00:20,920
para que no tengamos que desplazarnos demasiado.

8
00:00:20,920 --> 00:00:25,420
Además, agregué este objeto aquí al objeto del restaurante.

9
00:00:25,420 --> 00:00:28,670
Y eso ya estaba en sus archivos de inicio,

10
00:00:28,670 --> 00:00:31,000
pero no lo tenía aquí todavía.

11
00:00:31,000 --> 00:00:34,990
De todos modos, hablemos ahora de la desestructuración de objetos.

12
00:00:34,990 --> 00:00:36,050
Y para hacer eso,

13
00:00:36,050 --> 00:00:39,850
usamos las llaves para desestructurar.

14
00:00:39,850 --> 00:00:43,600
Así que para desestructurar objetos usamos las llaves.

15
00:00:43,600 --> 00:00:48,340
Porque así también creamos objetos, ¿verdad?

16
00:00:48,340 --> 00:00:52,030
Entonces todo lo que tenemos que hacer es proporcionar los nombres de las variables

17
00:00:52,030 --> 00:00:54,530
que coincidan exactamente con los nombres de las propiedades

18
00:00:54,530 --> 00:00:57,400
que queremos recuperar del objeto.

19
00:00:57,400 --> 00:01:01,210
Entonces, la elección obvia aquí del objeto a desestructurar,

20
00:01:01,210 --> 00:01:02,950
es restaurante.

21
00:01:02,950 --> 00:01:07,293
Así que tomemos el nombre, las categorías y los horarios de apertura.

22
00:01:08,810 --> 00:01:10,990
Entonces, nuevamente, comencemos con const

23
00:01:10,990 --> 00:01:14,250
para definir realmente algunos nombres de variables.

24
00:01:14,250 --> 00:01:15,340
Y ahora como dije,

25
00:01:15,340 --> 00:01:18,640
necesitamos escribir los nombres exactos de las propiedades aquí

26
00:01:18,640 --> 00:01:22,660
para ahora extraer variables de este objeto.

27
00:01:22,660 --> 00:01:24,370
Ahora bien, dado que en un objeto,

28
00:01:24,370 --> 00:01:26,820
el orden de los elementos no importa,

29
00:01:26,820 --> 00:01:29,390
no necesitamos omitir elementos manualmente

30
00:01:29,390 --> 00:01:31,300
como lo hicimos en una matriz.

31
00:01:31,300 --> 00:01:33,623
Así que simplemente podemos escribir el nombre.

32
00:01:34,470 --> 00:01:36,560
Así que ese es el nombre del restaurante aquí.

33
00:01:36,560 --> 00:01:39,720
Y luego recuerda también que en los objetos,

34
00:01:39,720 --> 00:01:42,350
el orden de los elementos no importa.

35
00:01:42,350 --> 00:01:45,943
Y entonces también podemos tomar ahora el horario de apertura,

36
00:01:48,120 --> 00:01:50,330
que es una especie de última propiedad

37
00:01:50,330 --> 00:01:52,783
y sólo entonces las categorías.

38
00:01:54,970 --> 00:01:59,000
Y luego simplemente decimos restaurante igual.

39
00:01:59,000 --> 00:02:01,973
Eso es exactamente lo mismo que con las matrices,

40
00:02:03,250 --> 00:02:05,690
pero ahora aquí usamos las llaves

41
00:02:05,690 --> 00:02:08,900
y tenemos que especificar el nombre de las propiedades.

42
00:02:08,900 --> 00:02:10,940
Pero al igual que con las matrices,

43
00:02:10,940 --> 00:02:14,350
esto ahora crea tres nuevas variables.

44
00:02:14,350 --> 00:02:17,053
Entonces, basado en este objeto de restaurante.

45
00:02:18,130 --> 00:02:23,130
Entonces, veamos nombre, horarios y categorías.

46
00:02:27,410 --> 00:02:29,423
Y de hecho aquí están.

47
00:02:31,210 --> 00:02:32,710
Bueno.

48
00:02:32,710 --> 00:02:35,833
Esos son los fundamentos de la desestructuración de objetos.

49
00:02:37,250 --> 00:02:38,150
Una vez mas,

50
00:02:38,150 --> 00:02:41,770
esta es una adición extremadamente útil al lenguaje.

51
00:02:41,770 --> 00:02:45,990
Especialmente cuando tratamos con el resultado de una llamada API,

52
00:02:45,990 --> 00:02:48,360
que básicamente significa obtener datos

53
00:02:48,360 --> 00:02:50,270
desde otra aplicación web,

54
00:02:50,270 --> 00:02:53,430
como datos meteorológicos o datos sobre películas

55
00:02:53,430 --> 00:02:55,230
o algo así.

56
00:02:55,230 --> 00:02:56,130
y estos datos

57
00:02:56,130 --> 00:02:59,980
por lo general viene en forma de objetos básicamente.

58
00:02:59,980 --> 00:03:03,610
Y luego la desestructuración es realmente un salvavidas.

59
00:03:03,610 --> 00:03:06,820
Nos permite escribir mucho menos código.

60
00:03:06,820 --> 00:03:10,250
Así que esto realmente se usa en aplicaciones modernas.

61
00:03:10,250 --> 00:03:14,300
Pero ahora, ¿qué pasaría si quisiéramos que los nombres de las variables fueran diferentes?

62
00:03:14,300 --> 00:03:16,290
de los nombres de propiedad?

63
00:03:16,290 --> 00:03:19,610
Bueno, podemos hacerlo así.

64
00:03:19,610 --> 00:03:22,630
Ahora, por supuesto, todavía necesitamos hacer referencia a los nombres de las propiedades.

65
00:03:22,630 --> 00:03:24,110
como lo hicimos antes,

66
00:03:24,110 --> 00:03:26,690
de lo contrario, JavaScript no tiene forma de saber

67
00:03:26,690 --> 00:03:28,690
lo que realmente queremos.

68
00:03:28,690 --> 00:03:30,600
Así que escribamos el nombre de nuevo,

69
00:03:30,600 --> 00:03:34,720
pero luego podemos usar los dos puntos y especificar un nuevo nombre.

70
00:03:34,720 --> 00:03:38,043
Digamos que realmente queremos que se llame restaurantName.

71
00:03:40,238 --> 00:03:41,490
Y luego aquí,

72
00:03:41,490 --> 00:03:43,430
digamos que queremos las horas de apertura,

73
00:03:43,430 --> 00:03:48,073
pero queremos que la variable se llame solo horas.

74
00:03:48,970 --> 00:03:52,820
Y luego, una vez más, queremos tomar las categorías,

75
00:03:52,820 --> 00:03:56,693
pero queremos que el nombre de la variable se llame etiquetas.

76
00:03:58,500 --> 00:04:00,640
Y luego otra vez, igual al restaurante.

77
00:04:00,640 --> 00:04:02,670
Y entonces las variables que ahora creamos

78
00:04:02,670 --> 00:04:07,663
se llaman restaurantName, hours y tags.

79
00:04:09,660 --> 00:04:12,620
Así que básicamente esto, esto y esto.

80
00:04:12,620 --> 00:04:15,330
Y el código VS es lo suficientemente bueno como para ponerlos

81
00:04:15,330 --> 00:04:17,063
en este color morado aquí también.

82
00:04:18,250 --> 00:04:19,880
y asi ves

83
00:04:19,880 --> 00:04:23,610
que estos tres son en realidad exactamente el mismo nombre,

84
00:04:23,610 --> 00:04:26,860
pero pudimos darles nuevos nombres de variables.

85
00:04:26,860 --> 00:04:29,670
Lo cual, de nuevo, será inmensamente útil.

86
00:04:29,670 --> 00:04:32,650
cuando se trata de datos de terceros.

87
00:04:32,650 --> 00:04:34,200
Y otra característica útil

88
00:04:35,160 --> 00:04:38,650
para cuando estamos tratando con datos de terceros como ese.

89
00:04:38,650 --> 00:04:41,950
Entonces, como un objeto que obtenemos de otro lugar,

90
00:04:41,950 --> 00:04:45,610
por ejemplo, una llamada a la API, como estaba explicando.

91
00:04:45,610 --> 00:04:48,740
Puede ser realmente útil tener valores predeterminados

92
00:04:48,740 --> 00:04:51,600
para el caso de que estemos tratando de leer una propiedad

93
00:04:51,600 --> 00:04:54,450
que no existe en el objeto.

94
00:04:54,450 --> 00:04:56,860
Entonces, por lo general, obtenemos un indefinido.

95
00:04:56,860 --> 00:05:01,730
Por ejemplo, si intentáramos decir restaurant.menu,

96
00:05:01,730 --> 00:05:03,180
esto seria indefinido

97
00:05:03,180 --> 00:05:05,840
porque no hay una propiedad llamada menú.

98
00:05:05,840 --> 00:05:10,260
Tenemos starterMenu y mainMenu, pero no solo menu.

99
00:05:10,260 --> 00:05:11,093
¿Bueno?

100
00:05:11,093 --> 00:05:13,620
Y así podemos establecer valores predeterminados

101
00:05:14,720 --> 00:05:17,320
al igual que podemos en realidad en matrices.

102
00:05:17,320 --> 00:05:22,320
Así que digamos que estamos tratando de desestructurar el menú.

103
00:05:23,380 --> 00:05:28,040
Entonces usamos equal para establecer un valor predeterminado, ¿de acuerdo?

104
00:05:28,040 --> 00:05:31,600
Y luego podemos hacer lo mismo con el menú de inicio,

105
00:05:31,600 --> 00:05:32,730
Por ejemplo.

106
00:05:32,730 --> 00:05:35,890
Y luego podemos incluso combinar esta sintaxis aquí

107
00:05:35,890 --> 00:05:37,703
con lo que hicimos anteriormente.

108
00:05:38,600 --> 00:05:39,970
Así que déjame mostrarte.

109
00:05:39,970 --> 00:05:42,993
Así que digamos que estamos tratando de recuperar el starterMenu.

110
00:05:43,970 --> 00:05:47,543
Así que este, pero luego queremos darle otro nombre.

111
00:05:49,880 --> 00:05:54,880
Así que starterMenu, y queremos llamarlo solo starters.

112
00:05:54,990 --> 00:05:57,570
Y también queremos darle un valor por defecto

113
00:05:57,570 --> 00:05:59,620
en caso de que no exista.

114
00:05:59,620 --> 00:06:02,423
Entonces, en este caso, solo una matriz vacía.

115
00:06:03,340 --> 00:06:05,793
Ahora, en este caso, realmente existe.

116
00:06:06,780 --> 00:06:08,900
Entonces starterMenu existe.

117
00:06:08,900 --> 00:06:13,740
Y por lo tanto, este valor predeterminado no se aplicará,

118
00:06:13,740 --> 00:06:15,750
pero debería aplicarse al menú.

119
00:06:15,750 --> 00:06:18,430
Porque como te decía,

120
00:06:18,430 --> 00:06:23,130
no hay ninguna propiedad en el objeto restaurante llamado menú.

121
00:06:23,130 --> 00:06:25,193
Así menú y entrantes.

122
00:06:27,440 --> 00:06:30,070
Y aquí, de hecho, obtenemos el valor predeterminado,

123
00:06:30,070 --> 00:06:31,700
que es la matriz vacía.

124
00:06:31,700 --> 00:06:33,763
Y aquí tenemos el menú de entrada.

125
00:06:35,170 --> 00:06:37,810
Y sin esto, nos volveríamos indefinidos,

126
00:06:37,810 --> 00:06:38,743
como decía.

127
00:06:39,600 --> 00:06:40,880
¿Verás?

128
00:06:40,880 --> 00:06:44,673
Y esta es una buena manera de establecer un valor predeterminado.

129
00:06:45,890 --> 00:06:47,120
Una vez mas,

130
00:06:47,120 --> 00:06:50,240
tenga en cuenta que esto es especialmente útil

131
00:06:50,240 --> 00:06:54,740
cuando no tenemos datos codificados como los que tenemos aquí.

132
00:06:54,740 --> 00:06:58,300
Así que estos son solo datos codificados en nuestra aplicación.

133
00:06:58,300 --> 00:06:59,500
Pero en el mundo real,

134
00:06:59,500 --> 00:07:02,710
normalmente obtenemos los datos de otro lugar.

135
00:07:02,710 --> 00:07:04,400
Y entonces es posible que no siempre sepamos

136
00:07:04,400 --> 00:07:06,700
cómo se ven exactamente los datos.

137
00:07:06,700 --> 00:07:10,550
Entonces, es útil establecer valores predeterminados como este.

138
00:07:10,550 --> 00:07:14,320
A continuación, tenemos que hablar sobre la mutación de variables.

139
00:07:14,320 --> 00:07:16,730
mientras desestructura los objetos.

140
00:07:16,730 --> 00:07:18,740
Así que hicimos eso antes con arreglos

141
00:07:18,740 --> 00:07:22,423
cuando estábamos cambiando variables, ¿recuerdas eso?

142
00:07:23,560 --> 00:07:24,563
Entonces, veamos.

143
00:07:25,860 --> 00:07:29,660
Aquí abajo, ves que mutamos estas variables

144
00:07:29,660 --> 00:07:31,370
que creamos antes.

145
00:07:31,370 --> 00:07:35,060
Pero con los objetos, funciona un poco diferente.

146
00:07:35,060 --> 00:07:39,257
Y entonces escribamos eso aquí, mutando variables.

147
00:07:42,400 --> 00:07:47,263
Y aquí vamos a escribir valores predeterminados.

148
00:07:49,320 --> 00:07:52,063
Así que digamos que ya tenemos algunas variables aquí.

149
00:07:54,870 --> 00:07:56,063
Entonces a y b.

150
00:07:59,070 --> 00:08:00,850
Y luego tenemos este objeto,

151
00:08:00,850 --> 00:08:05,840
que tiene una propiedad a de 23, propiedad b de siete

152
00:08:07,670 --> 00:08:11,303
y c de 14, digamos.

153
00:08:12,940 --> 00:08:13,780
¿Está bien?

154
00:08:13,780 --> 00:08:16,630
Y ahora queremos desestructurar este objeto.

155
00:08:16,630 --> 00:08:20,070
Y, de hecho, primero almacenémoslo en una variable

156
00:08:20,070 --> 00:08:22,943
eso hace que sea un poco más fácil trabajar con él.

157
00:08:23,830 --> 00:08:28,560
Entonces, ahora permítanos desestructurar esta matriz.

158
00:08:28,560 --> 00:08:33,400
Ahora no podemos decir const como a, b,

159
00:08:33,400 --> 00:08:38,290
porque a y b ya están declarados aquí, ¿verdad?

160
00:08:38,290 --> 00:08:41,370
También podemos no dejar,

161
00:08:41,370 --> 00:08:44,270
porque de nuevo, eso crearía nuevas variables

162
00:08:44,270 --> 00:08:47,700
y ya los tenemos ahí, ¿vale?

163
00:08:47,700 --> 00:08:51,623
Así que aquí nos falta el objeto que estamos desestructurando.

164
00:08:52,530 --> 00:08:55,860
Pero como decía, no podemos hacer esto.

165
00:08:55,860 --> 00:08:59,420
Y así, de hecho, queremos mutar estas variables.

166
00:08:59,420 --> 00:09:04,000
Entonces a debería convertirse en 23 yb debería convertirse en siete.

167
00:09:04,000 --> 00:09:07,143
Pero ahora que guardamos esto, mira lo que sucede.

168
00:09:08,100 --> 00:09:10,960
Y así obtenemos un error de sintaxis.

169
00:09:10,960 --> 00:09:12,270
Y la razón de eso

170
00:09:12,270 --> 00:09:17,120
es que cuando comenzamos una línea con una llave como esta,

171
00:09:17,120 --> 00:09:21,340
entonces JavaScript espera un bloque de código, ¿de acuerdo?

172
00:09:21,340 --> 00:09:24,590
Y como no podemos asignar nada a un bloque de código,

173
00:09:24,590 --> 00:09:27,350
como hicimos aquí con el signo igual,

174
00:09:27,350 --> 00:09:28,690
entonces obtenemos este error,

175
00:09:28,690 --> 00:09:31,640
token inesperado con el igual allí.

176
00:09:31,640 --> 00:09:32,970
Así que para resolver esto aquí,

177
00:09:32,970 --> 00:09:36,580
el truco es envolver todo esto en un paréntesis.

178
00:09:36,580 --> 00:09:39,853
Y eso es lo que quería mostrarles aquí.

179
00:09:40,810 --> 00:09:41,920
¿Bueno?

180
00:09:41,920 --> 00:09:46,300
Entonces, si registramos a y b, funcionará.

181
00:09:46,300 --> 00:09:49,593
Como ves, ahora tenemos 23 y siete.

182
00:09:50,770 --> 00:09:54,750
Así que básicamente anulamos estas dos variables iniciales,

183
00:09:54,750 --> 00:09:56,300
pero para hacerlo,

184
00:09:56,300 --> 00:09:59,950
tuvimos que terminar esta tarea de desestructuración

185
00:09:59,950 --> 00:10:02,140
entre paréntesis.

186
00:10:02,140 --> 00:10:03,330
Está bien.

187
00:10:03,330 --> 00:10:07,940
Y ahora, ya sabemos cómo funciona la desestructuración de objetos.

188
00:10:07,940 --> 00:10:10,790
Y ahora tenemos que hablar de objetos anidados,

189
00:10:10,790 --> 00:10:13,780
tal como lo hicimos con matrices anidadas.

190
00:10:13,780 --> 00:10:16,490
Así que digamos que queremos crear dos variables,

191
00:10:16,490 --> 00:10:18,610
abrir y cerrar.

192
00:10:18,610 --> 00:10:21,410
Y estos deben contener las horas de apertura y cierre.

193
00:10:21,410 --> 00:10:22,813
para el viernes.

194
00:10:23,870 --> 00:10:24,730
¿Bueno?

195
00:10:24,730 --> 00:10:28,650
Entonces ves que el horario de apertura es un objeto.

196
00:10:28,650 --> 00:10:32,390
Y luego en ese objeto, tenemos otro objeto.

197
00:10:32,390 --> 00:10:35,410
Así que este viernes es un objeto dentro de un objeto,

198
00:10:35,410 --> 00:10:39,180
que a su vez está dentro del objeto restaurante.

199
00:10:39,180 --> 00:10:40,550
¿Bueno?

200
00:10:40,550 --> 00:10:44,130
Ahora el horario de apertura ya es un objeto aquí.

201
00:10:44,130 --> 00:10:46,930
que ya hemos guardado en una variable.

202
00:10:46,930 --> 00:10:49,430
Ese es el objeto que vamos a desestructurar.

203
00:10:50,530 --> 00:10:53,483
Objetos tan anidados.

204
00:10:55,320 --> 00:10:58,340
De nuevo, vamos a empezar con el horario de apertura,

205
00:10:58,340 --> 00:11:00,773
y ahora queremos recuperar el sábado.

206
00:11:02,470 --> 00:11:04,713
Así que vamos a empezar con hacer eso.

207
00:11:07,110 --> 00:11:12,050
Así que solo el sábado por ahora, o en realidad un viernes.

208
00:11:12,050 --> 00:11:13,793
Así que creo que dije el viernes.

209
00:11:17,060 --> 00:11:18,500
Entonces, veamos.

210
00:11:18,500 --> 00:11:22,360
Y, de hecho, el viernes es este objeto que tenemos aquí.

211
00:11:22,360 --> 00:11:25,170
Pero recuerda que en realidad queremos dos variables,

212
00:11:25,170 --> 00:11:28,990
uno llamado abierto y el otro llamado cerrado.

213
00:11:28,990 --> 00:11:31,120
Y así es como funciona.

214
00:11:31,120 --> 00:11:33,530
Entonces sabemos que este es un objeto,

215
00:11:33,530 --> 00:11:36,900
y ahora podemos desestructurar aún más ese objeto

216
00:11:36,900 --> 00:11:39,530
utilizando esta sintaxis.

217
00:11:39,530 --> 00:11:41,450
Así que el colon, y luego otra vez,

218
00:11:41,450 --> 00:11:44,563
el nombre exacto de la propiedad de ese objeto interno.

219
00:11:45,860 --> 00:11:46,940
¿Bueno?

220
00:11:46,940 --> 00:11:49,250
Eso parece confuso,

221
00:11:49,250 --> 00:11:52,260
pero esa es solo la sintaxis que tenemos que usar.

222
00:11:52,260 --> 00:11:54,660
Así que tal vez ni siquiera necesites memorizar esto,

223
00:11:54,660 --> 00:11:57,260
pero cuando necesites esto algún día y lo harás,

224
00:11:57,260 --> 00:12:00,313
entonces puedes venir a este video y ver cómo funciona.

225
00:12:01,260 --> 00:12:06,260
Y de hecho ahora tenemos los números 11 y 23.

226
00:12:06,350 --> 00:12:09,100
Y, por supuesto, podríamos llevar esto aún más lejos.

227
00:12:09,100 --> 00:12:12,170
e incluso asignar diferentes variables a estos,

228
00:12:12,170 --> 00:12:13,970
tal como lo hicimos aquí arriba.

229
00:12:13,970 --> 00:12:15,363
Así que con el colon de nuevo.

230
00:12:16,310 --> 00:12:18,890
Así que podríamos llamar a este simplemente o,

231
00:12:18,890 --> 00:12:20,333
y este solo c.

232
00:12:21,430 --> 00:12:23,803
Así que esto es llevarlo al extremo,

233
00:12:24,800 --> 00:12:26,710
pero como dije al principio

234
00:12:26,710 --> 00:12:29,160
la desestructuración es realmente poderosa.

235
00:12:29,160 --> 00:12:31,530
Así que hay muchas cosas que podemos hacer con él.

236
00:12:31,530 --> 00:12:35,140
Y es por eso que te lo estoy mostrando todo ahora mismo.

237
00:12:35,140 --> 00:12:35,973
¿Bueno?

238
00:12:35,973 --> 00:12:37,700
Y ahora para terminar,

239
00:12:37,700 --> 00:12:41,520
déjame mostrarte una aplicación práctica realmente genial

240
00:12:41,520 --> 00:12:43,340
de esta desestructuración.

241
00:12:43,340 --> 00:12:47,080
Y para eso, vamos a volver a nuestro objeto aquí.

242
00:12:47,080 --> 00:12:50,050
Así que a nuestro ejemplo de la sección.

243
00:12:50,050 --> 00:12:53,350
Y ahora vamos a crear otro método.

244
00:12:53,350 --> 00:12:55,260
Tantas veces en JavaScript,

245
00:12:55,260 --> 00:12:58,577
tenemos funciones con muchos parámetros.

246
00:12:58,577 --> 00:13:02,750
Pero entonces puede ser difícil saber el orden de los parámetros.

247
00:13:02,750 --> 00:13:05,240
para alguien que está usando esta función.

248
00:13:05,240 --> 00:13:08,430
Y así, en lugar de definir los parámetros manualmente,

249
00:13:08,430 --> 00:13:12,770
podemos simplemente pasar un objeto a la función como un argumento,

250
00:13:12,770 --> 00:13:15,410
y la función se desestructurará inmediatamente

251
00:13:15,410 --> 00:13:16,860
ese objeto

252
00:13:16,860 --> 00:13:18,920
Así que déjame mostrarte lo que quiero decir.

253
00:13:18,920 --> 00:13:23,063
Y digamos que queremos una entrega de pedido.

254
00:13:24,660 --> 00:13:26,703
Así que esa es una nueva función.

255
00:13:28,460 --> 00:13:29,357
¿Bueno?

256
00:13:29,357 --> 00:13:33,890
Y aquí, llamemos por ahora a este argumento objeto.

257
00:13:33,890 --> 00:13:36,793
Y luego registraré ese objeto en la consola aquí.

258
00:13:37,690 --> 00:13:40,970
Y ahora permítanme llamar a esto en realidad.

259
00:13:40,970 --> 00:13:43,580
Y lo haré aquí mismo.

260
00:13:43,580 --> 00:13:46,410
Para que podamos ver todo al mismo tiempo.

261
00:13:46,410 --> 00:13:49,063
Eso es restaurant.orderDelivery.

262
00:13:53,185 --> 00:13:56,740
Y ahora aquí viene ese objeto de opciones.

263
00:13:56,740 --> 00:14:00,820
Entonces, como dije, ahora podemos especificar algunas opciones aquí.

264
00:14:00,820 --> 00:14:03,370
Digamos el tiempo de entrega.

265
00:14:03,370 --> 00:14:05,603
Pongámoslo a las 23:30,

266
00:14:06,540 --> 00:14:09,230
que es como a las 22:30.

267
00:14:09,230 --> 00:14:11,490
digamos también dirección

268
00:14:14,510 --> 00:14:16,853
Vía del Sole, 21.

269
00:14:19,830 --> 00:14:22,040
Y luego también especificamos el índice principal

270
00:14:23,070 --> 00:14:24,720
y el índice de inicio.

271
00:14:24,720 --> 00:14:26,190
Así que un poco,

272
00:14:26,190 --> 00:14:28,343
como lo hicimos aquí arriba en esta función.

273
00:14:29,800 --> 00:14:30,883
starterIndex.

274
00:14:34,320 --> 00:14:35,750
¿Bueno?

275
00:14:35,750 --> 00:14:38,970
Ah, y aquí también tenemos que darle algo de valor.

276
00:14:38,970 --> 00:14:41,290
Digamos dos también.

277
00:14:41,290 --> 00:14:42,930
Y entonces...

278
00:14:42,930 --> 00:14:45,903
Sí, aquí justo al principio está ese objeto.

279
00:14:45,903 --> 00:14:47,610
que acabamos de definir

280
00:14:47,610 --> 00:14:52,270
porque aquí simplemente lo estamos registrando por ahora, ¿de acuerdo?

281
00:14:52,270 --> 00:14:55,460
Así que lo que acabamos de hacer fue llamar a esta función aquí

282
00:14:55,460 --> 00:14:59,340
y pasando en un objeto de opciones.

283
00:14:59,340 --> 00:15:02,680
Y eso es algo bastante estándar en realidad en JavaScript,

284
00:15:02,680 --> 00:15:05,210
especialmente en bibliotecas de terceros.

285
00:15:05,210 --> 00:15:08,530
Porque ahora, aquí en los argumentos de la función

286
00:15:08,530 --> 00:15:12,670
en realidad podemos hacer la desestructuración de inmediato.

287
00:15:12,670 --> 00:15:17,433
Así que ahora podemos decir starterIndex, mainIndex, hora y dirección,

288
00:15:23,580 --> 00:15:25,743
que es exactamente los cuatro nombres de propiedad

289
00:15:25,743 --> 00:15:27,730
que tenemos aquí abajo.

290
00:15:27,730 --> 00:15:28,563
Y por supuesto,

291
00:15:28,563 --> 00:15:31,200
por lo general primero desarrollaríamos la función

292
00:15:31,200 --> 00:15:32,400
y luego llamarlo.

293
00:15:32,400 --> 00:15:36,310
Pero quería explicarte esta forma de llamar a un método.

294
00:15:36,310 --> 00:15:37,560
con un objeto,

295
00:15:37,560 --> 00:15:40,933
por lo que escribir el objeto aquí tiene sentido.

296
00:15:42,120 --> 00:15:42,953
¿Está bien?

297
00:15:42,953 --> 00:15:44,650
Y ahora, en lugar del objeto,

298
00:15:44,650 --> 00:15:47,310
ya que hicimos la desestructuración aquí mismo,

299
00:15:47,310 --> 00:15:49,913
ahora tenemos cuatro nombres de variables.

300
00:15:51,350 --> 00:15:53,630
Entonces podemos registrarlos a través de la consola.

301
00:15:54,550 --> 00:15:57,760
o en realidad, hagamos una buena cadena aquí.

302
00:15:57,760 --> 00:16:01,083
Así que digamos pedido recibido.

303
00:16:02,960 --> 00:16:04,610
Y luego vamos a la comida.

304
00:16:04,610 --> 00:16:06,373
Entonces, según el índice de inicio,

305
00:16:07,340 --> 00:16:09,393
solo copiemos eso de aquí.

306
00:16:13,900 --> 00:16:18,900
Entonces esto inicia starterMenu en el starterIndex actual,

307
00:16:18,980 --> 00:16:22,600
y luego también el menú principal.

308
00:16:22,600 --> 00:16:27,463
Así que copiemos eso de nuevo, en realidad todo esto de aquí.

309
00:16:28,610 --> 00:16:33,610
Y necesitamos las llaves y este signo de dólar

310
00:16:37,050 --> 00:16:42,050
será entregado a,

311
00:16:43,306 --> 00:16:45,743
luego la dirección y luego la hora.

312
00:16:49,410 --> 00:16:50,243
¿Bueno?

313
00:16:52,320 --> 00:16:53,460
Y así de hecho,

314
00:16:53,460 --> 00:16:56,921
obtenemos esta cadena completa en función de los datos que pasamos

315
00:16:56,921 --> 00:17:01,360
en este único objeto, ¿de acuerdo?

316
00:17:01,360 --> 00:17:03,970
Así que eso es importante darse cuenta.

317
00:17:03,970 --> 00:17:08,060
Solo pasamos un objeto a esta función, ¿de acuerdo?

318
00:17:08,060 --> 00:17:10,070
No pasamos cuatro argumentos.

319
00:17:10,070 --> 00:17:13,230
Es realmente solo un argumento, un objeto.

320
00:17:13,230 --> 00:17:14,750
Entonces aquí en la función,

321
00:17:14,750 --> 00:17:19,750
en cuanto recibimos ese objeto, inmediatamente lo desestructuramos.

322
00:17:19,790 --> 00:17:22,770
Y es por eso que estos nombres aquí

323
00:17:22,770 --> 00:17:25,850
deben ser exactamente los nombres que tenemos aquí

324
00:17:25,850 --> 00:17:27,300
en el objeto

325
00:17:27,300 --> 00:17:29,160
Pero lo bueno de esto,

326
00:17:29,160 --> 00:17:32,070
es que aquí las propiedades en el índice

327
00:17:32,070 --> 00:17:33,940
no tiene que coincidir con el orden

328
00:17:33,940 --> 00:17:36,680
en el que hacemos desestructuración aquí arriba.

329
00:17:36,680 --> 00:17:38,220
Y eso lo hace realmente fácil.

330
00:17:38,220 --> 00:17:40,770
para el usuario de esta función

331
00:17:40,770 --> 00:17:45,080
para especificar básicamente los argumentos, ¿de acuerdo?

332
00:17:45,080 --> 00:17:46,520
Entonces esto es genial,

333
00:17:46,520 --> 00:17:50,083
pero incluso podemos usar algo más de conocimiento que obtuvimos aquí,

334
00:17:50,930 --> 00:17:53,900
cuáles son estos valores predeterminados.

335
00:17:53,900 --> 00:17:57,770
Así que ahora podemos usar esto para establecer básicamente los valores predeterminados aquí

336
00:17:57,770 --> 00:17:59,520
en algunos de estos.

337
00:17:59,520 --> 00:18:03,550
Así que digamos que el starterIndex será uno.

338
00:18:03,550 --> 00:18:05,710
Si no se puede desestructurar,

339
00:18:05,710 --> 00:18:08,200
ingrese el índice principal será cero.

340
00:18:08,200 --> 00:18:12,913
La hora de entrada será a las 20:00.

341
00:18:14,930 --> 00:18:16,600
Y ahora que llamamos

342
00:18:16,600 --> 00:18:21,060
este es nuestro método restaurant.orderDelivery,

343
00:18:25,150 --> 00:18:27,870
Puedo especificar la dirección de nuevo.

344
00:18:27,870 --> 00:18:29,883
De hecho, vamos a copiarlo desde aquí.

345
00:18:32,360 --> 00:18:35,630
Y permítanme también especificar el starterIndex.

346
00:18:39,240 --> 00:18:40,073
¿Bueno?

347
00:18:40,073 --> 00:18:43,270
Pero luego el resto se tomará de los valores predeterminados.

348
00:18:43,270 --> 00:18:45,263
que ponemos aquí para desestructurar.

349
00:18:47,300 --> 00:18:50,070
Muy bien, y aquí como la segunda cadena,

350
00:18:50,070 --> 00:18:55,070
que recibamos será entregado en Via del Sole a las 20:00.

351
00:18:56,000 --> 00:18:57,230
¿Bueno?

352
00:18:57,230 --> 00:18:59,280
Así que en este objeto que pasamos,

353
00:18:59,280 --> 00:19:03,420
no tenemos ninguna propiedad por el momento, ¿verdad?

354
00:19:03,420 --> 00:19:06,710
Y así como JavaScript hizo la desestructuración,

355
00:19:06,710 --> 00:19:10,140
aquí tomó el valor predeterminado de 20.

356
00:19:10,140 --> 00:19:10,973
¿Bueno?

357
00:19:10,973 --> 00:19:13,360
Y lo mismo sucedió con el índice principal

358
00:19:13,360 --> 00:19:15,360
que también definimos.

359
00:19:15,360 --> 00:19:20,360
Entonces muestra cero y cero es una pizza.

360
00:19:20,830 --> 00:19:24,423
Y es por eso que tenemos pizza aquí en la cadena de salida.

361
00:19:25,920 --> 00:19:26,753
¿Está bien?

362
00:19:28,000 --> 00:19:31,970
Entonces, si alguna vez necesita escribir una función como esta,

363
00:19:31,970 --> 00:19:34,950
entonces uno realmente complejo con muchos parámetros

364
00:19:34,950 --> 00:19:37,410
eso podría ser difícil de especificar,

365
00:19:37,410 --> 00:19:39,610
Ten en cuenta esta técnica.

366
00:19:39,610 --> 00:19:41,610
Y esto se vuelve aún más útil.

367
00:19:41,610 --> 00:19:44,223
a medida que aumenta la cantidad de parámetros.