1
00:00:00,180 --> 00:00:02,530
Dus we hebben nu twee verschillende dingen die we kunnen richten op.

2
00:00:02,610 --> 00:00:10,110
De eerste is het veranderen van het display hier groen op de winnende speler te zijn en dat men is vrij eenvoudig.

3
00:00:10,140 --> 00:00:14,670
En de tweede is het verkrijgen van de reset-knop om te werken, zodat we kunnen resetten en opnieuw te spelen.

4
00:00:14,850 --> 00:00:20,530
Dus laten we beginnen met de kleurverandering en ik ga om dat te doen door het definiëren van een klasse in een CSSA bestand.

5
00:00:20,580 --> 00:00:25,420
Dus ik moet een C S S-bestand te maken en ik ga gewoon dat scorekeeper noemen.

6
00:00:25,590 --> 00:00:35,790
C Ss dan ga ik om te linken naar het in plaats van mijn HDMI-bestand scorer Dotsie SS en op te slaan.

7
00:00:35,790 --> 00:00:47,090
Dan ga ik naar mijn CSSA bestand en definieer een klasse en ik noem het de winter en ik ga zeggen is de kleur groen en dat is alles wat we nodig hebben en zal redden.

8
00:00:47,190 --> 00:00:49,620
En alleen maar om te controleren dat het lijkt de manier waarop ik het wil.

9
00:00:49,620 --> 00:00:59,540
Laten we het gewoon toe te voegen aan de overspanning zo zal zeggen klasse is gelijk aan en we zullen gewoon geef het een klasse van de winnaar voor speler 1 weergave vanaf het begin te gaan.

10
00:00:59,610 --> 00:01:03,090
En als ik refresh je kunt zien we een groene 0.

11
00:01:03,090 --> 00:01:05,700
Dat is precies wat we willen als een increment.

12
00:01:05,730 --> 00:01:09,260
Natuurlijk willen we dat het zo zwart te starten en voeg alleen de klas.

13
00:01:09,360 --> 00:01:14,320
Wanneer spel is voorbij, dus we nodig hebben om terug te gaan naar onze javascript en zich te ontdoen van deze.

14
00:01:14,520 --> 00:01:17,030
Dus gaat het terug naar zwart.

15
00:01:17,310 --> 00:01:18,910
Ga naar onze javascript nu.

16
00:01:19,530 --> 00:01:24,870
Dus we gewoon beginnen voor speler 1 en we moeten controleren of de speler 1 score gelijk is aan het winnen score is.

17
00:01:24,870 --> 00:01:26,640
Dat betekent dat een speler heeft gewonnen.

18
00:01:26,760 --> 00:01:33,360
Dus hier gaan we naar toe te voegen aan de display-klasse spelerslijst 1.

19
00:01:33,360 --> 00:01:37,570
We gaan naar de klas winnaar toe te voegen en dat is alles wat we moeten doen.

20
00:01:37,830 --> 00:01:44,500
Dus als we frissen je zult zien zoals ik verhogen speler 1 score en krijg tot en met 5.

21
00:01:44,520 --> 00:01:46,580
Die klasse is toegevoegd.

22
00:01:46,830 --> 00:01:49,390
Dus als we hier een kijkje te nemen Ik zal het te inspecteren.

23
00:01:49,410 --> 00:01:54,090
Er is geen klasse en ik blijf het verhogen tot we tot en met 5.

24
00:01:54,090 --> 00:01:59,640
Besteed aandacht recht hier en we krijgen klasse evenaart winnaar toegevoegd Als we in 5.

25
00:01:59,910 --> 00:02:02,900
Dus we zullen hetzelfde doen voor speler 2.

26
00:02:03,150 --> 00:02:07,230
Dus als speler twee scoort de winnende score zal de speler om te laten zien veranderen.

27
00:02:07,710 --> 00:02:10,480
Laten we eens kijken verhogen deze tot en met 5.

28
00:02:10,650 --> 00:02:12,060
Grote.

29
00:02:13,110 --> 00:02:15,030
Alles lijkt te werken prima.

30
00:02:15,450 --> 00:02:19,260
Dus de volgende stuk is het verkrijgen van de reset-knop om nu te werken.

31
00:02:19,350 --> 00:02:22,490
Als we game over het is altijd ingesteld om waar te zijn.

32
00:02:22,500 --> 00:02:24,990
Er is geen manier om het spel over te stappen.

33
00:02:24,990 --> 00:02:28,830
Dus klik op de reset-knop dient om een ​​paar verschillende regels code te activeren.

34
00:02:28,860 --> 00:02:30,540
De eerste die je wilt wijzigen.

35
00:02:30,540 --> 00:02:33,390
Speler 1 score en de speler terug te scoren op nul.

36
00:02:33,420 --> 00:02:43,860
We willen de waarden hier die worden weergegeven in de speler 1 scherm en de speler om te laten zien tot nul te veranderen en we willen deze groene klas vanuit welk element is het op te verwijderen.

37
00:02:44,130 --> 00:02:51,180
En dan is het laatste wat is dat we nodig hebben om er zeker van dat spel te maken dan gaat terug naar zijn valse, zodat onze code en hier weer kan lopen.

38
00:02:51,240 --> 00:02:57,200
Dus het eerste wat moeten we de knop gaven we het id gelijk reset te selecteren.

39
00:02:57,390 --> 00:03:00,170
Dus moeten we hier over te gaan en selecteer het gewoon.

40
00:03:00,330 --> 00:03:02,590
Dus doe ik het met de andere toetsen tot nu toe.

41
00:03:02,640 --> 00:03:16,400
Reset-knop is gelijk aan document stip en we zullen een ander get element doen door id en deze keer de ID is gereset en zal redden en dan gewoon om te controleren of het werkt.

42
00:03:16,580 --> 00:03:17,820
Doe een constante log.

43
00:03:18,060 --> 00:03:22,900
Reset reset-knop en te vernieuwen.

44
00:03:22,900 --> 00:03:26,050
Als we kijken in onze console krijgen we onze juiste knop.

45
00:03:26,070 --> 00:03:27,960
Het is al geannuleerd werd aangemeld.

46
00:03:28,390 --> 00:03:53,910
OK dus we moeten beginnen door het toevoegen van onze event listener voor een klik op dat reset-knop, zodat reset knop die gebeurtenislistener klik op onze callback functie en alles wat we willen doen om opnieuw te beginnen gewoon te annuleren dat log reset gewoon geklikt om ervoor te zorgen dat het werkt en daar gaan we onze reset-knop is geklikt.

47
00:03:54,360 --> 00:03:57,780
Dus de logica hoewel als we bespraken we nodig hebben om in te stellen.

48
00:03:57,780 --> 00:04:00,330
Speler 1 score en de speler terug te scoren op nul.

49
00:04:00,450 --> 00:04:02,440
Dus dat is eenvoudig genoeg.

50
00:04:02,460 --> 00:04:05,890
Speler 1 scoren nul speler score is nul.

51
00:04:06,330 --> 00:04:14,790
Maar als ik dit recht nu lopen waar ik veranderen enige speler 1 score in speler te scoren op nul gezet en increment zodat speler één wint en klik vervolgens opnieuw in te stellen.

52
00:04:14,850 --> 00:04:20,050
Niets lijkt te gebeuren en dat is omdat we alleen de score in javascript veranderen.

53
00:04:20,100 --> 00:04:27,050
We hebben nooit de scores op de pagina bijgewerkt, zodat dat zijn de P1 en P2 weergave variabelen die we nodig hebben om te werken.

54
00:04:27,300 --> 00:04:34,020
Dus we willen één beeldscherm tekstinhoud doen en we kunnen gewoon instellen op nul.

55
00:04:34,020 --> 00:04:37,180
We kunnen het ook instellen op 1 score zijn.

56
00:04:37,320 --> 00:04:38,690
Zij moeten beide nul.

57
00:04:39,090 --> 00:04:42,700
Dus hetzelfde Pete om te laten zien tekstinhoud is nul.

58
00:04:42,930 --> 00:04:46,060
Als we nu vernieuwen en komen we bij 5.

59
00:04:47,280 --> 00:04:48,410
Beiden gaan terug tot nul.

60
00:04:48,450 --> 00:04:50,750
Dus laten we dichterbij spel.

61
00:04:52,360 --> 00:04:55,120
En klik op reset beiden terug naar nul.

62
00:04:55,500 --> 00:04:58,030
Next up laten we de winnaar clausule te verwijderen.

63
00:04:58,090 --> 00:05:01,430
Zal dit doen op de gemakkelijke manier door het verwijderen van de winnaar klasse van beide.

64
00:05:01,540 --> 00:05:03,650
Dus we zullen niet eens controleren welke men het heeft.

65
00:05:03,730 --> 00:05:05,260
We zullen gewoon verwijderen uit beide.

66
00:05:05,300 --> 00:05:07,620
Het is gewoon een kwestie van één beeldscherm.

67
00:05:07,780 --> 00:05:12,070
Klaslijsten verwijderen winnaar.

68
00:05:12,310 --> 00:05:16,440
Dus dat zal zich te ontdoen van de clausule te krijgen en zal het ook doen op te geven.

69
00:05:16,480 --> 00:05:20,830
Dus welke men het heeft maakt het niet uit, omdat we dat het verwijderen van beide.

70
00:05:21,940 --> 00:05:25,160
Dus nu als we een spel spelen krijgen we een winnaar.

71
00:05:25,600 --> 00:05:26,850
Ik klik resetten.

72
00:05:26,920 --> 00:05:30,560
Beiden gaan terug tot slechts een lege platte tekst.

73
00:05:31,140 --> 00:05:33,700
Maar zoals je kunt zien krijg ik tot vijf.

74
00:05:33,790 --> 00:05:36,340
Ik klik reset-knop nog steeds niet werken.

75
00:05:36,610 --> 00:05:39,930
En dat komt omdat game over is nog steeds waar.

76
00:05:40,110 --> 00:05:42,900
En dus geen van onze code in plaats van deze gebeurtenissen is gaan lopen.

77
00:05:43,090 --> 00:05:45,000
Dus het laatste wat we moeten doen is ingesteld.

78
00:05:45,100 --> 00:05:50,340
Game over terug naar vals en die ons in staat moet stellen om te blijven spelen.

79
00:05:50,820 --> 00:05:53,350
Dus ik zal incrementals vernieuwen.

80
00:05:53,520 --> 00:05:55,530
Laten we een game over.

81
00:05:55,540 --> 00:05:55,990
Daar gaan we.

82
00:05:55,990 --> 00:05:57,240
Ik kan niet meer spelen.

83
00:05:57,250 --> 00:06:04,610
Ik klik op reset en nu game over is het terug naar vals en ik kan weer spelen en daarna door te gaan.

84
00:06:04,840 --> 00:06:07,220
Dus dat is de kernfunctionaliteit hier.

85
00:06:07,320 --> 00:06:14,650
We hebben bijna alles gedaan het laatste wat krijgt het speelveld om het nummer of de winnende score aan een variabele zijn.

86
00:06:14,640 --> 00:06:16,520
Dus het is niet altijd slechts vijf.

87
00:06:16,930 --> 00:06:27,710
Dus we hebben deze input en we willen om dit te gebruiken zodat wanneer ik dit veranderen om zeven dit zegt spelen tot en met 7 en onze maximum of onze winnende score is zeven in plaats van vijf.

88
00:06:27,970 --> 00:06:29,750
Dus hebben we een paar stappen om er te komen.

89
00:06:29,760 --> 00:06:35,500
Het eerste wat we moeten doen is het selecteren van deze ingang zoals je kunt zien hebben we input type dat gelijk is aan het aantal.

90
00:06:35,740 --> 00:06:37,330
Het is de enige ingang op de pagina.

91
00:06:37,360 --> 00:06:40,410
Dus we hoeven niet per se te geven een ID of iets dergelijks.

92
00:06:40,420 --> 00:06:46,790
Dus ik ga hier over te gaan en selecteer deze alleen met mijn andere selectors var.

93
00:06:47,050 --> 00:06:58,030
Laten we noemen het geen input is gelijk aan document en er is een heleboel manieren om het te krijgen kan documenten die zoekopdracht selector ingang te doen.

94
00:06:58,020 --> 00:07:01,400
We kunnen ook alleen wanneer opgeven.

95
00:07:01,420 --> 00:07:06,540
Type is gelijk aan getal omdat er kunnen andere ingangen.

96
00:07:06,730 --> 00:07:08,070
In ons geval zal ik het simpel houden.

97
00:07:08,080 --> 00:07:09,330
Er is maar één ingang.

98
00:07:09,460 --> 00:07:11,190
Dus dit werkt prima.

99
00:07:11,810 --> 00:07:12,120
OK.

100
00:07:12,120 --> 00:07:14,420
Dus hebben we die ingang gekozen.

101
00:07:14,440 --> 00:07:16,390
Dus laten we nu toe een evenement.

102
00:07:16,420 --> 00:07:26,920
Dus wat we willen dat er gebeurt, is dat elke keer dat dit verandert de waarde of dat aantal veranderingen die we willen dat dit bij te werken en we willen dat de winnende score variabele zo goed te werken.

103
00:07:26,950 --> 00:07:29,200
Dus wat we moeten doen is het toevoegen van een evenement.

104
00:07:29,280 --> 00:07:40,190
Dus we gewoon gaan gevoelloos en zet Dot had event Lessner klik gewoon doen het op deze manier hier.

105
00:07:41,050 --> 00:07:44,750
Functie en allemaal een waarschuwing.

106
00:07:45,300 --> 00:07:54,720
Klikte op de input en wat je ziet, is dat eigenlijk een klik luisteraar is niet de beste tool voor deze job.

107
00:07:54,920 --> 00:07:58,880
Want ja we kunnen de waarde te veranderen met een klik alsof ik net daar deed.

108
00:07:59,470 --> 00:08:07,150
Maar ik kan ook getroffen wissen en typ een aantal mijzelf en geen enkel geval werd ontslagen omdat ik niet moet klikken.

109
00:08:07,360 --> 00:08:11,110
Dus als ik de kleine knoppen hier een snelle evenement branden.

110
00:08:11,110 --> 00:08:14,670
Anders als ik gewoon mijn toetsenbord gebruiken we niet snel een evenement te krijgen.

111
00:08:14,680 --> 00:08:19,680
Dus er is een ander type van het evenement, dat is veel beter in deze zaak die verandering wordt genoemd.

112
00:08:19,770 --> 00:08:25,240
Dus een verandering event zal elk moment draaien verandert de waarde en het maakt niet uit hoe die waarde veranderd.

113
00:08:25,240 --> 00:08:27,840
Als het was omdat ik klikte of druk op de Delete-toets.

114
00:08:27,850 --> 00:08:35,000
Dus laten we eigenlijk de waarschuwing veranderen hier om te zeggen veranderde de input en vervolgens te vernieuwen.

115
00:08:35,320 --> 00:08:39,900
En als ik klik hier om het te veranderen vertelt me ​​dat je de input veranderd.

116
00:08:40,090 --> 00:08:47,960
Maar als ik schrappen en ik typ een getal dat niet gepaard gaat klikken vertelt me ​​ook dat ik de input veranderen dus dat is geweldig.

117
00:08:47,980 --> 00:09:00,650
Dit is het evenement willen we de verandering evenement gebruiken elk gewenst moment de waarde veranderingen die we willen dit getal hier te werken en we willen ook onze winnende score bij te werken, zodat onze spel verder te gaan totdat we dat nieuwe winnende score te raken.

118
00:09:00,700 --> 00:09:02,700
Hopelijk is dit niet onze werkelijke winnende score.

119
00:09:02,740 --> 00:09:04,850
Zeker lange spel van Rock Paper Scissors.

120
00:09:05,080 --> 00:09:08,530
Dus het eerste wat is hier het bijwerken van deze waarde.

121
00:09:08,860 --> 00:09:13,020
Dus net zoals voordat we nodig hebben om het te selecteren waarop het is een paragraaf.

122
00:09:13,060 --> 00:09:22,590
Dus moeten we onze paragraaf te selecteren en ik zal gewoon een VAR paragraaf gelijk document die vraag selector tag.

123
00:09:23,290 --> 00:09:35,070
En vervolgens in deze snelle geval we zullen gewoon veranderen tekstinhoud en we gewoon beginnen door gewoon te veranderen om te zeggen geklikt of laten we zeggen waarde veranderd.

124
00:09:36,640 --> 00:09:39,310
Net als dat en refresh.

125
00:09:39,310 --> 00:09:49,730
Nu als ik de waarde die paragraaf veranderingen wil zeggen waarde veranderd veranderen, maar dit is ons hetzelfde probleem kwamen we eerder met de H-1, we willen niet de hele paragraaf te wijzigen.

126
00:09:49,810 --> 00:09:52,390
We willen alleen maar om dit kleine deel te veranderen.

127
00:09:52,390 --> 00:09:55,000
Dus wat we willen gebruiken is eigenlijk een andere overspanning.

128
00:09:55,300 --> 00:09:58,950
Dus we zullen terug te gaan en we zullen een overspanning toe te voegen rondom het nummer.

129
00:09:59,380 --> 00:10:06,400
En dit is een perfect gebruik voor een overspanning, waar weer we het kunnen gebruiken te richten op slechts een klein deel van een element niet het hele ding.

130
00:10:06,820 --> 00:10:11,680
En ik ben eigenlijk niet van plan om het deze keer alleen maar om u een andere manier van het selecteren van het te tonen een idee te geven.

131
00:10:11,710 --> 00:10:14,780
Dus vergeet niet het is een overspanning in plaats van een paragraaf.

132
00:10:14,920 --> 00:10:17,010
En het is de enige als dat op onze pagina.

133
00:10:17,110 --> 00:10:18,060
Dus zullen we teruggaan.

134
00:10:18,310 --> 00:10:30,170
Dus in plaats van het selecteren van de paragraaf laten we een nieuwe variabele en we noemen het winnende score scherm en het gaat om documenten te vragen selector zijn.

135
00:10:30,970 --> 00:10:39,520
Maar in plaats van alleen overspannen omdat er andere overspanningen op de pagina willen we overspanningen te selecteren binnenkant van de leden.

136
00:10:39,550 --> 00:10:40,690
Dus dat is alles wat we hebben om te schrijven.

137
00:10:40,810 --> 00:10:41,930
P ruimte.

138
00:10:41,930 --> 00:10:42,710
Span.

139
00:10:43,240 --> 00:10:44,490
En we zullen redden.

140
00:10:44,980 --> 00:10:49,970
En laten we nu ga je gang en het actualiseren van de winnende score weergegeven op hier in plaats van paragraaf.

141
00:10:49,990 --> 00:10:53,710
Dus winnende score scherm als deze.

142
00:10:54,010 --> 00:10:56,020
En het is nog steeds niet van plan om perfect te zijn.

143
00:10:56,080 --> 00:11:02,550
Het wordt alleen maar waarde Gewijzigde elke keer, maar in ieder geval is het niet updaten van de hele paragraaf.

144
00:11:02,950 --> 00:11:10,840
Dus de volgende stap is het krijgen van het te updaten naar het nummer dat er in de ingang zodat de waarden met elkaar te synchroniseren weer te geven.

145
00:11:10,880 --> 00:11:13,920
Dus we hebben eigenlijk niet gezien hoe wij de gegevens krijgen van een input.

146
00:11:13,960 --> 00:11:15,940
Hoe krijgen we de huidige waarde.

147
00:11:15,940 --> 00:11:18,100
Ik ga je hier laten zien door de input te selecteren.

148
00:11:18,250 --> 00:11:32,750
Dus documenteren die vraag selector en we gaan om het te doen in de console-ingang en ik ga het op te slaan in een variabele dus noem het var ingang document taqueria selecteer uw input en dan gaan we een input doen daat waarde.

149
00:11:33,040 --> 00:11:39,040
Zodat de waarde zal een reeks van wat er in deze ingang ongeacht de waarde is.

150
00:11:39,040 --> 00:11:43,800
Dus als ik dit tot 7 veranderen en ik voer de code opnieuw krijg ik 7.

151
00:11:44,120 --> 00:11:51,520
Als ik maak er een enorm aantal en dit keer doe ik het het weerspiegelt weer wat de waarde is de binnenkant van deze input.

152
00:11:51,520 --> 00:11:56,950
Dus gaan we gebruik van maken door het veranderen van deze in plaats van om de string waarde veranderd.

153
00:11:56,950 --> 00:12:12,710
We gaan om het te veranderen naar Nahm ingang dot waarde zodat de waarde zal nemen van hier en de winnende score displays inhoud van de tekst te wijzigen.

154
00:12:13,370 --> 00:12:18,690
Dus we vernieuwen en ik updaten en je kan ofwel nu in sync met elkaar.

155
00:12:19,030 --> 00:12:26,900
Dus zoals ik deze update om 02:59 mijn spel aan of de winnende score display werkt ook op 1-3.

156
00:12:27,340 --> 00:12:30,580
Dus natuurlijk zijn we niet spelen tot 123.

157
00:12:30,580 --> 00:12:32,350
We zijn nog steeds spelen tot vijf.

158
00:12:32,740 --> 00:12:40,280
En dat komt omdat onze logica niet is als gevolg van deze nieuwe invoerwaarde al dat het als gevolg van onze oorspronkelijke winnende score van 5.

159
00:12:40,480 --> 00:12:51,430
Zo willen we ook veranderen hier beneden zijn winnende score gelijk te zijn aan invoerwaarde verdoven en op te slaan.

160
00:12:51,430 --> 00:12:58,790
En nu laten we proberen te veranderen zodat we spelen tot drie en we klikken en je zult merken we wat rare gedrag.

161
00:12:58,840 --> 00:13:00,940
Dus het zelfs niet stoppen bij vijf.

162
00:13:00,970 --> 00:13:02,370
Het houdt gewoon altijd.

163
00:13:02,650 --> 00:13:10,300
Dus dit is een leuke bug die te maken heeft met verschillende soorten data strings en getallen en vergelijken ze dubbel gelijken versus triple gelijken.

164
00:13:10,300 --> 00:13:14,200
Dus tot op de bodem te krijgen van te laten doen wat nadelen. houtkap.

165
00:13:14,200 --> 00:13:24,700
Dus we weten dat de kern van dit alles is deze lijn hier of deze lijn hier waar we controleren of de speler een als score van de speler is gelijk aan de winnende score.

166
00:13:24,820 --> 00:13:26,790
Dat is wanneer we stellen game over om waar te zijn.

167
00:13:27,130 --> 00:13:29,610
En dat is nu niet meer dan gebeurt omdat spel.

168
00:13:29,620 --> 00:13:31,460
Als we veranderen de score.

169
00:13:31,450 --> 00:13:33,730
Game over is nooit veranderen.

170
00:13:33,820 --> 00:13:35,460
Het is altijd vals.

171
00:13:35,710 --> 00:13:37,660
Dus er iets mis gaat met deze lijn.

172
00:13:37,780 --> 00:13:41,860
Dus laten we een opgeheven logboek en we gaan twee dingen doen.

173
00:13:41,870 --> 00:13:49,700
Laten we gewoon een afdruk van de speler 1 score en we zullen de winnende score af te drukken en kunnen we ze te scheiden door komma's en ze zullen gewoon print ze op dezelfde lijn.

174
00:13:49,720 --> 00:13:56,820
Even een kort briefje met behulp van Comstock logs is hoe we gaan om te debuggen voor nu, maar zullen we later praten over meer geavanceerde manieren van debuggen.

175
00:13:57,010 --> 00:14:07,470
Dus ik zal vernieuwen en als we beginnen nemen we een kijkje nemen op verhoogde speler 1 score en je kunt zien dat we drie en we zijn te vergelijken met de nummer vijf.

176
00:14:07,540 --> 00:14:10,670
Dus speler 1 score wordt drie winnende score is vijf.

177
00:14:10,900 --> 00:14:15,250
Maar zodra ik dit veranderen om te laten we zeggen 7 en nu ik klik.

178
00:14:15,250 --> 00:14:23,160
Speler 1 we nu vergelijken speler 1 score is het nummer vier te winnen score die de string zeven.

179
00:14:23,440 --> 00:14:27,090
Dus vernieuwen weer als ik gewoon beginnen met vijf.

180
00:14:27,110 --> 00:14:28,420
Het werkt prima.

181
00:14:28,780 --> 00:14:36,680
Maar als ik dit te veranderen en nu vergelijken we het aantal en de string en dat gaat niet werken voor ons, want we doen triple gelijken hier.

182
00:14:36,790 --> 00:14:40,590
Dus we konden dubbele gelijken doen, maar je weet dat ik ben geen fan van dat.

183
00:14:40,610 --> 00:14:46,670
Dus wat we gaan doen in plaats daarvan is gaan hier en alleen deze te nemen en we deze waarde en zet hem in een string.

184
00:14:46,780 --> 00:14:57,130
Dus nummer net als dat kapitaal en het aantal en dan pas in en zet de waarde die vervolgens om te zetten in een string en zet die op zijn winnende score.

185
00:14:57,220 --> 00:14:58,020
Dus we waren vers.

186
00:14:58,020 --> 00:15:02,210
Nu dit werkt prima.

187
00:15:02,760 --> 00:15:11,120
We krijgen tot vijf, maar als we ook dit veranderen zijn om ons spel is afgelopen op 2.

188
00:15:11,230 --> 00:15:17,000
Er is een klein probleem dat we moeten concentreren op wat als we een spel aan het spelen bent tot vijf en dat is wat we begonnen te doen.

189
00:15:17,170 --> 00:15:22,310
En als ik halverwege besluit door dat ik wil de winnende score te veranderen op de maximale score.

190
00:15:22,390 --> 00:15:28,920
Onze code werkt op dit moment niet aan die zeer goed, want als ik dit nu veranderen we alleen spelen tot drie.

191
00:15:28,960 --> 00:15:30,630
We hebben twee verschillende manieren van omgaan met dit.

192
00:15:30,640 --> 00:15:34,610
De eerste is het resetten van de score en alles terug naar nul.

193
00:15:34,880 --> 00:15:37,790
En de andere blijft spelen vijf.

194
00:15:38,120 --> 00:15:43,010
Maar wat is er eigenlijk gebeurt is dat we spelen tot drie, maar we hebben al voorbij drie.

195
00:15:43,300 --> 00:15:51,390
Dus omdat we al gepasseerd onze code niet echt meer werken omdat we liggen het is gewoon te controleren is speler gelijk is aan de winnende score te scoren.

196
00:15:51,400 --> 00:15:53,790
Het is niet te controleren als het groter is dan de winnende score.

197
00:15:54,040 --> 00:15:55,170
Dus als konden we dat veranderen.

198
00:15:55,180 --> 00:16:00,830
Dus het zegt als het groter is dan de winnende score dan spel voorbij en dat is prima.

199
00:16:00,970 --> 00:16:18,720
Maar ik denk dat de beste oplossing is om op nul wanneer we de maximale score te veranderen want we hadden nooit echt de maximale score halverwege veranderd door middel van een spel anyways zouden we willen het spel opnieuw te beginnen en de andere reden dat ik wil dat we dit doen is het een goed use case voor een korte refactor.

200
00:16:18,880 --> 00:16:22,410
Dus toen we veranderen de score hier zijn de winnende score.

201
00:16:22,610 --> 00:16:27,370
We willen het spel dat is dezelfde logica dat we lopen hier resetten.

202
00:16:27,430 --> 00:16:34,720
Dus we doen dat heel eenvoudig gewoon om deze code uit te kopiëren en maak een nieuwe functie genaamd reset.

203
00:16:34,720 --> 00:16:44,780
Dus functie reset zet alles van deze code in daar en dan zodra het aantal ingang veranderingen die we gaan gewoon om te draaien opnieuw in te stellen.

204
00:16:44,890 --> 00:16:48,920
Dus je zult zien dat ik opnieuw in te stellen hier te spelen tot vijf.

205
00:16:48,940 --> 00:16:49,960
Dit werkt prima.

206
00:16:49,960 --> 00:16:50,950
We krijgen tot vijf.

207
00:16:51,100 --> 00:16:59,840
Ik klik op reset en we hebben niet de reset-functie genaamd binnenkant van dit evenement luisteraar dus we moeten onze reset-functie gesprek toe te voegen.

208
00:16:59,950 --> 00:17:02,370
En nu als we frissen we naar 5.

209
00:17:02,770 --> 00:17:03,980
Ik klik resetten.

210
00:17:04,030 --> 00:17:04,970
Dat is allemaal goed.

211
00:17:05,140 --> 00:17:11,890
En nu als ik in het midden van een spel en ik verander de score het ons ook reset en nu spelen we in op 1.

212
00:17:11,890 --> 00:17:12,800
En het werkt.

213
00:17:13,100 --> 00:17:14,220
Of als ik veranderen.

214
00:17:14,230 --> 00:17:17,710
Dus we speelt nu tot en met 7.

215
00:17:17,800 --> 00:17:19,730
Het zet ons terug naar nul.

216
00:17:20,020 --> 00:17:27,190
Dus als ik besluit je weet dat dit eigenlijk een spel van plan om 2 in plaats daarvan het verandert de spec op nul.

217
00:17:27,280 --> 00:17:29,910
En we hebben geen zorgen te maken over hoe om te gaan.

218
00:17:29,920 --> 00:17:31,380
Als we veranderen halverwege.

219
00:17:31,510 --> 00:17:40,900
Dus wat we doen is gewoon opnieuw instellen maakte een aparte functie te drogen de code in plaats van het dupliceren van dit hier en hier beneden.

220
00:17:40,960 --> 00:17:41,940
Dus dat is het voor nu.

221
00:17:41,950 --> 00:17:43,510
Dat is alles wat we moeten doen.

222
00:17:43,630 --> 00:17:48,610
Sommigen van u kunnen afvragen of deze code is echt de beste manier waarop we misschien dit zou kunnen doen.

223
00:17:48,620 --> 00:17:49,590
Het antwoord is nee.

224
00:17:49,850 --> 00:17:54,500
En als je goed kijkt zie je dat het zeer vergelijkbaar.

225
00:17:54,490 --> 00:18:00,150
Het is eigenlijk hetzelfde, behalve dat we degene die het doet hier en P2 hier beneden.

226
00:18:00,160 --> 00:18:01,930
Maar elk ander woord is hetzelfde.

227
00:18:02,470 --> 00:18:06,390
Er zijn dus meer geavanceerde manieren van refactoring deze van het maken van dit een beetje beter.

228
00:18:06,490 --> 00:18:18,170
Maar ik ben niet van plan om dat te doen hier omdat alles wat ik wil concentreren op conceptueel hoe we javascript event listeners selectors dominante relatie en interactieve HD IMO kan nemen en dat is wat ik wil concentreren op.

229
00:18:18,380 --> 00:18:25,010
Maar weet alleen dat we zullen zien manieren om de code te maken als deze zien er een beetje beter een beetje korter.

230
00:18:25,030 --> 00:18:29,860
Er is één ding dat we hier beneden konden doen en doe dat bij evenement luisteraar.

231
00:18:30,050 --> 00:18:38,620
We konden gewoon vervangen verdoofd ingang hier met het woord is dit een kleine verandering, maar we kunnen dat doen en gewoon inkorten van de code een beetje.

232
00:18:38,740 --> 00:18:41,650
Dus dit als ik veranderen we nu spelen tot drie.

233
00:18:41,650 --> 00:18:43,870
Alles werkt nog steeds precies hetzelfde.

234
00:18:43,880 --> 00:18:50,770
Ik gebruikte het sleutelwoord deze die verwijst naar wat het evenement is te luisteren waar was nummer invoeren.

235
00:18:50,990 --> 00:18:52,650
Oké dus dat is het voor deze les.

236
00:18:52,780 --> 00:18:59,010
Zoals ik in het volgende project genoemd we gaan om iets op te bouwen meer substantiële en ik beloof het zal een stuk beter dan dit deed hier kijken.