1
00:00:02,260 --> 00:00:04,100
Não, eu apaguei você joga xadrez?

2
00:00:04,150 --> 00:00:08,590
Caia novamente porque você concluiu que é um módulo de atualização rápida.

3
00:00:09,010 --> 00:00:14,980
Vou mergulhar no conceito de não gravar e é assim que se trabalha com um código síncrono.

4
00:00:15,520 --> 00:00:20,110
E, para isso, primeiro precisamos entender o que é código assíncrono.

5
00:00:20,530 --> 00:00:25,340
Digamos que eu defina um cronômetro com tempo limite definido, que é uma função incorporada ao nó J.

6
00:00:25,350 --> 00:00:26,850
S lá.

7
00:00:27,520 --> 00:00:31,380
Definimos uma função que deve ser executada após um certo cronômetro expirar.

8
00:00:31,870 --> 00:00:33,580
Aqui, vou usar uma função de seta.

9
00:00:33,880 --> 00:00:36,100
Você pode usar uma função nomeada, como quiser.

10
00:00:37,060 --> 00:00:38,620
O segundo argumento é o cronômetro.

11
00:00:38,650 --> 00:00:39,850
Digamos dois segundos.

12
00:00:40,090 --> 00:00:41,710
Você o expressa em milissegundos.

13
00:00:41,830 --> 00:00:46,250
Portanto, dois segundos são dois mil milissegundos.

14
00:00:47,540 --> 00:00:48,190
Tudo simplesmente bloqueado.

15
00:00:48,260 --> 00:00:49,710
O temporizador está pronto.

16
00:00:52,670 --> 00:00:58,490
Se agora eu rodar este arquivo por dois segundos, nada acontece e então vemos que o Taimur está pronto.

17
00:00:59,360 --> 00:01:05,060
Agora, esse é um código assíncrono, porque não termina imediatamente e até seria um código de envio se

18
00:01:05,060 --> 00:01:06,680
tivéssemos um milissegundo lá.

19
00:01:06,770 --> 00:01:12,520
Portanto, se for super rápido, isso não acontece imediatamente em nossa etapa de código.

20
00:01:12,520 --> 00:01:15,350
É como se tivéssemos bloqueio do console.

21
00:01:16,590 --> 00:01:17,100
Olá.

22
00:01:19,020 --> 00:01:20,460
E log do console.

23
00:01:22,400 --> 00:01:28,790
Olá, esses dois trechos são de código Synchronoss porque são executados um após o outro e, no entanto, tecnicamente,

24
00:01:28,790 --> 00:01:32,120
é claro, o Noad levará algum tempo para executá-los.

25
00:01:32,300 --> 00:01:35,750
Mas não há outro atraso além do seu hardware.

26
00:01:35,840 --> 00:01:39,020
Por assim dizer, e, portanto, faz um código Synchronoss.

27
00:01:39,260 --> 00:01:45,110
Este é um código inválido, assíncrono porque não é executado ou finalizado imediatamente.

28
00:01:45,260 --> 00:01:47,930
Demora um pouco de tempo, mesmo que seja super curto.

29
00:01:49,000 --> 00:01:55,340
E, de fato, se eu executar esse arquivo assim, você verá helo e high antes de ver Taimur pronto,

30
00:01:55,520 --> 00:02:04,580
mesmo que seja super rápido porque não G. S. e o JavaScript em geral não bloqueia a execução do seu código até

31
00:02:04,580 --> 00:02:05,660
que isso seja feito.

32
00:02:06,260 --> 00:02:11,630
De fato, aqui ele reconhecerá essa chamada função de retorno de chamada.

33
00:02:11,990 --> 00:02:13,740
Portanto, uma função deve ser executada.

34
00:02:13,760 --> 00:02:18,120
No futuro, ele deve ligar mais tarde assim que estiver pronto.

35
00:02:18,140 --> 00:02:24,470
Assim que esse timer expirar aqui, ele reconhecerá isso e passará imediatamente para a próxima

36
00:02:24,470 --> 00:02:30,740
linha e executará todo o código síncrono e, em seguida, executará seu código assíncrono.

37
00:02:30,800 --> 00:02:36,890
Uma vez feito isso, é por isso que vemos quão alto e baixo primeiro, mesmo que em nosso tempo de código

38
00:02:36,890 --> 00:02:37,820
seja feito primeiro.

39
00:02:38,270 --> 00:02:43,380
E esse é um conceito crucial que você precisa entender em JavaScript e, especialmente, em nós.

40
00:02:43,700 --> 00:02:47,110
E voltarei a isso ao longo do curso porque é muito importante.

41
00:02:48,520 --> 00:02:54,430
Agora, ao trabalhar com dívidas e tudo aumentar para dois segundos, novamente, para torná-lo ainda mais claro, você

42
00:02:54,430 --> 00:02:56,740
verá novamente nosso código de sincronização.

43
00:02:56,920 --> 00:02:58,990
E depois de dois segundos, esse código é executado.

44
00:02:59,650 --> 00:03:05,380
Ao trabalhar com código assíncrono, obtemos várias técnicas de bem, manipulando-o.

45
00:03:06,280 --> 00:03:12,320
A função de retorno de chamada é uma, a mais antiga, e você a verá bastante, especialmente a nota G. S ..

46
00:03:12,680 --> 00:03:20,350
Não há nada errado com isso, mas você enfrentará um problema se tiver algumas operações assíncronas dependentes.

47
00:03:20,980 --> 00:03:22,870
Então aqui ajustamos o cronômetro.

48
00:03:23,300 --> 00:03:27,280
E agora, digamos que eu crie outra função.

49
00:03:29,920 --> 00:03:32,270
O qual chamarei Buscar dados.

50
00:03:34,390 --> 00:03:40,390
E lá também vou definir um cronômetro, porque não quero configurar alguma base de dados ou algo parecido de onde

51
00:03:40,510 --> 00:03:43,520
buscamos dados, faremos tudo isso para todo o curso.

52
00:03:43,720 --> 00:03:44,110
Claro.

53
00:03:44,120 --> 00:03:44,620
Não se preocupe.

54
00:03:45,250 --> 00:03:51,310
Então, aqui novamente, eu tenho outro temporizador, que leva cerca de um segundo e meio.

55
00:03:52,940 --> 00:03:59,610
E agora aqui na Fetch Data, preciso de alguma maneira de, bem, fazer alguma coisa.

56
00:03:59,640 --> 00:04:01,250
Quando termina o temporizador interno?

57
00:04:01,730 --> 00:04:07,190
Então, aqui, na verdade, espero um argumento que chamarei de retorno, porque esse argumento será uma

58
00:04:07,190 --> 00:04:07,820
função.

59
00:04:08,090 --> 00:04:12,740
Acabarei chamando minha função interna aqui assim que terminar o cronômetro.

60
00:04:13,340 --> 00:04:14,360
E aí eu posso passar.

61
00:04:14,390 --> 00:04:18,320
Feito como um valor, sabendo o local onde um uso busca dados.

62
00:04:18,380 --> 00:04:20,490
Digamos que esteja dentro deste conjunto.

63
00:04:20,510 --> 00:04:20,730
Tempo.

64
00:04:20,930 --> 00:04:21,410
Ligar.

65
00:04:22,540 --> 00:04:24,610
Eu chamo buscar dados como esse lá.

66
00:04:24,760 --> 00:04:27,140
Agora preciso passar e nunca mais ligar.

67
00:04:27,940 --> 00:04:28,540
E aqui.

68
00:04:29,690 --> 00:04:34,040
Receberei o texto passado pelo retorno de chamada em minha função quando executado.

69
00:04:34,550 --> 00:04:38,930
Então, vamos pegar um texto aqui e eu posso consertar o bloqueio desse texto.

70
00:04:39,970 --> 00:04:44,890
Agora, no final das contas, isso pode parecer confuso. Estou criando minha própria função, que recebe um retorno

71
00:04:45,160 --> 00:04:50,950
de chamada para que eu possa definir uma função que deve ser executada, quer que esse timer interno seja feito de outro lugar.

72
00:04:51,010 --> 00:04:55,450
Portanto, deste lugar aqui, does é a função que efetivamente é passada como retorno de chamada.

73
00:04:55,830 --> 00:04:57,490
E eu estou executando essa função aqui.

74
00:04:58,330 --> 00:05:00,460
Agora, se eu salvar isso, execute isso.

75
00:05:01,790 --> 00:05:04,680
Demora dois segundos, e esse tempo do timer está concluído.

76
00:05:04,730 --> 00:05:06,770
E depois de um segundo e meio, vejo que está feito.

77
00:05:07,460 --> 00:05:15,170
Agora, se tivermos algumas chamadas assíncronas aninhadas, como temos aqui, nos aprofundaremos mais na perspectiva de retorno de

78
00:05:15,170 --> 00:05:15,980
chamada.

79
00:05:16,790 --> 00:05:21,990
E é por isso que sempre temos um recurso chamado Promessas, que podemos usar.

80
00:05:22,010 --> 00:05:22,760
Sem chance.

81
00:05:23,570 --> 00:05:27,710
Agora, geralmente usamos pacotes de terceiros que já usam promessas para nós.

82
00:05:28,400 --> 00:05:32,810
Portanto, a sintaxe que mostrarei agora é uma que você raramente precisa escrever por conta própria.

83
00:05:33,260 --> 00:05:35,840
Isso será feito pelos pacotes nos bastidores.

84
00:05:36,350 --> 00:05:39,680
Ainda é bom saber que você cria uma promessa.

85
00:05:40,900 --> 00:05:43,450
Dentro da nossa função de dados buscados, você está, digamos.

86
00:05:44,800 --> 00:05:50,050
Armazenando-o em uma constante ou variável e, em seguida, usando a nova palavra-chave, que você usa em JavaScript para

87
00:05:50,050 --> 00:05:52,660
criar um novo objeto com base em um construtor.

88
00:05:53,110 --> 00:05:56,860
Se as funções do construtor são algo que não diz nada.

89
00:05:57,190 --> 00:06:04,030
Confira alguns recursos básicos de introdução ao JavaScript, porque as funções de construtor são um recurso essencial no

90
00:06:04,150 --> 00:06:04,930
JavaScript.

91
00:06:05,680 --> 00:06:11,650
E aqui ele usou a função de construtor de promessas, que é incorporada ao JavaScript e não ao G. S ..

92
00:06:12,970 --> 00:06:18,660
E na verdade também recebe uma chamada de volta, que recebe argumentos, resolve e rejeita.

93
00:06:18,850 --> 00:06:21,640
Você pode nomeá-los como quiser, mas essas são duas funções.

94
00:06:22,180 --> 00:06:25,360
E o primeiro completa a promessa com sucesso.

95
00:06:25,450 --> 00:06:27,250
Resolve com sucesso.

96
00:06:27,640 --> 00:06:31,170
O segundo o rejeita, o que é como lançar um erro.

97
00:06:32,140 --> 00:06:34,870
Você pega seu código assíncrono e o move para lá.

98
00:06:35,170 --> 00:06:37,840
E, novamente, você raramente precisa escrever isso sozinho.

99
00:06:38,110 --> 00:06:43,420
A maioria dos pacotes já faz isso por você e oferece a promessa final, que faz toda

100
00:06:43,420 --> 00:06:45,160
a mágica nos bastidores escondida.

101
00:06:45,610 --> 00:06:46,690
Aqui fazemos isso manualmente.

102
00:06:47,200 --> 00:06:48,510
Então agora e papai ligam de volta.

103
00:06:48,520 --> 00:06:51,690
Nós temos nosso próprio conjunto de funções.

104
00:06:51,710 --> 00:06:55,020
Infelizmente, o tempo limite não nos dá uma API promissora.

105
00:06:55,030 --> 00:06:56,830
Então aqui todos nós temos que usar um retorno de chamada.

106
00:06:57,430 --> 00:06:58,300
Mas na deles.

107
00:07:00,240 --> 00:07:04,860
Agora sabemos que não usamos mais nenhuma função de retorno de chamada que obtemos.

108
00:07:04,950 --> 00:07:07,190
Não tenho argumento aqui e busco mais dados.

109
00:07:07,770 --> 00:07:09,900
Em vez disso, aqui eu resolvo.

110
00:07:10,230 --> 00:07:11,160
Feito, digamos.

111
00:07:11,520 --> 00:07:16,670
Então, voltei com sucesso para resolver o valor agora na busca de dados.

112
00:07:17,100 --> 00:07:20,520
Depois de definir a promessa, basta devolvê-la.

113
00:07:21,060 --> 00:07:23,910
E observe que este é um código síncrono.

114
00:07:24,240 --> 00:07:30,480
Portanto, na verdade, isso será retornado imediatamente após a promessa ser criada antes para codificar a execução

115
00:07:30,480 --> 00:07:35,640
das promessas, o que acontecerá algum tempo depois quando realmente chamarmos essa função.

116
00:07:35,820 --> 00:07:37,590
E quando desta vez Odyn terminar.

117
00:07:38,250 --> 00:07:40,110
Então agora retornamos essa promessa aqui.

118
00:07:40,590 --> 00:07:45,450
E no local em que chamamos de dados buscados, agora não transmitimos mais um retorno de chamada.

119
00:07:45,810 --> 00:07:51,900
Mas agora podemos usar então, que é exigível em uma promessa e retornamos uma promessa.

120
00:07:53,490 --> 00:07:59,880
E isso simplesmente nos permite agora definir uma função chamada aqui, que será executada assim que a promessa

121
00:07:59,910 --> 00:08:00,780
for resolvida.

122
00:08:04,040 --> 00:08:05,610
Agora, qual é a vantagem disso?

123
00:08:06,420 --> 00:08:08,430
Se tivéssemos várias dessas promessas.

124
00:08:09,970 --> 00:08:16,540
Então, digamos que os dados são buscados a frio novamente e aí não preciso usá-los assim.

125
00:08:17,750 --> 00:08:20,640
E, portanto, eu terminaria com aninhado.

126
00:08:22,110 --> 00:08:23,210
Retornos de chamada novamente.

127
00:08:24,280 --> 00:08:30,820
Mas, em vez disso, dentro de uma promessa e, em seguida, o bloco faz parte de uma promessa.

128
00:08:31,180 --> 00:08:39,220
Posso apenas retornar uma nova promessa e, em seguida, adicionar o próximo bloco e depois o anterior.

129
00:08:41,020 --> 00:08:41,650
Como isso.

130
00:08:42,310 --> 00:08:44,740
Então agora temos uma corrente, depois bloqueia.

131
00:08:45,160 --> 00:08:50,290
Este é chamado na primeira promessa, então no bloco então eu retorno outra promessa.

132
00:08:50,680 --> 00:08:54,120
E mesmo que isso não nos desse um incentivo de promessa.

133
00:08:54,280 --> 00:08:58,780
Em seguida, o bloqueio do retorno o converteria em uma promessa que resolve instantaneamente.

134
00:08:59,350 --> 00:09:03,700
E então adicionamos outro bloco, que agora se refere a essa promessa aqui.

135
00:09:04,410 --> 00:09:08,680
E isso é mais legível do que ter retornos de chamada infinitamente aninhados.

136
00:09:09,460 --> 00:09:11,020
Então agora se eu correr o que vemos.

137
00:09:11,050 --> 00:09:11,350
Olá.

138
00:09:11,350 --> 00:09:11,770
Oi.

139
00:09:12,160 --> 00:09:13,150
O temporizador está pronto.

140
00:09:13,690 --> 00:09:14,410
Fizemos.

141
00:09:14,680 --> 00:09:17,500
E vemos isso novamente, porque estou chamando a busca de dados duas vezes.

142
00:09:18,490 --> 00:09:22,330
Portanto, isso pode ser difícil de entender pela primeira vez.

143
00:09:22,690 --> 00:09:23,590
Vamos reutilizá-lo.

144
00:09:23,590 --> 00:09:26,050
Cheio deste curso e que se tornará mais claro.

145
00:09:26,380 --> 00:09:35,140
Novamente, esse código geralmente não é escrito por você, mas é um conceito crucial que torna nosso código assíncrono

146
00:09:35,350 --> 00:09:36,640
mais gerenciável.

147
00:09:37,420 --> 00:09:40,420
Sempre há outra maneira de gerenciar esse assíncrono.

148
00:09:40,460 --> 00:09:46,330
Aguarde duas palavras-chave especiais que você pode usar no JavaScript moderno, e eu terei uma seção separada sobre isso

149
00:09:46,330 --> 00:09:47,830
no final do curso.

150
00:09:48,130 --> 00:09:53,590
Eu quero apresentá-lo aqui, porque na verdade pode ser mais confuso do que esta sintaxe aqui.

151
00:09:53,860 --> 00:09:55,300
E eu quero me ater a este.

152
00:09:55,320 --> 00:09:58,750
Não introduza muitos recursos novos ao mesmo tempo aqui.

153
00:09:59,680 --> 00:10:02,290
O código assíncrono é algo que você precisa entender.

154
00:10:02,530 --> 00:10:08,230
E se não estiver totalmente claro até agora, tudo bem, embora você o veja por um curso

155
00:10:08,290 --> 00:10:11,510
alterado muito, porque temos muitos eventos assíncronos sem chance.

156
00:10:12,130 --> 00:10:14,710
E eu vou explicar isso várias vezes.

157
00:10:14,950 --> 00:10:17,080
Também vou explicar promessas novamente.

158
00:10:17,380 --> 00:10:23,380
Eu só quero garantir que você já tenha visto isso até agora e que tenha uma chance de entender isso,

159
00:10:23,380 --> 00:10:25,870
como funciona e como lidamos com isso.