1 00:00:01,110 --> 00:00:04,170 Entonces, veamos cómo podemos hacer lo mismo. 2 00:00:04,170 --> 00:00:05,973 con el operador ternario. 3 00:00:07,380 --> 00:00:10,320 Entonces, en lugar del operador final aquí, 4 00:00:10,320 --> 00:00:12,251 usemos ahora el operador ternario 5 00:00:12,251 --> 00:00:14,670 para hacer renderizado condicional. 6 00:00:14,670 --> 00:00:16,974 Y de nuevo, en caso de que no estés familiarizado. 7 00:00:16,974 --> 00:00:19,200 con este operador ternario, 8 00:00:19,200 --> 00:00:21,666 por favor revisa la sección anterior 9 00:00:21,666 --> 00:00:25,920 con la revisión de JavaScript necesario para React. 10 00:00:25,920 --> 00:00:28,984 Entonces, el operador ternario tiene tres partes, 11 00:00:28,984 --> 00:00:31,164 y la primera parte es una condición 12 00:00:31,164 --> 00:00:35,340 y si esta condición es verdadera, entonces el resultado 13 00:00:35,340 --> 00:00:40,340 de la operación será esta segunda parte del operador, 14 00:00:40,890 --> 00:00:44,733 que ahora mismo es todo esto no? 15 00:00:45,690 --> 00:00:49,290 Pero entonces el operador ternario también necesita una tercera parte, 16 00:00:49,290 --> 00:00:52,140 que es básicamente como la rama else. 17 00:00:52,140 --> 00:00:54,470 Y así, si queremos reproducir lo mismo 18 00:00:54,470 --> 00:00:57,671 teníamos antes, aquí podemos simplemente escribir no. 19 00:00:57,671 --> 00:01:00,780 Así que dale una caja fuerte y verás que tenemos 20 00:01:00,780 --> 00:01:02,853 exactamente el mismo resultado que antes. 21 00:01:03,990 --> 00:01:08,010 De nuevo, el operador ternario tiene tres partes. 22 00:01:08,010 --> 00:01:10,410 Entonces, primero una condición, y si esto es cierto, 23 00:01:10,410 --> 00:01:13,044 entonces esta primera rama aquí se convertirá en el resultado 24 00:01:13,044 --> 00:01:14,790 de la operación. 25 00:01:14,790 --> 00:01:16,950 Entonces, de usar el operador. 26 00:01:16,950 --> 00:01:19,980 Pero si es falso, entonces esta última parte aquí, 27 00:01:19,980 --> 00:01:22,920 entonces esta tercera parte, será el resultado. 28 00:01:22,920 --> 00:01:26,553 Y eso es lo que se representa en este caso. 29 00:01:28,020 --> 00:01:32,430 Comprobemos eso y efectivamente, eso es lo que sucede. 30 00:01:32,430 --> 00:01:35,370 Ahora, la ventaja de usar el operador de giro es que 31 00:01:35,370 --> 00:01:37,983 entonces podemos mostrar alguna alternativa. 32 00:01:39,360 --> 00:01:41,920 Así que escribamos más JSX aquí. 33 00:01:43,020 --> 00:01:48,020 y digamos: "Todavía estamos trabajando en nuestro menú". 34 00:01:49,620 --> 00:01:54,620 Por favor, vuelve más tarde", por ejemplo. 35 00:01:55,740 --> 00:01:57,600 Entonces entendemos esto. 36 00:01:57,600 --> 00:01:59,580 Entonces, esto es, en algunas situaciones, 37 00:01:59,580 --> 00:02:02,763 un poco mejor que simplemente no mostrar nada. 38 00:02:04,560 --> 00:02:07,593 Pero volvamos atrás y allá vamos. 39 00:02:08,880 --> 00:02:11,940 Quizás se pregunte por qué no podemos simplemente usar 40 00:02:11,940 --> 00:02:14,640 una declaración if-else aquí mismo. 41 00:02:14,640 --> 00:02:16,588 Bueno, la razón es, una vez más, 42 00:02:16,588 --> 00:02:19,680 por lo que aprendimos en la conferencia sobre las reglas 43 00:02:19,680 --> 00:02:24,082 de JSX, que es que dentro de este modo JavaScript, 44 00:02:24,082 --> 00:02:26,910 No podemos escribir ningún JavaScript. 45 00:02:26,910 --> 00:02:29,400 Lo que tenemos que hacer aquí es escribir algo. 46 00:02:29,400 --> 00:02:31,770 que realmente produce un valor 47 00:02:31,770 --> 00:02:35,490 y una declaración if-else no produce un valor. 48 00:02:35,490 --> 00:02:39,090 Entonces, experimentemos algo ficticio. 49 00:02:39,090 --> 00:02:40,507 Entonces, digamos que escribimos, 50 00:02:40,507 --> 00:02:45,507 "Si el número de pizzas es mayor que cero, entonces" esto. 51 00:02:50,640 --> 00:02:52,230 Así que intentémoslo. 52 00:02:52,230 --> 00:02:55,500 Pero sí, eso realmente no va a suceder. 53 00:02:55,500 --> 00:02:58,143 E incluso recibimos este gran error aquí. 54 00:02:58,143 --> 00:03:00,657 y simplemente dice: "Token inesperado". 55 00:03:01,650 --> 00:03:03,810 Bueno, eso es todo lo que dice. 56 00:03:03,810 --> 00:03:05,272 Y sí, la razón aquí es 57 00:03:05,272 --> 00:03:09,594 que hacer esto no produce un valor. 58 00:03:09,594 --> 00:03:12,185 Y entonces es lo mismo que tener esto 59 00:03:12,185 --> 00:03:15,990 al final ya no? 60 00:03:15,990 --> 00:03:18,900 Entonces, el operador ternario, cuando se usa así, 61 00:03:18,900 --> 00:03:22,076 es realmente agradable y lo prefiero mucho 62 00:03:22,076 --> 00:03:26,130 solo sobre el operador final que estábamos usando. 63 00:03:26,130 --> 00:03:30,030 Entonces regresemos aquí y reemplácelo también. 64 00:03:30,030 --> 00:03:31,263 en esta situación aquí. 65 00:03:32,310 --> 00:03:35,190 Entonces, reemplacemos eso aquí. 66 00:03:35,190 --> 00:03:38,433 Y luego también, imprimamos una alternativa aquí. 67 00:03:39,930 --> 00:03:44,930 Entonces, otra pieza de JSX, estamos felices de darle la bienvenida. 68 00:03:47,580 --> 00:03:52,580 en el medio, tomemos esto desde aquí. 69 00:03:56,460 --> 00:03:59,753 Así que aquí tenemos la hora de apertura, ¿vale? 70 00:04:05,100 --> 00:04:10,100 Cambiémoslo nuevamente a 20 y sí, bien. 71 00:04:11,880 --> 00:04:14,820 Entonces, el operador ternario es una herramienta realmente importante. 72 00:04:14,820 --> 00:04:16,650 en su caja de herramientas de React. 73 00:04:16,650 --> 00:04:20,400 Y una vez más, aquí solo usamos JavaScript. 74 00:04:20,400 --> 00:04:23,310 No hay nada específico de React que debas aprender 75 00:04:23,310 --> 00:04:26,670 o memorizar para realizar una representación condicional. 76 00:04:26,670 --> 00:04:29,730 Todo ya es parte del lenguaje JavaScript. 77 00:04:29,730 --> 00:04:32,970 Sólo necesitas saber que así es como lo usas. 78 00:04:32,970 --> 00:04:35,430 Básicamente, dentro de estas llaves 79 00:04:35,430 --> 00:04:38,400 para entrar en modo JavaScript y luego, bueno, entonces, 80 00:04:38,400 --> 00:04:41,033 simplemente usa el operador tal como lo harías 81 00:04:41,033 --> 00:04:42,813 en JavaScript básico.