1
00:00:00,000 --> 00:00:02,570
[Powered by Google Translate] [Semana 9]

2
00:00:02,570 --> 00:00:04,740
[David J. Malan - Harvard University]

3
00:00:04,740 --> 00:00:07,170
[Esta é CS50. - CS50.TV]

4
00:00:07,170 --> 00:00:12,350
Tudo bem. Bem-vindo de volta. Este é CS50, e este é o início da semana 9.

5
00:00:12,350 --> 00:00:16,600
Hoje, em particular, o design, não mais no contexto de C

6
00:00:16,600 --> 00:00:20,010
mas no contexto do PHP e um pouco de SQL e um pouco de JavaScript,

7
00:00:20,010 --> 00:00:23,730
particularmente para um fim de ambos pset 7 e também o seu projeto final.

8
00:00:23,730 --> 00:00:26,310
Na verdade, se você está naquele ponto em seu projeto final

9
00:00:26,310 --> 00:00:30,100
onde presumivelmente a partir de uma hora atrás, você pelo menos começou a dar algum pensamento

10
00:00:30,100 --> 00:00:33,730
ao seu projeto final e você está pensando que você gostaria de colaborar com um ou dois colegas,

11
00:00:33,730 --> 00:00:36,150
se você está tendo problemas para se conectar com colegas de classe disse,

12
00:00:36,150 --> 00:00:40,570
sinta-se livre para preencher o formulário em cs50.net/partners/form.

13
00:00:40,570 --> 00:00:42,880
Ele só pede que você que você é, o tipo de projeto que você está pensando,

14
00:00:42,880 --> 00:00:44,870
onde você vive apenas por razões logísticas.

15
00:00:44,870 --> 00:00:49,510
E então, se você quer manter um olho em durante a próxima semana ou assim que a URL planilha lá,

16
00:00:49,510 --> 00:00:53,520
então você pode ver uma versão somente leitura do documento do Google

17
00:00:53,520 --> 00:00:56,010
em que estamos coletando essas informações.

18
00:00:56,010 --> 00:00:58,930
Então, se você quer trabalhar com alguém, por todos os meios se sentir livre para chegar às pessoas

19
00:00:58,930 --> 00:01:00,480
através deste mecanismo.

20
00:01:00,480 --> 00:01:02,690
Mas a maioria das pessoas fazem trabalho solo. Isso é totalmente bem.

21
00:01:02,690 --> 00:01:06,120
Portanto, não sinto que esta é de forma alguma obrigatório.

22
00:01:06,120 --> 00:01:09,680
Na sexta-feira era só eu e alguns da equipe aqui,

23
00:01:09,680 --> 00:01:11,100
teatro vazio para a maior parte.

24
00:01:11,100 --> 00:01:14,600
Foram três turistas sentado lá em cima, de modo que foi um pouco estranho.

25
00:01:14,600 --> 00:01:18,970
O que nós falamos foi sobre bases de dados e nós conversamos sobre pset 7 um pouco.

26
00:01:18,970 --> 00:01:22,200
E se você não aconteceu para pegar aquela em vídeo ainda, isso é bom.

27
00:01:22,200 --> 00:01:26,770
Vou tentar definir os termos que, de outra forma ter concedido

28
00:01:26,770 --> 00:01:28,840
com base em palestra de sexta-feira.

29
00:01:28,840 --> 00:01:32,550
>> Mas hoje nós estamos indo para tentar chegar ao ponto

30
00:01:32,550 --> 00:01:34,990
de não apenas ser capaz de fazer algo assim pset 7

31
00:01:34,990 --> 00:01:37,360
mas realmente entender o que está acontecendo debaixo do capô,

32
00:01:37,360 --> 00:01:41,910
particularmente algumas das abstrações que nós colocamos no lugar do arquivo functions.php

33
00:01:41,910 --> 00:01:45,780
para fazer a sua vida um pouco mais fácil, mas para que você finalmente entender

34
00:01:45,780 --> 00:01:48,760
de modo que quando as rodinhas sair em algumas semanas você ainda pode sobreviver

35
00:01:48,760 --> 00:01:53,750
no mundo real e fazer essas coisas sem qualquer quadro CS50 debaixo de você.

36
00:01:53,750 --> 00:01:57,500
Esse $ _SESSION, para aqueles de vocês que estão familiarizados

37
00:01:57,500 --> 00:02:01,960
ou que já peguei o vídeo na sexta-feira, o que vamos fazer SESSÃO

38
00:02:01,960 --> 00:02:04,330
em uma aplicação web baseado em PHP?

39
00:02:04,330 --> 00:02:09,650
Esta é uma variável superglobal, o que significa que é similar em espírito para GET e POST

40
00:02:09,650 --> 00:02:13,970
e alguns outros, mas o que é essa coisa de útil para?

41
00:02:13,970 --> 00:02:18,320
>> O que é SESSÃO utilizado? Sim. [Aluno] log in

42
00:02:18,320 --> 00:02:21,040
Desculpe? [Aluno] log in log in fato.

43
00:02:21,040 --> 00:02:25,100
Em pset sete estamos usando essa superglobal SESSÃO para facilitar log in

44
00:02:25,100 --> 00:02:28,600
E o que é agradável sobre este superglobal é que é um array associativo.

45
00:02:28,600 --> 00:02:33,190
Uma matriz associativa, recall, é apenas uma matriz, mas cujos índices já não têm de ser números

46
00:02:33,190 --> 00:02:37,670
como 012. Eles podem ser números ou eles podem ser ainda cordas.

47
00:02:37,670 --> 00:02:44,890
E isso, se você mergulhou pset 7 ainda, você deve se lembrar que estamos armazenando uma identificação chave chamada

48
00:02:44,890 --> 00:02:50,330
dentro dessa matriz associativa cujo valor é algo como 123 -

49
00:02:50,330 --> 00:02:53,780
qualquer que seja conectado no momento ID do usuário é.

50
00:02:53,780 --> 00:02:59,470
A motivação para isso é que, mesmo depois de o usuário visitou localhost

51
00:02:59,470 --> 00:03:02,720
ou o meu site mais geral e então eles logado,

52
00:03:02,720 --> 00:03:07,320
mesmo que não clique em um link ou voltar para o meu site por 5 minutos

53
00:03:07,320 --> 00:03:10,730
ou até mesmo uma hora ou até mesmo um dia, mas eles deixam a janela do navegador aberta,

54
00:03:10,730 --> 00:03:14,370
através deste superglobal posso lembrar que eles se identificou

55
00:03:14,370 --> 00:03:21,140
>> Em outras palavras, isso me permite armazenar um pouco longo prazo qualquer coisa que eu quero sobre um usuário.

56
00:03:21,140 --> 00:03:24,390
E você pode pensar realmente como a encarnação de um carrinho de compras.

57
00:03:24,390 --> 00:03:27,740
Locais como a Amazon, obviamente, deixar você colocar as coisas em um carrinho de compras,

58
00:03:27,740 --> 00:03:32,230
mas HTTP, o protocolo que alimenta a Web, é apátrida

59
00:03:32,230 --> 00:03:34,230
no sentido de que quando você visita um site,

60
00:03:34,230 --> 00:03:37,290
para a maior parte, você não tem alguma conexão de rede constante

61
00:03:37,290 --> 00:03:39,270
entre o navegador eo servidor.

62
00:03:39,270 --> 00:03:42,190
Assim que você tenha baixado o HTML e os JPEGs e os GIFs e tudo isso,

63
00:03:42,190 --> 00:03:48,200
a conexão vai embora e você só tem uma cópia do HTML e outras coisas do servidor.

64
00:03:48,200 --> 00:03:53,000
Mas se o servidor quer se lembrar de algo sobre você,

65
00:03:53,000 --> 00:03:57,580
a carga está no servidor para realmente gravar essa informação.

66
00:03:57,580 --> 00:04:00,130
E assim que você o programador que têm controle sobre o servidor

67
00:04:00,130 --> 00:04:04,400
pode colocar mais alguma coisa que você quiser dentro dessa matriz associativa superglobal

68
00:04:04,400 --> 00:04:06,850
e ele vai estar lá na próxima vez que o usuário voltar,

69
00:04:06,850 --> 00:04:12,070
se é minutos ou mesmo dias mais tarde, a menos que eles fechem a janela do navegador,

70
00:04:12,070 --> 00:04:14,360
em que ponto SESSÃO desaparece.

71
00:04:14,360 --> 00:04:17,779
Então, é o armazenamento efêmero, é não-persistente, e é destinado a ir embora

72
00:04:17,779 --> 00:04:22,360
assim que o usuário fecha seu navegador - não apenas que guia, muitas vezes, o navegador inteiro,

73
00:04:22,360 --> 00:04:24,930
assim, efectivamente deslogar o usuário.

74
00:04:24,930 --> 00:04:28,000
Então, como é essa coisa realmente implementado?

75
00:04:28,000 --> 00:04:31,360
Vamos dar uma rápida olhada em um exemplo simples, olhou na sexta-feira.

76
00:04:31,360 --> 00:04:33,340
Para quem não conhece, era tão simples como isso.

77
00:04:33,340 --> 00:04:35,910
Esta é uma página da web, cujo único propósito na vida é me diga

78
00:04:35,910 --> 00:04:38,000
quantas vezes eu já visitaram esta página.

79
00:04:38,000 --> 00:04:41,670
Esta é a primeira vez aqui na segunda-feira que o visitei, por isso diz 0 vezes.

80
00:04:41,670 --> 00:04:46,940
>> Mas se eu começar a recarregar esta página, ele diz que uma vez, 2, 3, 4, 5,

81
00:04:46,940 --> 00:04:49,800
e isso acabará por apenas manter a contagem subindo, subindo, subindo, subindo, até

82
00:04:49,800 --> 00:04:53,130
para cada vez que eu realmente clicar em Atualizar sobre ele.

83
00:04:53,130 --> 00:04:58,830
Então, como é esse trabalho? Deixe-me ir para dentro desse arquivo chamado counter.php.

84
00:04:58,830 --> 00:05:02,490
A parte de cima é todos os comentários azuis, mas a parte interessante é aqui.

85
00:05:02,490 --> 00:05:06,670
Na linha 13 nós chamamos isso de session_start função,

86
00:05:06,670 --> 00:05:09,600
e que é, literalmente, tudo o que você precisa fazer se você quiser ter acesso

87
00:05:09,600 --> 00:05:13,610
a este superglobal especial chamada $ _SESSION.

88
00:05:13,610 --> 00:05:17,430
Isso torna tudo isso possível, e vamos ver em um momento como esse é possível.

89
00:05:17,430 --> 00:05:20,350
Em comunicado linha 16 o que eu estou fazendo.

90
00:05:20,350 --> 00:05:25,960
Se a chave, chamado contador - por outras palavras, o valor do índice - "contador"

91
00:05:25,960 --> 00:05:32,310
existe dentro dessa matriz chamada sessão, então o que estou fazendo com ele na linha abaixo?

92
00:05:32,310 --> 00:05:36,650
Qual é a linha 18 está fazendo?

93
00:05:36,650 --> 00:05:40,360
>> [Resposta do aluno inaudível] O que é isso? [Aluno] Armazenar o valor. Bom.

94
00:05:40,360 --> 00:05:45,800
É armazenar o valor que está em SESSÃO agora em uma nova variável local temporária,

95
00:05:45,800 --> 00:05:48,250
$ Contador em todas as letras minúsculas.

96
00:05:48,250 --> 00:05:50,770
Note que o PHP já está sendo um pouco preguiçoso aqui.

97
00:05:50,770 --> 00:05:55,550
Repare que não temos qualquer menção de int ou float ou string ou qualquer coisa assim

98
00:05:55,550 --> 00:06:00,480
porque o PHP é fracamente tipado, em que você não tem que especificar o tipo de uma variável,

99
00:06:00,480 --> 00:06:03,310
e neste caso aqui eu não tenho ainda declarou ainda.

100
00:06:03,310 --> 00:06:08,980
Estou declarando-a dentro destas chaves e ao contrário de C, este é realmente bem.

101
00:06:08,980 --> 00:06:13,800
Não importa o quão profundamente aninhados declaração de uma variável é em PHP -

102
00:06:13,800 --> 00:06:16,650
dentro de encaracolado cinta, dentro de encaracolado cinta e afins -

103
00:06:16,650 --> 00:06:21,230
ele naquele momento no tempo existem para o restante do programa,

104
00:06:21,230 --> 00:06:22,680
para melhor ou para pior.

105
00:06:22,680 --> 00:06:26,930
Por isso, imediatamente torna-se global, logo que você o define como estamos fazendo aqui.

106
00:06:26,930 --> 00:06:31,620
>> Caso contrário, se eu não achar que há alguma coisa na superglobal SESSION,

107
00:06:31,620 --> 00:06:34,680
Estou aparentemente inicializar este contador variável para 0,

108
00:06:34,680 --> 00:06:37,580
assim, apenas assumindo o usuário nunca tenha estado aqui antes.

109
00:06:37,580 --> 00:06:40,030
E então este curso é de incrementar o contador como?

110
00:06:40,030 --> 00:06:44,480
Estou atualizando o valor que está dentro dessa matriz associativa

111
00:06:44,480 --> 00:06:49,530
fixando-a igual a qualquer momento contador é + 1.

112
00:06:49,530 --> 00:06:53,520
Se eu rolar até aqui para o código HTML da página, é realmente muito simples.

113
00:06:53,520 --> 00:06:58,920
Tudo o que tenho no corpo desta página é: "Você já visitaram este site vezes assim e assim."

114
00:06:58,920 --> 00:07:00,350
E esta é uma construção PHP.

115
00:07:00,350 --> 00:07:06,080
Se você fizer <? =, Isto é equivalente ao que efetivamente função?

116
00:07:07,920 --> 00:07:12,600
É realmente equivalente a algo como printf, que nós já vimos muitas vezes em C,

117
00:07:12,600 --> 00:07:15,940
embora, como você já deve saber a partir da especificação em pset 7,

118
00:07:15,940 --> 00:07:20,160
impressão também é uma função que apenas imprime alguma coisa, ele realmente não usar códigos de formato,

119
00:07:20,160 --> 00:07:23,270
e você pode realmente dizer eco também.

120
00:07:23,270 --> 00:07:27,460
Eles são todos muito ligeiramente diferente, mesmo que o efeito líquido é basicamente o mesmo.

121
00:07:27,460 --> 00:07:31,270
Então, esse uso do sinal de igual é apenas uma espécie de uma maneira elegante de fazer isso

122
00:07:31,270 --> 00:07:34,910
de forma mais sucinta do que você poderia ser capaz.

123
00:07:34,910 --> 00:07:38,370
Então, isso é tudo que este site faz. Ele imprime o valor de contador.

124
00:07:38,370 --> 00:07:40,550
Como se tudo isso realmente acontece?

125
00:07:40,550 --> 00:07:43,250
Você deve se lembrar de uma semana atrás, começamos a olhar debaixo do capô

126
00:07:43,250 --> 00:07:47,910
de como a página web funciona usando este guia inspetor.

127
00:07:47,910 --> 00:07:51,900
>> Chrome tem esse tanto na versão para Mac, a versão do Windows, e até mesmo a versão do Linux,

128
00:07:51,900 --> 00:07:59,510
e Firefox e IE têm mecanismos semelhantes em que você tem este depurador embutido

129
00:07:59,510 --> 00:08:01,400
dentro do navegador.

130
00:08:01,400 --> 00:08:03,040
Vamos dar uma olhada no seguinte.

131
00:08:03,040 --> 00:08:06,960
Temos um monte de guias aqui, e lembrar que o mais à esquerda é uma Elementos,

132
00:08:06,960 --> 00:08:10,700
e não importa como godawful o código HTML e JavaScript é em uma página,

133
00:08:10,700 --> 00:08:15,710
lembrar que, com a guia Elementos você pode realmente navegar no HTML hierarquicamente

134
00:08:15,710 --> 00:08:17,050
e agradável e ordenadamente.

135
00:08:17,050 --> 00:08:19,370
Então, se você está tentando aprender a partir de um site como o Google ou o Facebook

136
00:08:19,370 --> 00:08:22,370
ou realmente qualquer site, saiba que você é provavelmente melhor fora

137
00:08:22,370 --> 00:08:26,360
olhando o código fonte desta forma ao invés de ver a fonte-prima,

138
00:08:26,360 --> 00:08:29,580
o que pode ser uma bagunça, como temos visto, especialmente no site do Google.

139
00:08:29,580 --> 00:08:32,220
Então, se eu, em vez clique na guia Rede aqui,

140
00:08:32,220 --> 00:08:34,830
vamos ver o que está acontecendo quando eu visitar esta página.

141
00:08:34,830 --> 00:08:38,669
Primeiro deixe-me limpar o cache.

142
00:08:38,669 --> 00:08:43,570
Eu estou indo para ir em Configurações no Chrome e depois ir para a História

143
00:08:43,570 --> 00:08:46,420
e desmarque todos os dados de navegação.

144
00:08:46,420 --> 00:08:48,170
Você pode estar acostumado a fazer isso para outros fins, [risos]

145
00:08:48,170 --> 00:08:51,990
mas quando se trata de sites em desenvolvimento, é realmente útil -

146
00:08:51,990 --> 00:08:55,980
se você está rindo você sabe. [Risos]

147
00:08:55,980 --> 00:08:59,310
É realmente muito útil no desenvolvimento de sites, porque a realidade é

148
00:08:59,310 --> 00:09:04,100
coisas como biscoitos e coisas como cache de arquivos HTML, arquivos de cache de JavaScript

149
00:09:04,100 --> 00:09:06,390
pode realmente se tornar uma grande dor de cabeça, porque se por qualquer motivo

150
00:09:06,390 --> 00:09:11,500
o navegador decide fazer cache algum arquivo e ainda assim você tiver feito alterações que o arquivo no servidor

151
00:09:11,500 --> 00:09:14,670
mas o navegador não tem realmente percebeu que o arquivo foi alterado

152
00:09:14,670 --> 00:09:19,060
e, portanto, não realmente voltar a baixá-lo, mesmo quando você clicar no botão Recarregar,

153
00:09:19,060 --> 00:09:23,210
uma das formas mais infalível para apenas certifique-se a culpa não é com o seu código,

154
00:09:23,210 --> 00:09:26,480
é com o comportamento do navegador, é ir aqui no seu browser

155
00:09:26,480 --> 00:09:29,950
e apenas limpar toda a história, de modo que não há confusão.

156
00:09:29,950 --> 00:09:33,210
>> E então, se você realmente quer ser paranóico, saia do navegador, reiniciá-lo,

157
00:09:33,210 --> 00:09:35,660
e certifique-se tudo está funcionando como esperado.

158
00:09:35,660 --> 00:09:38,820
Assim, em breve, limpeza de cache é bom quando se faz desenvolvimento.

159
00:09:38,820 --> 00:09:40,690
Portanto, temos aqui a guia Rede.

160
00:09:40,690 --> 00:09:46,020
Eu já tinha visitado o site 9 vezes, mas deixe-me ir em frente agora e clique em Recarregar.

161
00:09:46,020 --> 00:09:47,500
E eu estou de volta para 0.

162
00:09:47,500 --> 00:09:52,100
Vamos realmente ver como é que este superglobal sessão está sendo implementado.

163
00:09:52,100 --> 00:09:55,990
Eu estou indo para clicar a solicitação HTTP 1 que foi feita,

164
00:09:55,990 --> 00:09:58,810
e esta janela de depuração me permite olhar para dentro disso.

165
00:09:58,810 --> 00:10:01,970
Aqui eu vejo apenas uma resposta a partir do servidor, o que não é interessante.

166
00:10:01,970 --> 00:10:04,030
Eu vi isso em qualquer número de maneiras.

167
00:10:04,030 --> 00:10:06,350
Mas o que é tecnicamente interessante são os cabeçalhos.

168
00:10:06,350 --> 00:10:11,770
Se eu rolar para baixo aqui e focar os cabeçalhos de solicitação e clique em ver fonte,

169
00:10:11,770 --> 00:10:14,400
o que eu vou ver é, literalmente, a solicitação HTTP

170
00:10:14,400 --> 00:10:17,250
que acabou de entrar no meu navegador para o servidor,

171
00:10:17,250 --> 00:10:21,400
GET é a palavra e, em seguida, / counter.php sendo o nome do arquivo,

172
00:10:21,400 --> 00:10:25,670
HTTP/1.1 ser apenas a versão do HTTP que o meu computador está usando.

173
00:10:25,670 --> 00:10:31,070
Esta linha aqui é um pequeno lembrete de navegador para o servidor que o nome do servidor é

174
00:10:31,070 --> 00:10:33,020
que ele quer falar.

175
00:10:33,020 --> 00:10:38,200
E depois o resto isso às vezes é interessante, mas não é relevante agora.

176
00:10:38,200 --> 00:10:40,090
>> Este é apenas um tipo de curiosidade.

177
00:10:40,090 --> 00:10:43,530
Cryptic embora essa seqüência é, a qualquer momento o seu browser visita um website

178
00:10:43,530 --> 00:10:47,110
é informar o servidor do navegador que você está usando

179
00:10:47,110 --> 00:10:50,040
e qual o sistema operacional que você está usando e qual a versão do mesmo.

180
00:10:50,040 --> 00:10:52,650
Então, se você já se perguntou como sites como CNN e outros enfeites

181
00:10:52,650 --> 00:10:56,860
saber o que as percentagens são de usuários de Mac na web os usuários, PC,

182
00:10:56,860 --> 00:11:00,820
Usuários do IE, os usuários do Chrome e afins, é porque todos os nossos navegadores

183
00:11:00,820 --> 00:11:04,300
está dizendo a cada único site lá fora que somos.

184
00:11:04,300 --> 00:11:07,410
Isso não significa necessariamente conter informações de identificação pessoal,

185
00:11:07,410 --> 00:11:13,060
mas ele faz dizer ao servidor que seu endereço IP é eo que navegador e sistema operacional você está usando.

186
00:11:13,060 --> 00:11:14,720
Então é aí que essa informação é.

187
00:11:14,720 --> 00:11:19,960
Mas o que é mais interessante agora, quando se trata destas sessões é o cabeçalho de resposta.

188
00:11:19,960 --> 00:11:22,530
Deixe-me ver clique fonte próxima a resposta.

189
00:11:22,530 --> 00:11:24,590
O que é interessante aqui é algumas coisas.

190
00:11:24,590 --> 00:11:27,580
1, temos de volta um código de status 200.

191
00:11:27,580 --> 00:11:29,840
Nós nunca vemos esse código de status porque isso significa que está tudo bem.

192
00:11:29,840 --> 00:11:32,920
Significa, literalmente, bem ao contrário de qualquer outra coisa.

193
00:11:32,920 --> 00:11:36,380
O que é um número que, por vezes, ver que é ruim? [Aluno] 404.

194
00:11:36,380 --> 00:11:39,860
Arquivo de 404, não foi encontrado, 403 você pode estar deparando com já,

195
00:11:39,860 --> 00:11:43,660
o que é proibido, o que significa que você esqueceu de chmod alguma coisa, o mais provável.

196
00:11:43,660 --> 00:11:45,190
E há um monte de outros.

197
00:11:45,190 --> 00:11:47,760
>> Aqui, isso é um pouco louco.

198
00:11:47,760 --> 00:11:52,340
Eu realmente só escrevi este arquivo há alguns minutos colando-gedit.

199
00:11:52,340 --> 00:11:57,100
Por que essa página expirar em 1981, antes que realmente era um Web?

200
00:11:58,010 --> 00:12:00,730
O que está acontecendo lá?

201
00:12:00,730 --> 00:12:04,390
>> [Resposta do aluno inaudível] O carimbo de tempo. Mas por quê?

202
00:12:06,110 --> 00:12:09,120
É um tanto arbitrária, mas é realmente útil.

203
00:12:09,120 --> 00:12:15,500
O que isto está dizendo para o meu navegador é o arquivo PHP que você acabou solicitado já expirou.

204
00:12:15,500 --> 00:12:18,580
Na verdade, ele expirou há 30 anos.

205
00:12:18,580 --> 00:12:20,260
Mas o que isso realmente significa?

206
00:12:20,260 --> 00:12:22,500
Significa apenas que a próxima vez que o usuário visita esta página,

207
00:12:22,500 --> 00:12:25,540
seja por recarga ou digitando a URL na barra de endereços,

208
00:12:25,540 --> 00:12:28,010
certifique-se de ir buscar uma nova cópia do mesmo.

209
00:12:28,010 --> 00:12:30,840
Esta é uma espécie de um exemplo de bloqueio de cache,

210
00:12:30,840 --> 00:12:33,790
uma palavra estúpida que significa apenas tentando desencorajar navegadores

211
00:12:33,790 --> 00:12:37,260
realmente de HTML cache que foi enviada a partir de um servidor

212
00:12:37,260 --> 00:12:41,490
para que você não acidentalmente atingido recarga e depois ver a mesma versão do arquivo.

213
00:12:41,490 --> 00:12:43,730
Você realmente quer que o servidor para enviar uma nova cópia.

214
00:12:43,730 --> 00:12:47,440
Assim, o fato de que é 1981 apenas significa que é o que o aparelho é escolher

215
00:12:47,440 --> 00:12:50,280
como uma data arbitrária no passado.

216
00:12:50,280 --> 00:12:53,380
Mas a linha real suculento agora é este.

217
00:12:53,380 --> 00:12:57,550
Mesmo antes de 50 você provavelmente vagamente familiarizado com cookies.

218
00:12:57,550 --> 00:13:01,820
A partir de agora, especialmente entre aqueles menos confortável ou no meio,

219
00:13:01,820 --> 00:13:04,120
o que é um cookie no seu entendimento agora

220
00:13:04,120 --> 00:13:06,980
mesmo que estamos prestes a fazer o seu entendimento mais técnico?

221
00:13:08,150 --> 00:13:10,070
O que é um cookie? Sim.

222
00:13:10,070 --> 00:13:13,890
[Estudante] Informações sobre o usuário, como se eles já escreveram seu nome de usuário ou algo assim.

223
00:13:13,890 --> 00:13:17,370
>> Bom. É a informação sobre o usuário, se digitou seu nome de usuário já.

224
00:13:17,370 --> 00:13:21,190
Os cookies são um meio pelo qual os servidores podem se lembrar de algo sobre um usuário.

225
00:13:21,190 --> 00:13:25,810
E o que é realmente um cookie é um arquivo de texto ou uma sequência de bytes

226
00:13:25,810 --> 00:13:28,340
que é plantado pelo servidor dentro do seu navegador,

227
00:13:28,340 --> 00:13:31,960
e dentro desse arquivo ou entre os bytes é algum tipo de identificador.

228
00:13:31,960 --> 00:13:35,640
Talvez seja literalmente seu nome de usuário, mas mais frequentemente é algo mais crítico para o futuro

229
00:13:35,640 --> 00:13:43,700
como esta coisa aqui - bo8dal3ct e assim por diante - este realmente grande seqüência alfanumérica

230
00:13:43,700 --> 00:13:47,050
isso é realmente apenas para ser um identificador único para você.

231
00:13:47,050 --> 00:13:49,790
Ou você pode pensar nisso como uma espécie de selo de mão virtual.

232
00:13:49,790 --> 00:13:53,020
Se você vai para algum clube ou um parque de diversões, para lembrar que você realmente paga

233
00:13:53,020 --> 00:13:55,850
e se foram, eles colocar uma etiqueta vermelha em sua mão de algum tipo,

234
00:13:55,850 --> 00:13:59,270
e que lembra as pessoas no balcão que você já pagou

235
00:13:59,270 --> 00:14:01,340
e você pode ir e vir como quiser.

236
00:14:01,340 --> 00:14:04,250
Cookies são um pouco semelhante em espírito a isso.

237
00:14:04,250 --> 00:14:08,070
A primeira vez que visitei o site, como eu fiz depois de limpar o cache,

238
00:14:08,070 --> 00:14:11,620
o servidor web, o aparelho, neste caso, colocar um selo na minha mão

239
00:14:11,620 --> 00:14:15,030
cujo nome é PHPSESSID, sessão ID,

240
00:14:15,030 --> 00:14:18,260
cujo valor é esta seqüência alfanumérica muito longo.

241
00:14:18,260 --> 00:14:22,470
>> Então essa é agora uma espécie de estampada em minha mão para que da próxima vez eu bati recarregar

242
00:14:22,470 --> 00:14:25,230
ou manualmente visitar esta URL em um navegador,

243
00:14:25,230 --> 00:14:29,230
meu navegador por definição de HTTP vai apresentar o selo de mão

244
00:14:29,230 --> 00:14:31,940
de novo e de novo e de novo.

245
00:14:31,940 --> 00:14:34,550
Assim, mesmo que o servidor não necessariamente sabem quem eu sou,

246
00:14:34,550 --> 00:14:39,610
eles pelo menos sabem que eu sou o mesmo usuário, ou pelo menos, mais especificamente, o mesmo navegador.

247
00:14:39,610 --> 00:14:45,660
E por isso esta é, em última análise como a superglobal sessão é implementada.

248
00:14:45,660 --> 00:14:51,200
O servidor não tem idéia de quem você é quando você visita um website para a segunda ou terceira vez

249
00:14:51,200 --> 00:14:53,410
se não apresentar este selo mão.

250
00:14:53,410 --> 00:14:55,530
E assim que você apresentar esse selo de mão,

251
00:14:55,530 --> 00:14:59,370
o servidor web, essencialmente, vai para um banco de dados pouco de sua própria

252
00:14:59,370 --> 00:15:06,040
e cheques, bem, acabo de ver o selo de mão de bo8dal3ct usuário e assim por diante.

253
00:15:06,040 --> 00:15:09,850
Deixe-me ver as informações que o programador tenha armazenado

254
00:15:09,850 --> 00:15:12,380
interior da superglobal sobre esse usuário,

255
00:15:12,380 --> 00:15:17,000
e então deixe-me garantir que esses dados são novamente dentro da SESSÃO superglobal

256
00:15:17,000 --> 00:15:19,830
para que o programador pode voltar a acessar esses dados

257
00:15:19,830 --> 00:15:23,360
mesmo que foi definido alguns minutos ou horas atrás.

258
00:15:23,360 --> 00:15:26,150
Então, em outras palavras, cookies, o que causa uma má reputação por algum tempo

259
00:15:26,150 --> 00:15:29,990
por causa da insegurança em navegadores e eles podem realmente violam nossa privacidade e tudo isso,

260
00:15:29,990 --> 00:15:31,900
eles realmente têm grande utilidade, porque sem eles

261
00:15:31,900 --> 00:15:36,110
você iria ser constantemente login em cada página do Facebook que você visita

262
00:15:36,110 --> 00:15:40,680
ou e-mail a cada Gmail você lê se o navegador não tiver alguma forma de lembrar

263
00:15:40,680 --> 00:15:43,320
que você já autenticado.

264
00:15:43,320 --> 00:15:46,640
>> Assim, deste modo os cookies são enviados e para trás através do fio.

265
00:15:46,640 --> 00:15:52,470
Outra curiosidade sobre os cookies, especialmente aqui, é que este é totalmente em texto puro.

266
00:15:52,470 --> 00:15:54,930
Não há criptografia acontecendo aqui qualquer,

267
00:15:54,930 --> 00:15:57,240
e na verdade eu estou usando HTTP no momento.

268
00:15:57,240 --> 00:16:00,890
Um dos momentos favoritos em CS50, que agora é de 2 anos,

269
00:16:00,890 --> 00:16:04,750
foi na época uma ferramenta chamada Firesheep saiu.

270
00:16:04,750 --> 00:16:08,320
Esta foi uma peça de software livre que foi feita por um pesquisador de segurança

271
00:16:08,320 --> 00:16:13,250
como uma chamada de despertar para a comunidade para dizer o quão atroz implementado

272
00:16:13,250 --> 00:16:17,900
mecanismos de autenticação certos na Web eram.

273
00:16:17,900 --> 00:16:22,880
Então, por algum tempo, o Facebook foi quase inteiramente sobre HTTP, HTTPS não.

274
00:16:22,880 --> 00:16:25,640
E mesmo se você não tem idéia de como funciona a criptografia, S é seguro

275
00:16:25,640 --> 00:16:27,950
então isso significa que há pelo menos alguns criptografia envolvidos.

276
00:16:27,950 --> 00:16:30,610
Facebook foi usado para criptografar os nomes de usuário e senhas,

277
00:16:30,610 --> 00:16:33,560
mas, logo que você olhou para o seu cutuca ou mensagens ou o seu feed de notícias,

278
00:16:33,560 --> 00:16:35,360
tudo isso foi sem criptografia.

279
00:16:35,360 --> 00:16:37,870
Assim foi o Gmail até que apenas um ano ou dois atrás.

280
00:16:37,870 --> 00:16:41,100
Toda vez que você logado, sim, eles usaram criptografia segura

281
00:16:41,100 --> 00:16:44,300
mas depois disso eles não fizeram. E por que seria?

282
00:16:44,300 --> 00:16:49,210
Porque não usar a criptografia de todos os tempos em casos de uso como esta?

283
00:16:49,210 --> 00:16:53,700
O que é isso? Acho que ouvi alguma coisa. [Aluno] Speed.

284
00:16:53,700 --> 00:16:56,250
Velocidade, certo? Existem maneiras de contornar isso.

285
00:16:56,250 --> 00:16:59,610
Mas se você só tipo de pensar logicamente, se você criptografar alguma coisa,

286
00:16:59,610 --> 00:17:01,820
você tem que fazer pelo menos um pouco mais trabalho.

287
00:17:01,820 --> 00:17:05,460
Em pset 2 quando você implementou César ou Vigenère ou mesmo de crack,

288
00:17:05,460 --> 00:17:07,760
apenas imprimir uma string é relativamente fácil.

289
00:17:07,760 --> 00:17:12,040
Criptografar e, em seguida, imprimir uma string requer no mínimo um pouco mais trabalho.

290
00:17:12,040 --> 00:17:14,520
>>  Para super sites populares como o Google eo Facebook,

291
00:17:14,520 --> 00:17:18,839
se você tem que fazer mais trabalho para cada usuário para cada única página da web que visita,

292
00:17:18,839 --> 00:17:20,520
que só tem mais tempo de CPU.

293
00:17:20,520 --> 00:17:22,920
E se precisar de mais tempo de CPU, você pode precisar de mais servidores,

294
00:17:22,920 --> 00:17:24,270
que significa que você pode precisar de mais dinheiro.

295
00:17:24,270 --> 00:17:27,579
E assim por muitos anos isso só realmente não foi a melhor prática.

296
00:17:27,579 --> 00:17:31,440
As pessoas usam criptografia SSL apenas quando necessário.

297
00:17:31,440 --> 00:17:34,960
Mas acabou, e como esse sujeito com Firesheep fez super claro,

298
00:17:34,960 --> 00:17:37,920
quando vocês que estão atualmente no Facebook agora -

299
00:17:37,920 --> 00:17:39,880
A título de curiosidade, vamos ver se você vai confessar.

300
00:17:39,880 --> 00:17:42,620
Se você está no Facebook agora em algum guia, mesmo se ele não está em primeiro plano,

301
00:17:42,620 --> 00:17:46,610
é a sua URL HTTP ou HTTPS?

302
00:17:46,610 --> 00:17:50,560
[Vários alunos] S. S? [Risos]

303
00:17:50,560 --> 00:17:55,510
Okay. Qualquer HTTP? Apenas um? Okay.

304
00:17:55,510 --> 00:17:58,940
Então, todos nós podemos hackear conta do cara Facebook agora.

305
00:17:58,940 --> 00:18:04,100
Para a maior parte, esta tornou-se ativado por padrão, pelo menos em alguns sites.

306
00:18:04,100 --> 00:18:08,120
E longa história curta, se o seu tráfego na web não é criptografado,

307
00:18:08,120 --> 00:18:12,960
não só o HTML ir e voltar entre as WiFis não criptografados,

308
00:18:12,960 --> 00:18:16,760
assim que as coisas como cookies ir e voltar todo o ar

309
00:18:16,760 --> 00:18:18,940
sem qualquer forma de criptografia.

310
00:18:18,940 --> 00:18:23,540
Então se você tem um pouco de habilidade de programação ou um pouco de pesquisando habilidades

311
00:18:23,540 --> 00:18:27,410
para encontrar software gratuito que faz isso, tudo que você tem a fazer é sentar no Starbucks

312
00:18:27,410 --> 00:18:30,680
ou sentar em um aeroporto, onde há geralmente não criptografadas WiFi

313
00:18:30,680 --> 00:18:36,070
e só ver palavras-chave como Set-Cookie: PHPSESSID ou

314
00:18:36,070 --> 00:18:39,300
porque se você tem o conhecimento técnico para apenas observar o WiFi

315
00:18:39,300 --> 00:18:43,010
para todos os bits que fluem ao longo do ar por este padrão,

316
00:18:43,010 --> 00:18:50,840
Você pode, então, dizer que PHPSESSID cara passa a ser bo8dal e assim por diante.

317
00:18:50,840 --> 00:18:53,890
E, novamente, se você for suficientemente conhecimento técnico ou ter a ferramenta certa,

318
00:18:53,890 --> 00:18:58,890
você pode apenas reconfigurar o seu próprio navegador que comece a apresentar esse selo de mão

319
00:18:58,890 --> 00:19:05,030
para o Facebook.com, Facebook e só vai assumir que você é o cara

320
00:19:05,030 --> 00:19:09,880
porque tudo o que eles não sabem é quem você é, mas que você tem esse identificador exclusivo.

321
00:19:09,880 --> 00:19:14,650
Então, se você roubar o identificador único e apresentá-lo para o servidor web, como o seu próprio,

322
00:19:14,650 --> 00:19:16,860
eles estão indo só para mostrar a você que a pessoa de alimentação de notícias

323
00:19:16,860 --> 00:19:18,980
ou daquela pessoa mensagens ou puxões.

324
00:19:18,980 --> 00:19:23,190
>> E eu gostaria de Google agora como ativar HTTPS para o Facebook talvez.

325
00:19:23,190 --> 00:19:25,150
Mas é realmente tão simples como isso.

326
00:19:25,150 --> 00:19:27,660
E assim o Facebook eo Google e outros ficaram muito bom nisso,

327
00:19:27,660 --> 00:19:31,870
mas manter um olho para fora tudo o mais para os sites que você visita que não usam HTTP

328
00:19:31,870 --> 00:19:35,020
e ter algum tipo de informação sensível sobre eles,

329
00:19:35,020 --> 00:19:37,490
se é financeira ou pessoal ou similares.

330
00:19:37,490 --> 00:19:43,180
Se eles não estão usando isso, muito possivelmente pode biscoitos como este ser facilmente roubado

331
00:19:43,180 --> 00:19:46,270
e depois forjado, e isso é exatamente o que Firesheep fez.

332
00:19:46,270 --> 00:19:48,250
Você não tem que ser um programador.

333
00:19:48,250 --> 00:19:51,680
Tudo o que tinha a fazer era ter uma ligação à Internet, baixe essa ferramenta gratuita,

334
00:19:51,680 --> 00:19:56,490
eo que ele gostaria de fazer é que você faça o login e, em seguida, ele iria mostrar-lhe os nomes Facebook

335
00:19:56,490 --> 00:20:00,170
de todos na Sanders, nesta demonstração particular, em torno de você

336
00:20:00,170 --> 00:20:03,260
e tudo o que tinha a fazer era clicar em seu nome e do software automatizou o processo de

337
00:20:03,260 --> 00:20:05,970
de cheirar aquele biscoito, apresentando-a como seu próprio Facebook,

338
00:20:05,970 --> 00:20:07,990
e, voilà, você está logado pol

339
00:20:07,990 --> 00:20:11,190
Portanto, este é mais um daqueles "não faça isso" oficialmente.

340
00:20:11,190 --> 00:20:14,660
Se você tem sua rede própria casa e você quer mexer, por todos os meios,

341
00:20:14,660 --> 00:20:17,530
mas percebe isso faz cruzar a linha em um ambiente universitário.

342
00:20:17,530 --> 00:20:20,030
>> Mas o objetivo aqui é realmente para enfatizar não como fazer isso

343
00:20:20,030 --> 00:20:22,320
mas como se defender contra esses tipos de coisas.

344
00:20:22,320 --> 00:20:26,180
E a solução trivial aqui, mesmo que em si é falho,

345
00:20:26,180 --> 00:20:31,360
é realmente reduzir o uso de quaisquer sites que não estão usando HTTPS constantemente.

346
00:20:31,360 --> 00:20:34,520
Assim, sites como Facebook e Google têm cada vez mais caixas

347
00:20:34,520 --> 00:20:36,200
onde você pode optar por este tipo de coisa,

348
00:20:36,200 --> 00:20:40,000
e os bancos tiveram isso há anos por razões semelhantes.

349
00:20:40,000 --> 00:20:43,580
Então, um pouco de um fator de medo, se pudermos. Mas é isso em poucas palavras.

350
00:20:43,580 --> 00:20:46,420
É assim que um servidor se lembra de quem você é.

351
00:20:46,420 --> 00:20:50,760
E assim que eles podem se lembrar quem você é, eles podem se lembrar de nada sobre você

352
00:20:50,760 --> 00:20:56,140
que o programador tenha armazenado dentro deste superglobal especial chamada $ _SESSION.

353
00:20:56,140 --> 00:20:59,750
E para pset sete estamos usando isso trivialmente apenas para lembrar um int,

354
00:20:59,750 --> 00:21:02,260
ou seja, o ID único do usuário que fez login,

355
00:21:02,260 --> 00:21:05,880
de modo que sabemos que eles estiveram lá antes.

356
00:21:05,880 --> 00:21:12,450
Quaisquer perguntas, então em sessões ou cookies ou similares?

357
00:21:12,450 --> 00:21:15,130
Firesheep não funciona tão bem mais,

358
00:21:15,130 --> 00:21:18,310
e você tem que colocar o computador em um modo especial promíscuo

359
00:21:18,310 --> 00:21:20,700
então você está realmente ouvindo para o tráfego além de si mesmos.

360
00:21:20,700 --> 00:21:23,940
Então se você está atualmente download Firesheep, percebe que não é tão fácil

361
00:21:23,940 --> 00:21:26,850
como era antes de demonstrar.

362
00:21:26,850 --> 00:21:29,070
Tudo bem. E não fazê-lo em Sanders. Fazê-lo em casa.

363
00:21:29,070 --> 00:21:30,890
Bancos de dados.

364
00:21:30,890 --> 00:21:33,580
Uma das coisas que fez em 7 pset muito deliberadamente

365
00:21:33,580 --> 00:21:37,780
foi nós damos-lhe uma tabela de banco de dados de amostra para os usuários que tem alguns IDs de usuário,

366
00:21:37,780 --> 00:21:41,020
alguns nomes de usuário e senhas criptografadas alguns nele contidas.

367
00:21:41,020 --> 00:21:44,520
E como você vai ver, se você não tiver, você vai ter que alterar a tabela um pouco.

368
00:21:44,520 --> 00:21:47,710
Você vai ter que adicionar um pouco de cache para cada um dos usuários dessa tabela,

369
00:21:47,710 --> 00:21:51,130
e você vai ter que adicionar uma outra tabela de histórico, uma mesa de carteiras,

370
00:21:51,130 --> 00:21:53,310
ou talvez chamar-lhe outra coisa.

371
00:21:53,310 --> 00:21:56,740
Mas em termos de pensar em como fazer isso, vamos abrir esta ferramenta

372
00:21:56,740 --> 00:22:00,570
o que foi usado na sexta-feira, mas se não conhece, o aparelho vem com uma ferramenta

373
00:22:00,570 --> 00:22:04,680
chamada phpMyAdmin, que é coincidentemente escrito em PHP,

374
00:22:04,680 --> 00:22:07,950
mas seu propósito na vida, depois de eu entrar aqui como jharvard de carmesim,

375
00:22:07,950 --> 00:22:15,160
é dar-me uma maneira amigável de visualizar e alterar meu banco de dados.

376
00:22:15,160 --> 00:22:18,040
>> O banco de dados que eu estou correndo no aparelho é chamado MySQL.

377
00:22:18,040 --> 00:22:23,420
Isto é muito popular, e é um banco de dados de fonte aberta livre que é maravilhosamente fácil de usar,

378
00:22:23,420 --> 00:22:25,620
especialmente com front-ends como este.

379
00:22:25,620 --> 00:22:29,350
O que esta ferramenta permite que eu faça, por exemplo, é cotovelada em torno de mesas.

380
00:22:29,350 --> 00:22:30,890
Deixe-me ir em frente e fazer isso.

381
00:22:30,890 --> 00:22:36,580
Na sexta-feira, criamos uma tabela chamada alunos que foi super simples.

382
00:22:36,580 --> 00:22:41,680
Ele tinha três colunas - id, nome, e-mail - e inseridos manualmente um par de linhas

383
00:22:41,680 --> 00:22:44,420
como David e Mike neste exemplo em particular.

384
00:22:44,420 --> 00:22:47,290
Vamos levar isso um pouco mais, e vamos supor que queremos lembrar mais

385
00:22:47,290 --> 00:22:49,660
que apenas o nome e e-mail sobre um usuário.

386
00:22:49,660 --> 00:22:53,090
Deixe-me clique aqui Estrutura no topo.

387
00:22:53,090 --> 00:22:55,440
E, novamente, o pset percorre as medidas necessárias aqui,

388
00:22:55,440 --> 00:22:58,150
então não se preocupe se alguns isso é um pouco rápido.

389
00:22:58,150 --> 00:22:59,690
Então eu vou para clicar aqui.

390
00:22:59,690 --> 00:23:02,270
Eu estou indo para adicionar um número de colunas após e-mail

391
00:23:02,270 --> 00:23:04,130
porque eu quero adicionar algo como casa.

392
00:23:04,130 --> 00:23:06,640
Esqueci de registrar a casa de um aluno.

393
00:23:06,640 --> 00:23:11,400
Deixe-me clique em Ir, e agora temos esta forma que, infelizmente, é um pouco largo da esquerda para a direita,

394
00:23:11,400 --> 00:23:13,710
mas eu vou chamar o nome desta casa de campo,

395
00:23:13,710 --> 00:23:16,050
e então o tipo que agora tenho que escolher.

396
00:23:16,050 --> 00:23:18,870
Portanto, vamos ter uma breve conversa sobre os vários tipos em MySQL

397
00:23:18,870 --> 00:23:24,590
porque enquanto o PHP é fracamente tipado e que tipo de joga rápido e solto com os tipos,

398
00:23:24,590 --> 00:23:29,430
em um banco de dados especial que é super importante para realmente usar digitação para a sua vantagem

399
00:23:29,430 --> 00:23:33,260
porque uma das coisas MySQL e outros bancos de dados pode fazer por você

400
00:23:33,260 --> 00:23:37,910
é garantir que você não colocar dados falsos em seu banco de dados.

401
00:23:37,910 --> 00:23:41,850
Este é o tipo de erro corrente livre disponível para você.

402
00:23:41,850 --> 00:23:46,250
>> Para a casa que, obviamente, não quero que seja um int, que é um valor de 32 bits em MySQL.

403
00:23:46,250 --> 00:23:49,810
Fizemos falar brevemente na sexta-feira sobre varchar, que significa comprimento variável char.

404
00:23:49,810 --> 00:23:54,720
O que é isso? Isso permite que você especifique que você quer que isso seja uma seqüência de algum tipo.

405
00:23:54,720 --> 00:23:56,840
Você realmente não sabe de antemão quanto tempo é,

406
00:23:56,840 --> 00:24:00,100
então vamos arbitrariamente dizer um nome de casa pode ser de 255 caracteres,

407
00:24:00,100 --> 00:24:04,190
mas você pode ir com 32, 64 - qualquer número realmente.

408
00:24:04,190 --> 00:24:10,700
Mas a vantagem de usar um varchar sobre um campo chamado char é o que?

409
00:24:10,700 --> 00:24:15,110
Apenas intuitivamente se eu rolar por aqui, perceber que há char e há varchar.

410
00:24:15,110 --> 00:24:19,520
Varchar é de comprimento variável char; char é um comprimento fixo char.

411
00:24:19,520 --> 00:24:24,730
Assim, com base apenas no que definição, qual é a vantagem ou desvantagem de cada uma delas?

412
00:24:24,730 --> 00:24:30,490
Em outras palavras, que se preocupa com a distinção, ou por que você se importa?

413
00:24:31,660 --> 00:24:35,750
>> Sim. [Aluno] Varchar tem mais flexibilidade, mas ocupa mais memória.

414
00:24:35,750 --> 00:24:40,730
Bom. Varchar ocupa mais - Vamos ver. Eu não tenho certeza se eu ouvisse esse direito.

415
00:24:40,730 --> 00:24:42,360
Você pode dizer que mais uma vez?

416
00:24:42,360 --> 00:24:45,850
[Aluno] eu disse varchar, provavelmente, tem mais flexibilidade, mas é preciso mais memória.

417
00:24:45,850 --> 00:24:51,170
Interessante. Okay. Varchar provavelmente lhe dá mais flexibilidade, mas ocupa mais memória.

418
00:24:51,170 --> 00:24:53,220
O último não é necessariamente verdade.

419
00:24:53,220 --> 00:24:56,290
Ele depende do contexto, mas vamos voltar a isso.

420
00:24:56,290 --> 00:25:03,230
>> [Resposta do aluno inaudível] Exatamente.

421
00:25:03,230 --> 00:25:06,900
É realmente o caso que char vai utilizar mais memória

422
00:25:06,900 --> 00:25:10,950
porque um char, como em C, é como uma corda, que é uma matriz de caracteres.

423
00:25:10,950 --> 00:25:13,690
Então, se você diz que um campo char de tamanho 255,

424
00:25:13,690 --> 00:25:16,910
o banco de dados é, literalmente, vai dar-lhe 255 caracteres.

425
00:25:16,910 --> 00:25:22,290
E se a casa acaba sendo personagens Mather e 6 total,

426
00:25:22,290 --> 00:25:25,090
você está perdendo mais de 200 caracteres.

427
00:25:25,090 --> 00:25:29,640
>> Assim, um varchar efetivamente utiliza apenas quantos caracteres é necessário

428
00:25:29,640 --> 00:25:31,590
até um montante máximo.

429
00:25:31,590 --> 00:25:35,470
Mas o preço que você paga é realmente desempenho, potencialmente.

430
00:25:35,470 --> 00:25:39,740
Se você sabe de antemão que todas as cordas vão ser 8 caracteres -

431
00:25:39,740 --> 00:25:43,090
Por exemplo, suponha que você requerem senhas de comprimento 8 -

432
00:25:43,090 --> 00:25:47,350
A vantagem de usar um campo char na ocasião, embora muitas vezes não,

433
00:25:47,350 --> 00:25:51,100
é especificar um comprimento fixo para algo como uma senha

434
00:25:51,100 --> 00:25:53,300
porque agora o banco de dados pode ser ainda mais inteligente.

435
00:25:53,300 --> 00:25:58,160
Se ele sabe que todos os campos char, cada corda em uma coluna é o mesmo comprimento,

436
00:25:58,160 --> 00:26:00,780
você recebe de volta o recurso de acesso aleatório.

437
00:26:00,780 --> 00:26:05,110
Você pode pular entre os vários campos de char na sua tabela de base de dados

438
00:26:05,110 --> 00:26:07,940
porque pensar de um banco de dados como linhas e colunas.

439
00:26:07,940 --> 00:26:11,670
Então, se cada uma das cadeias é o mesmo comprimento,

440
00:26:11,670 --> 00:26:17,820
você sabe que o primeiro é no byte 0, a próxima é a de 8 bytes

441
00:26:17,820 --> 00:26:20,240
e, em seguida, 16 e, em seguida, 24 e assim por diante.

442
00:26:20,240 --> 00:26:24,500
Então, se todas as cordas são do mesmo comprimento, você pode pular muito mais eficiente.

443
00:26:24,500 --> 00:26:26,710
De modo que pode ser uma vantagem em termos de desempenho,

444
00:26:26,710 --> 00:26:29,420
mas normalmente você não tem o luxo de saber com antecedência,

445
00:26:29,420 --> 00:26:32,170
assim um varchar é o caminho a percorrer.

446
00:26:32,170 --> 00:26:36,030
Aqui está outro detalhe que mesmo Facebook correu para eventualmente.

447
00:26:36,030 --> 00:26:39,670
Ints são grandes, e que tipo de usá-los por padrão toda vez que precisa de um número,

448
00:26:39,670 --> 00:26:41,750
mas é apenas 32 bits.

449
00:26:41,750 --> 00:26:46,210
>> E mesmo que o Facebook não consegue ter 4 bilhões de usuários, agora,

450
00:26:46,210 --> 00:26:48,680
há definitivamente algumas pessoas lá fora com várias contas

451
00:26:48,680 --> 00:26:50,960
ou contas que foram abertas e, em seguida, fechado,

452
00:26:50,960 --> 00:26:55,130
e assim o próprio Facebook Acredito alguns anos atrás tinha a transição de int

453
00:26:55,130 --> 00:27:00,010
para, como é apropriadamente chamado bigint, que fica apenas a 64 bits em vez.

454
00:27:00,010 --> 00:27:02,230
Portanto, esta também é uma decisão de design.

455
00:27:02,230 --> 00:27:06,570
Você seria incrivelmente sorte se seu projeto final se transforma inicialização,

456
00:27:06,570 --> 00:27:10,010
tem 4 bilhões e um usuários, mais ou menos,

457
00:27:10,010 --> 00:27:13,200
caso em que ints pode ser um pouco míope.

458
00:27:13,200 --> 00:27:16,230
Mas, na realidade, sua tabela de usuários é provavelmente bem com ints.

459
00:27:16,230 --> 00:27:19,340
Mas para algo como 7 pset, como sua tabela de histórico,

460
00:27:19,340 --> 00:27:23,700
você pode ter milhares, milhões de usuários se você evoluir para etrade.com.

461
00:27:23,700 --> 00:27:26,020
Assim, enquanto você não pode ter mais de 4 bilhões de usuários,

462
00:27:26,020 --> 00:27:30,070
aqueles usuários que você tem pode ter mais de 4 bilhões de transações ao longo do tempo -

463
00:27:30,070 --> 00:27:33,200
compra e vende e as coisas em sua história.

464
00:27:33,200 --> 00:27:38,090
Então, se você faz antecipar - de novo, esses são bons problemas para ter se você tem esta quantidade de dados -

465
00:27:38,090 --> 00:27:40,920
se você antecipar dados que excedem o tamanho de um int,

466
00:27:40,920 --> 00:27:47,740
indo com algo como bigint é uma direção, não com freqüência suficiente adotado por designers

467
00:27:47,740 --> 00:27:49,710
porque as pessoas figura que não vai ser um problema,

468
00:27:49,710 --> 00:27:51,930
mas é tão fácil de escolher algo maior do que isso.

469
00:27:51,930 --> 00:27:55,380
Decimal que estamos usando no pset 7, que especifica precisão fixa

470
00:27:55,380 --> 00:27:59,840
assim você pode evitar as questões que envolvem carros alegóricos e de duplas e reais e similares.

471
00:27:59,840 --> 00:28:02,440
>> E depois há outros campos aqui. Vamos agitar as mãos para eles de alguma forma.

472
00:28:02,440 --> 00:28:07,270
Mas as datas, horários todos têm um formato prescrito no MySQL,

473
00:28:07,270 --> 00:28:10,830
ea vantagem de armazenar datas como datas e não VARCHARs

474
00:28:10,830 --> 00:28:15,730
significa que a base de dados pode, na verdade, reformatar-los em diferentes formatos,

475
00:28:15,730 --> 00:28:18,800
se um formato EUA ou formato europeu ou similar - no entanto, você quer que ele -

476
00:28:18,800 --> 00:28:22,700
muito mais eficiente do que se fosse apenas alguns varchar genérico.

477
00:28:22,700 --> 00:28:25,150
E depois há alguns outros binários, varbinary, blobs.

478
00:28:25,150 --> 00:28:28,580
Estes são objetos binários grandes, e você também pode armazenar dados binários

479
00:28:28,580 --> 00:28:30,750
bem como os dados geométricos de um banco de dados.

480
00:28:30,750 --> 00:28:34,350
Mas para nós, vamos normalmente se preocupam com ints e VARCHAR e similares.

481
00:28:34,350 --> 00:28:36,230
Vamos terminar este exemplo com a casa.

482
00:28:36,230 --> 00:28:40,030
Casa eu vou dizer será arbitrariamente 255 caracteres.

483
00:28:40,030 --> 00:28:42,850
Então o valor padrão que poderia fazer isso.

484
00:28:42,850 --> 00:28:47,440
Poderíamos, por padrão colocar todos em Mather House, por exemplo.

485
00:28:47,440 --> 00:28:49,710
É assim que nós pode especificar que o banco de dados

486
00:28:49,710 --> 00:28:52,460
devem assegurar que alguém tem sempre um valor. Mas vou deixar que seja.

487
00:28:52,460 --> 00:28:55,270
Na verdade, para as pessoas que vivem fora do campus e não em uma casa,

488
00:28:55,270 --> 00:28:59,590
talvez eu realmente quero especificar que o valor padrão para casa é NULL,

489
00:28:59,590 --> 00:29:04,890
e então eu preciso verificar esta caixa e dizer o banco de dados que está tudo bem se a casa do usuário é NULL.

490
00:29:04,890 --> 00:29:07,270
>> Mais uma vez, este é um outro mecanismo de defesa que você pode colocar em prática

491
00:29:07,270 --> 00:29:10,590
assim você não precisa nem de colocá-lo em seu código PHP necessariamente.

492
00:29:10,590 --> 00:29:14,630
O banco de dados irá garantir que as coisas são ou não são NULL.

493
00:29:14,630 --> 00:29:17,310
E então, finalmente, Atributos.

494
00:29:17,310 --> 00:29:18,920
Nenhum destes são realmente relevantes.

495
00:29:18,920 --> 00:29:22,880
Binário, não assinado - nenhum deles são relevantes para um varchar.

496
00:29:22,880 --> 00:29:24,220
Índice.

497
00:29:24,220 --> 00:29:27,320
Alguém sabe ou se lembra ou tem um palpite sobre o que é um índice

498
00:29:27,320 --> 00:29:29,510
para algo como casa?

499
00:29:29,510 --> 00:29:35,240
Isto também é, na verdade, uma decisão de projeto importante e relativamente fácil.

500
00:29:35,240 --> 00:29:39,200
Para quem ainda não viu, na sexta-feira que falou brevemente sobre chaves primárias.

501
00:29:39,200 --> 00:29:43,240
Em uma tabela de banco de dados, uma chave primária é o campo ou coluna

502
00:29:43,240 --> 00:29:46,270
que identifica exclusivamente as linhas da tabela.

503
00:29:46,270 --> 00:29:49,150
Assim, no quadro atual temos IDs, temos nomes e e-mails.

504
00:29:49,150 --> 00:29:52,050
Qual desses é o melhor candidato para ser uma chave primária,

505
00:29:52,050 --> 00:29:55,810
cujo papel é identificar linhas?

506
00:29:55,810 --> 00:29:57,530
Provavelmente ID.

507
00:29:57,530 --> 00:29:59,930
Indiscutivelmente, nós também podemos usar o que?

508
00:29:59,930 --> 00:30:02,860
Talvez você possa usar e-mail, porque, em teoria, ele é único

509
00:30:02,860 --> 00:30:05,380
a menos que as pessoas estão compartilhando as contas de e-mail.

510
00:30:05,380 --> 00:30:09,980
Mas a realidade é que, se você estiver usando uma identificação numérica como 1234,

511
00:30:09,980 --> 00:30:14,170
isso é apenas 32 bits, enquanto um endereço de e-mail pode ser esta muitos bytes ou esta muitos bytes.

512
00:30:14,170 --> 00:30:16,610
Portanto, em termos de eficiência de identificadores únicos,

513
00:30:16,610 --> 00:30:19,270
ele tende a ser uma boa prática apenas para usar um int

514
00:30:19,270 --> 00:30:23,090
mesmo se você tiver algum candidato cadeia que sem dúvida poderia usar.

515
00:30:23,090 --> 00:30:26,760
>> Para algo como casa, isso não deve ser uma chave primária

516
00:30:26,760 --> 00:30:30,770
porque, então, apenas uma pessoa poderia viver em Mather e 1 pessoa em Currier e similares.

517
00:30:30,770 --> 00:30:32,790
Da mesma forma, isso não deve ser único.

518
00:30:32,790 --> 00:30:37,830
A diferença entre a primeira e única é a de que, no caso de a mesa de corrente,

519
00:30:37,830 --> 00:30:42,620
ID seria primário, mas e-mail não é primária para a razão que acabamos de mencionar -

520
00:30:42,620 --> 00:30:44,740
desempenho - mas ainda deve ser único.

521
00:30:44,740 --> 00:30:47,200
Então, você ainda pode impor exclusividade sem ter a pretensão

522
00:30:47,200 --> 00:30:49,520
que é um importante campo de super primária.

523
00:30:49,520 --> 00:30:52,610
Mas este é bastante útil: Index.

524
00:30:52,610 --> 00:30:56,180
Se você sabe de antemão para o seu projeto final, para pset 7, ou, em geral,

525
00:30:56,180 --> 00:30:59,480
que esta casa de campo vai ser algo que você busca em um lote

526
00:30:59,480 --> 00:31:01,910
usando a palavra-chave de seleção ou algo mais,

527
00:31:01,910 --> 00:31:05,180
então você pode dizer antecipadamente o banco de dados para trabalhar sua mágica

528
00:31:05,180 --> 00:31:10,510
e certifique-se que ele cria na memória quaisquer estruturas de dados de fantasia necessário

529
00:31:10,510 --> 00:31:13,770
para acelerar pesquisas com base em casa.

530
00:31:13,770 --> 00:31:17,860
Talvez ele vai usar uma tabela hash, talvez ele vai usar uma lista ligada.

531
00:31:17,860 --> 00:31:21,260
Na realidade, ele tende a usar uma árvore, muitas vezes chamado de uma estrutura de árvore-B -

532
00:31:21,260 --> 00:31:24,090
não uma árvore binária, mas uma árvore-B - que é uma árvore muito grande

533
00:31:24,090 --> 00:31:27,370
que você pode ver em uma classe como CS124, os dados da classe estruturas.

534
00:31:27,370 --> 00:31:31,800
Mas, em resumo, você não tem que se preocupar com isso ao usar o software de banco de dados inteligente.

535
00:31:31,800 --> 00:31:35,890
Você pode apenas dizer que, "Índice de este campo para que eu possa pesquisar sobre ele de forma mais eficiente."

536
00:31:35,890 --> 00:31:40,250
>> Se você deixar este fora e tentar pesquisar para todos no banco de dados que vive em Mather,

537
00:31:40,250 --> 00:31:42,710
ele vai transformar-se em busca linear.

538
00:31:42,710 --> 00:31:45,360
E se você tem 6.000 graduandos todos vivendo em alguma casa,

539
00:31:45,360 --> 00:31:47,900
você vai pesquisar toda a tabela para encontrar os Matherites,

540
00:31:47,900 --> 00:31:52,190
enquanto que, se você diz Index, espero que seja algo próximo a uma busca logarítmica

541
00:31:52,190 --> 00:31:54,510
para encontrar esses tipos de alunos.

542
00:31:54,510 --> 00:31:56,750
Este é apenas um recurso gratuito para ligar,

543
00:31:56,750 --> 00:31:59,530
mesmo que ele vem a um preço de uma certa quantidade de espaço.

544
00:31:59,530 --> 00:32:02,690
Por último, auto-incremento, este campo AI,

545
00:32:02,690 --> 00:32:05,830
o que significa apenas se for um int e você não quer se preocupar para incrementar você mesmo

546
00:32:05,830 --> 00:32:07,570
cada vez que há um novo usuário, verifique se,

547
00:32:07,570 --> 00:32:11,910
e cada usuário que é inserido automaticamente receberá um novo ID.

548
00:32:11,910 --> 00:32:15,620
Vamos clicar em Salvar, e agora vamos encontrar a falha com este projeto.

549
00:32:15,620 --> 00:32:20,200
Se eu entrar em Procurar, aviso de que Mike e minha casa é NULL.

550
00:32:20,200 --> 00:32:22,420
Eu posso usar o phpMyAdmin para editar manualmente.

551
00:32:22,420 --> 00:32:25,110
Eu posso ir aqui e digite Mather e pressione a tecla Enter,

552
00:32:25,110 --> 00:32:27,740
e agora observar o quadro é diferente.

553
00:32:27,740 --> 00:32:29,270
Mas repare que eu poderia fazer outra coisa também.

554
00:32:29,270 --> 00:32:33,530
ID de Davi é um, então phpMyAdmin novamente é apenas uma ferramenta administrativa;

555
00:32:33,530 --> 00:32:35,970
isso não é algo que os usuários estão indo cada vez para ver.

556
00:32:35,970 --> 00:32:38,810
Então, se eu, em vez clique na guia SQL em cima -

557
00:32:38,810 --> 00:32:41,450
e, novamente, pset 7 irá apresentá-lo para mais uma dessas consultas -

558
00:32:41,450 --> 00:32:45,260
Eu posso executar manualmente o comando de linguagem SQL Structured Query

559
00:32:45,260 --> 00:32:56,410
UPDATE users SET casa = 'Pfoho' WHERE id = 1.

560
00:32:56,410 --> 00:33:00,830
Essas consultas SQL são, bem o suficiente, bastante legível da esquerda para a direita.

561
00:33:00,830 --> 00:33:04,350
Atualizar a tabela de usuários, defina o campo chamado de casa para Pfoho

562
00:33:04,350 --> 00:33:06,830
onde ID do usuário é 1.

563
00:33:06,830 --> 00:33:11,480
Ou eu poderia até mesmo fazer, onde e-mail = 'malan@harvard.edu'.

564
00:33:11,480 --> 00:33:14,860
Enquanto que identifica comigo, que iria funcionar tão bem.

565
00:33:14,860 --> 00:33:18,810
Mas ID tende a ser maior desempenho, então vamos fazer isso.

566
00:33:18,810 --> 00:33:22,950
Vamos clique em Ir. Ok, lecture.users não existe. Qual é o meu erro?

567
00:33:22,950 --> 00:33:26,220
Qual é a tabela verdade chamado aqui?

568
00:33:26,220 --> 00:33:28,770
É chamado de alunos só porque é o que nós fizemos aqui no canto superior esquerdo.

569
00:33:28,770 --> 00:33:31,860
É chamado de estudantes, e não usuários. Então clique em Ir agora.

570
00:33:31,860 --> 00:33:34,330
Uma linha afetada. Consulta levou 0,01 segundos.

571
00:33:34,330 --> 00:33:38,010
Se eu clique em Procurar agora, agora vive em Pfoho Malan.

572
00:33:38,010 --> 00:33:42,070
Então, isso é um outro sabor de SQL, mas o pset irá orientá-lo através de um pouco mais do que isso.

573
00:33:42,070 --> 00:33:44,710
>> Há uma decisão estúpida que eu já fiz aqui.

574
00:33:44,710 --> 00:33:47,820
Eu diria que este projeto de banco de dados é ineficiente

575
00:33:47,820 --> 00:33:51,650
porque quanto mais pessoas eu adicionar à tabela alunos,

576
00:33:51,650 --> 00:33:54,730
mais de nós eu começar a adicionar, o mais das TFs eu começar a adicionar,

577
00:33:54,730 --> 00:33:58,320
vamos começar a ver o que Despedimentos na tabela?

578
00:34:00,840 --> 00:34:06,020
>> Sim. [Aluno] Vendo que ele está em estudantes, estamos usando o mesmo [inaudível]

579
00:34:06,020 --> 00:34:07,360
O mesmo - Direito, exatamente.

580
00:34:07,360 --> 00:34:10,400
Então, se 400 pessoas vivem em Mather, mais ou menos,

581
00:34:10,400 --> 00:34:15,000
eventualmente esta tabela vai ter 400 linhas que dizem "Mather", "Mather,"

582
00:34:15,000 --> 00:34:16,590
"Mather," "Mather," "Mather."

583
00:34:16,590 --> 00:34:19,820
Estamos perdendo todos esses bytes, e há um par de takeaways lá.

584
00:34:19,820 --> 00:34:23,080
1, há o caso de canto louco onde se alguém paga um monte de dinheiro

585
00:34:23,080 --> 00:34:25,949
e renomeia Mather, agora temos de mudar a nossa tabela de banco de dados inteiro.

586
00:34:25,949 --> 00:34:29,730
Isso não vai acontecer frequentemente, embora Pfoho já foi chamado de Casa do Norte há 15 anos,

587
00:34:29,730 --> 00:34:32,310
assim acontece. Mas isso não é tudo o que convincente.

588
00:34:32,310 --> 00:34:36,000
Mais convincente do que um caso como o de canto a necessidade de atualizar os dados em massa

589
00:34:36,000 --> 00:34:41,150
para um banco de dados é por que você está armazenando MATHER novo e de novo e de novo e de novo?

590
00:34:41,150 --> 00:34:43,020
Isso é um monte de caracteres, 6 caracteres.

591
00:34:43,020 --> 00:34:45,500
Não podemos fazer ainda melhor do que isso, especialmente para Pforzheimer?

592
00:34:45,500 --> 00:34:48,320
Certamente que podemos fazer melhor do que muitos personagens.

593
00:34:48,320 --> 00:34:51,790
Porque não basta associar um identificador único, com cada casa

594
00:34:51,790 --> 00:34:55,020
e loja que para cada usuário? Então, vamos tentar isso.

595
00:34:55,020 --> 00:35:00,610
Ao invés de apenas utilizar a tabela alunos, deixe-me ir para o meu banco de dados palestra aqui no canto superior esquerdo.

596
00:35:00,610 --> 00:35:02,600
Note-se aqui que diz Criar tabela.

597
00:35:02,600 --> 00:35:04,550
Deixe-me criar uma nova tabela chamada casas.

598
00:35:04,550 --> 00:35:08,880
O número de colunas que vai ser 2. Enter.

599
00:35:08,880 --> 00:35:11,200
Agora eu tenho dois campos.

600
00:35:11,200 --> 00:35:14,600
Eu vou chamar este o nome, e que vai ser um varchar de comprimento 255,

601
00:35:14,600 --> 00:35:18,770
>> mas que é bastante arbitrária. Deixe-me colocar isso aqui por convenção.

602
00:35:18,770 --> 00:35:22,840
Então coloque uma identificação aqui. Vamos dar a cada casa um identificador único.

603
00:35:22,840 --> 00:35:25,360
Vamos dar a cada casa um nome.

604
00:35:25,360 --> 00:35:30,980
Vamos especificar que o identificador será assinado apenas por convenção usar apenas números positivos.

605
00:35:30,980 --> 00:35:35,020
Vamos em frente e dar a este um campo de auto incremento para agora.

606
00:35:35,020 --> 00:35:38,160
E precisamos de mais alguma coisa?

607
00:35:38,160 --> 00:35:41,010
Vamos em frente e clique em Salvar.

608
00:35:41,010 --> 00:35:42,480
Agora eu tenho uma segunda tabela.

609
00:35:42,480 --> 00:35:45,860
Observe como um aparte este é o pouco enigmática comando SQL

610
00:35:45,860 --> 00:35:50,280
que você teria que digitar manualmente se não estiver usando uma ferramenta administrativa como phpMyAdmin.

611
00:35:50,280 --> 00:35:51,990
Portanto, outra razão que usá-lo.

612
00:35:51,990 --> 00:35:55,480
É uma espécie de maravilhosamente útil pedagogicamente, porque você pode clicar em torno de

613
00:35:55,480 --> 00:36:01,050
e descobrir como as coisas funcionam por apenas copiando e colando o phpMyAdmin fez.

614
00:36:01,050 --> 00:36:04,150
Mas o comando Criar tabela é o que foi apenas executado, e aqui é a minha mesa.

615
00:36:04,150 --> 00:36:11,370
Deixe-me ir em frente agora e usar o SQL-prima em vez de simplificar, clicando na guia Inserir.

616
00:36:11,370 --> 00:36:15,040
Deixe-me fazer INSERT INTO casas,

617
00:36:15,040 --> 00:36:22,230
e eu vou dizer o nome da casa vai ter um valor de 'Mather'.

618
00:36:22,230 --> 00:36:24,790
É isso aí. Esta sintaxe é um pouco mais enigmática.

619
00:36:24,790 --> 00:36:26,660
Este é o nome dos campos que deseja inserir.

620
00:36:26,660 --> 00:36:30,390
Estes são os valores que queremos inserir esses campos. Deixe-me clique em Ir.

621
00:36:30,390 --> 00:36:34,410
Uma linha inserida a cada 0,02 segundos. Deixe-me clique em Procurar agora.

622
00:36:34,410 --> 00:36:42,020
>> Observe se eu clique em Procurar, há Mather, cuja identificação é pela automação do número 1.

623
00:36:42,020 --> 00:36:45,000
Deixe-me fazer outro. Deixe-me ir para o guia SQL.

624
00:36:45,000 --> 00:36:52,950
INSERT INTO casas. O nome da casa vai ter um valor de Pfoho e assim por diante.

625
00:36:52,950 --> 00:36:56,350
Ir. E eu posso continuar fazendo isso de novo e de novo e de novo.

626
00:36:56,350 --> 00:36:59,470
Ou se você ficar entediado usando o phpMyAdmin, você pode apenas usar a guia Inserir

627
00:36:59,470 --> 00:37:01,000
e não ter que digitar o SQL-prima.

628
00:37:01,000 --> 00:37:04,690
Você pode apenas bater-lo mais rapidamente, digitando, por exemplo, Currier, Enter

629
00:37:04,690 --> 00:37:07,610
e agora, se clicar em Procurar, há Currier com um ID de 3.

630
00:37:07,610 --> 00:37:09,920
Então é isso que queremos dizer com auto-incremento.

631
00:37:09,920 --> 00:37:12,280
Mas agora temos que corrigir alguma coisa nos estudantes.

632
00:37:12,280 --> 00:37:16,240
Na alunos o que devem ao tipo de dados do campo casa agora?

633
00:37:16,240 --> 00:37:19,450
Ele deve ser um int, certo?

634
00:37:19,450 --> 00:37:23,950
Assim, o objectivo aqui é o de fatorar, também conhecido como normalizar, as tabelas

635
00:37:23,950 --> 00:37:27,940
de modo que nós não armazenar informações de forma redundante em qualquer um dos meus quadros.

636
00:37:27,940 --> 00:37:31,130
E, novamente, o caminho que estávamos aqui vai dizer Mather, Mather,

637
00:37:31,130 --> 00:37:34,220
Mather, Mather, Pfoho, Pfoho, Pfoho, Pfoho, que é muito redundante

638
00:37:34,220 --> 00:37:36,240
em termos de desperdício dos caracteres.

639
00:37:36,240 --> 00:37:40,820
Então deixe-me ir em frente e mudar isso clicando Estrutura,

640
00:37:40,820 --> 00:37:44,620
e deixe-me ir em frente e marcar o campo casa, clique em Alterar

641
00:37:44,620 --> 00:37:46,990
e agora eu vou mudar isso seja um int.

642
00:37:46,990 --> 00:37:49,490
255 não é mais relevante.

643
00:37:49,490 --> 00:37:54,010
Deixe-me ir em frente e dizer que está tudo bem, se ainda é NULL. Salvar.

644
00:37:54,010 --> 00:37:55,870
Agora os estudantes tabela foi alterada com sucesso,

645
00:37:55,870 --> 00:37:59,090
e observe novamente casa é um int.

646
00:37:59,090 --> 00:38:02,220
Como um aparte, ignorar o número entre parênteses quando se trata de ints.

647
00:38:02,220 --> 00:38:03,770
>> Isto é por razões de legado.

648
00:38:03,770 --> 00:38:06,920
Voltar no dia em que você não tem GUIs, em vez disso tinha um ambiente de linha de comando,

649
00:38:06,920 --> 00:38:11,580
os 10 e 11 respectivamente especificados quantos caracteres você deve mostrar

650
00:38:11,580 --> 00:38:13,950
na janela de terminal para realmente mostrar campos.

651
00:38:13,950 --> 00:38:19,150
Não tem nada a ver com o comprimento de bits do campo real, por isso vamos ignorar que, por agora.

652
00:38:19,150 --> 00:38:20,990
Agora eu tenho que ir para esta mesa.

653
00:38:20,990 --> 00:38:24,610
E se David vive em Mather, casa não deve ser 0,

654
00:38:24,610 --> 00:38:27,350
que é um valor mais próximo do padrão int NULL.

655
00:38:27,350 --> 00:38:29,810
Ele deve morar na casa de um.

656
00:38:29,810 --> 00:38:36,870
Vamos dizer arbitrariamente que vive em Mike Pfoho, para casa de número 2.

657
00:38:36,870 --> 00:38:40,160
Agora minha mesa parece um pouco mais enigmática.

658
00:38:40,160 --> 00:38:41,960
Mas considere a eficiência.

659
00:38:41,960 --> 00:38:44,860
Agora estou usando apenas 32 bits para identificar a casa,

660
00:38:44,860 --> 00:38:49,530
o que significa que há apenas uma definição canônica da minha casa Mather e Pfoho

661
00:38:49,530 --> 00:38:52,090
e que está na mesa de casas.

662
00:38:52,090 --> 00:38:55,880
Então, se eu quiser voltar agora essas tabelas, pensar desta maneira.

663
00:38:55,880 --> 00:39:01,980
Aqui eu tenho minha mesa os alunos, e no lado direito há estes números, 1 e 2.

664
00:39:01,980 --> 00:39:04,180
1 é Mather, 2 é Pfoho.

665
00:39:04,180 --> 00:39:08,580
Nós temos os mesmos números nesta tabela outro, o que é chamado de casas,

666
00:39:08,580 --> 00:39:11,020
1 e 2 e 3 para as três casas.

667
00:39:11,020 --> 00:39:14,990
O que queremos agora fazer é ter a capacidade de código, PHP e SQL,

668
00:39:14,990 --> 00:39:18,800
a sorte de juntar estas tabelas, onde se estes são os estudantes e estes são as casas,

669
00:39:18,800 --> 00:39:22,050
queremos de alguma forma combiná-los de modo que uma linha com 1,

670
00:39:22,050 --> 00:39:25,670
2 linhas com 2, e para que possamos descobrir onde David

671
00:39:25,670 --> 00:39:28,000
e onde Mike e onde toda a gente vive.

672
00:39:28,000 --> 00:39:31,850
Para fazer isso, podemos executar uma consulta SQL como o seguinte.

673
00:39:31,850 --> 00:39:40,470
SELECT * FROM alunos Cadastre casas ON -

674
00:39:40,470 --> 00:39:43,000
E agora o que os campos que queremos participar em?

675
00:39:43,000 --> 00:39:49,520
Então students.house = houses.id.

676
00:39:49,520 --> 00:39:54,150
>> Um pouco enigmático, mas esta parte significa, literalmente, criar uma nova tabela temporária

677
00:39:54,150 --> 00:39:56,690
que é o resultado da junção estudantes e casas.

678
00:39:56,690 --> 00:40:00,340
E como você quiser combinar as pontas dos meus dedos aqui?

679
00:40:00,340 --> 00:40:05,280
SET 'campo casa igual às casas "os alunos campo ID.

680
00:40:05,280 --> 00:40:10,220
E se eu agora clique em Ir, eu voltar exatamente o que eu esperava.

681
00:40:10,220 --> 00:40:15,890
Davi está em Mather, Mike está na Pfoho, e eu também ver os identificadores exclusivos.

682
00:40:15,890 --> 00:40:18,640
Mas o ponto é agora eu tenho uma tabela completa.

683
00:40:18,640 --> 00:40:23,020
E assim o takeaway aqui para pset 7 ou realmente para o projeto final:

684
00:40:23,020 --> 00:40:25,830
Se você achar que você está armazenando qualquer peça de informação redundante,

685
00:40:25,830 --> 00:40:28,850
se é uma casa, talvez seja uma cidade, estado e CEP

686
00:40:28,850 --> 00:40:32,050
onde ZIP pode, normalmente, mas nem sempre ser utilizado como um identificador único,

687
00:40:32,050 --> 00:40:35,810
não fazer o exercício mental e, depois, com algo como phpMyAdmin

688
00:40:35,810 --> 00:40:40,660
de factoring que os dados comuns, porque, especialmente como o seu site fica mais bem utilizado

689
00:40:40,660 --> 00:40:45,440
e mais popular, é assim que você se certificar de que tudo é super rápido,

690
00:40:45,440 --> 00:40:51,930
dando ao banco de dados como muitas dicas como a singularidade possível.

691
00:40:51,930 --> 00:40:53,860
Isso foi muito.

692
00:40:53,860 --> 00:40:59,010
Alguma pergunta? Tudo bem. Vamos dar um intervalo de 5 minutos lá e reagrupar.

693
00:41:01,600 --> 00:41:03,540
Tudo bem.

694
00:41:03,540 --> 00:41:08,680
A seguir, um exemplo que foi utilizado há alguns anos atrás quando eu tirei CS161,

695
00:41:08,680 --> 00:41:10,960
que é a classe operacional sistemas na faculdade

696
00:41:10,960 --> 00:41:15,160
que é conhecido por ser incrível, mas uma quantidade louca de trabalho,

697
00:41:15,160 --> 00:41:19,810
e concentra-se realmente em alguns dos problemas de baixo nível que surgem nos sistemas operativos

698
00:41:19,810 --> 00:41:22,700
e também até mesmo no mundo dos bancos de dados.

699
00:41:22,700 --> 00:41:27,040
>> A história que foi contada pelo meu professor, Margo Seltzer, esse ano foi como segue.

700
00:41:27,040 --> 00:41:30,990
Suponha que você tem uma geladeira dormitório para você e seu companheiro de quarto

701
00:41:30,990 --> 00:41:34,030
e tanto de que você realmente gosta de leite.

702
00:41:34,030 --> 00:41:36,360
Então você chega em casa do dia de classe um, o seu colega de quarto ainda não está lá,

703
00:41:36,360 --> 00:41:39,650
você abre a geladeira, e você percebe, "Oh droga, estamos fora de leite."

704
00:41:39,650 --> 00:41:42,070
Então você fechar a geladeira, você atravessar a rua para CVS

705
00:41:42,070 --> 00:41:45,830
e entrar em linhas cada vez mais longas para comprar leite na CVS.

706
00:41:45,830 --> 00:41:48,470
Enquanto isso, seu companheiro de quarto chega em casa de sua classe,

707
00:41:48,470 --> 00:41:51,690
entra no quarto, abre a geladeira realmente querendo um pouco de leite,

708
00:41:51,690 --> 00:41:54,130
abre a geladeira e "Droga, não de leite."

709
00:41:54,130 --> 00:41:57,890
Então, ele ou ela fecha a geladeira, sai pela porta, e vai para ABP

710
00:41:57,890 --> 00:42:00,910
ou em outro lugar que CVS onde você não está indo colidir uns com os outros

711
00:42:00,910 --> 00:42:02,790
para ir buscar um pouco de leite.

712
00:42:02,790 --> 00:42:04,820
É claro que alguns minutos mais tarde, tanto de você voltar para casa

713
00:42:04,820 --> 00:42:07,740
e agora você tem leite duas vezes tanto quanto você realmente queria.

714
00:42:07,740 --> 00:42:10,670
E, sendo o leite, agora ele vai ir mal, porque você gosta de leite

715
00:42:10,670 --> 00:42:14,200
mas você realmente não gosto de leite, então agora você tem muito leite, por isso vai azedar.

716
00:42:14,200 --> 00:42:16,830
Esta é uma situação terrível, terrível.

717
00:42:16,830 --> 00:42:22,920
O que poderia ter resolvido esta situação se você fosse o companheiro de quarto casa primeiro? Sim.

718
00:42:22,920 --> 00:42:25,970
[Estudante] Você deve ter deixado uma nota. [Risos]

719
00:42:25,970 --> 00:42:28,090
Bom. Você deveria ter deixado uma nota.

720
00:42:28,090 --> 00:42:32,320
Você deveria ter colocado uma nota de post-it ou o mesmo que dizer, "Gone para o leite",

721
00:42:32,320 --> 00:42:36,830
e, em seguida, seu companheiro de quarto conceitualmente teria sido trancado para fora de realmente fazer isso.

722
00:42:36,830 --> 00:42:38,010
Ou você poderia ir um passo além.

723
00:42:38,010 --> 00:42:41,060
Você pode, literalmente, bloquear o frigorífico com algum tipo de cadeado,

724
00:42:41,060 --> 00:42:44,870
e agora seu companheiro de quarto vai ser literalmente trancada para fora da geladeira.

725
00:42:44,870 --> 00:42:48,520
Se generalizarmos volta à programação,

726
00:42:48,520 --> 00:42:51,610
você quase pode pensar no frigorífico como algum tipo de variável ou uma estrutura,

727
00:42:51,610 --> 00:42:53,500
algum tipo de recipiente para informações.

728
00:42:53,500 --> 00:42:58,290
O problema fundamental aqui é que ambos foram autorizados a inspecionar

729
00:42:58,290 --> 00:43:02,370
ou ler o estado dessa estrutura de dados,

730
00:43:02,370 --> 00:43:08,050
mas você viu em momentos diferentes e ainda assim tanto de você tomou uma decisão

731
00:43:08,050 --> 00:43:11,920
com base no estado do mundo naqueles momentos diferentes no tempo.

732
00:43:11,920 --> 00:43:15,570
Então, se você tivesse trancado a geladeira, você teria pelo menos evitado seu companheiro de quarto

733
00:43:15,570 --> 00:43:19,070
de ter sido capaz de inspeccionar o estado do mundo,

734
00:43:19,070 --> 00:43:22,530
para que ele ou ela não poderia ter tomado essa decisão mesmo.

735
00:43:22,530 --> 00:43:25,780
Assim, bancos de dados, como se vê, tem esse problema constantemente.

736
00:43:25,780 --> 00:43:31,050
>> Vamos ver se podemos construir um cenário.

737
00:43:31,050 --> 00:43:34,310
Suponha que você é uma espécie de vilão e você vai para o Bank of America

738
00:43:34,310 --> 00:43:37,950
ou um dos outros lugares na praça que tem um casal ATMs lado a lado,

739
00:43:37,950 --> 00:43:41,200
e de alguma forma você descobriu como duplicar um cartão Multibanco - não tão difícil assim.

740
00:43:41,200 --> 00:43:42,730
É apenas uma fita magnética.

741
00:43:42,730 --> 00:43:45,180
E então o que você quer tentar fazer é jogar este jogo

742
00:43:45,180 --> 00:43:49,060
pelo qual você coloca um cartão em uma máquina, um outro cartão em outra máquina,

743
00:43:49,060 --> 00:43:51,980
e você, essencialmente, quer tentar retirar o dinheiro ao mesmo tempo,

744
00:43:51,980 --> 00:43:54,930
porque imaginar que a história é o seguinte.

745
00:43:54,930 --> 00:43:57,350
A máquina à esquerda leva o seu cartão e sua senha,

746
00:43:57,350 --> 00:44:00,240
e então você diz: "Dê-me US $ 100."

747
00:44:00,240 --> 00:44:04,790
A ATM está programado para primeiro fazer um select no seu banco de dados ou o equivalente -

748
00:44:04,790 --> 00:44:10,780
qualquer banco de dados que está usando - para ver se este usuário tem pelo menos US $ 100 em sua conta?

749
00:44:10,780 --> 00:44:16,180
Se sim, então cuspir o $ 100 e subtrair R $ 100 a partir de seu equilíbrio.

750
00:44:16,180 --> 00:44:20,470
Mas é claro que, se há várias máquinas aqui ou múltiplas formas de inspecionar

751
00:44:20,470 --> 00:44:23,560
o estado do mundo, o cofre do banco, para ver quanto dinheiro você tem,

752
00:44:23,560 --> 00:44:26,780
supor que apenas por acaso a máquina à esquerda e à direita

753
00:44:26,780 --> 00:44:30,140
tanto essa pergunta em aproximadamente no mesmo momento no tempo.

754
00:44:30,140 --> 00:44:34,160
>> E isto pode certamente acontecer. Os caixas eletrônicos são computadores estes dias.

755
00:44:34,160 --> 00:44:37,670
Então, se a máquina à esquerda diz: "Sim, você tem pelo menos US $ 100",

756
00:44:37,670 --> 00:44:42,150
Enquanto isso, a máquina à direita diz: "Sim, você tem pelo menos US $ 100",

757
00:44:42,150 --> 00:44:47,420
então ambos avançar para concluir os seus programas e realmente cuspir os US $ 100

758
00:44:47,420 --> 00:44:50,820
e dizer: "Antes você tinha US $ 200."

759
00:44:50,820 --> 00:44:54,890
"Deixe-me atualizar a variável a ser agora 100 dólares deixados na conta."

760
00:44:54,890 --> 00:44:58,780
Mas se ambos têm verificado o seu saldo de conta e descobri que é 200 dólares

761
00:44:58,780 --> 00:45:02,000
e os dois em seguida, fazer as contas e dizem que 200 - 100,

762
00:45:02,000 --> 00:45:06,990
as máquinas potencialmente cuspir duas notas de $ 100 em cada máquina,

763
00:45:06,990 --> 00:45:11,360
mas eles só atualizou o seu saldo de conta soma é R $ 100.

764
00:45:11,360 --> 00:45:15,130
Em outras palavras, você tomou a US $ 200, mas porque eles inspecionaram o estado do mundo

765
00:45:15,130 --> 00:45:18,840
simultaneamente e, em seguida, tomou a decisão com base nesse valor,

766
00:45:18,840 --> 00:45:21,930
eles não podem fazer a matemática, em última análise corretamente.

767
00:45:21,930 --> 00:45:25,520
Portanto, em uma situação de banco também você realmente quer ter algum tipo de bloqueio

768
00:45:25,520 --> 00:45:28,450
de modo que, logo que você verificou o estado de alguma variável

769
00:45:28,450 --> 00:45:31,220
que é realmente importante, como saldo da sua conta,

770
00:45:31,220 --> 00:45:36,070
não deixe ninguém tomar decisões baseadas no que até está pronto a fazer sua coisa,

771
00:45:36,070 --> 00:45:38,920
onde, neste caso, você é o ATM do lado esquerdo.

772
00:45:38,920 --> 00:45:41,160
Bloquear todos os outros fora.

773
00:45:41,160 --> 00:45:44,650
Você pode realmente atingir esse efeito em um par de maneiras diferentes.

774
00:45:44,650 --> 00:45:48,660
>> A maneira mais simples no MySQL é uma linha de SQL que lhe deu

775
00:45:48,660 --> 00:45:52,030
na especificação do conjunto de problemas que se parece exatamente como este.

776
00:45:52,030 --> 00:45:57,420
Inserir na tabela - o que é chamado - um id, um símbolo, e por ação, um número de ações,

777
00:45:57,420 --> 00:45:59,660
os valores que se seguem, por exemplo.

778
00:45:59,660 --> 00:46:03,370
Se você ainda não leu a especificação ainda, este é um exemplo que envolve como você vai fazer sobre

779
00:46:03,370 --> 00:46:07,340
comprar 10 ações desta tostão estoque para Presidente Skroob,

780
00:46:07,340 --> 00:46:10,340
cuja identificação do usuário passa a ser o número 7?

781
00:46:10,340 --> 00:46:14,070
Isto diz INSERT INTO tabela o id seguinte, símbolo e número de ações

782
00:46:14,070 --> 00:46:18,200
de 7, 'DVN.V', e 10.

783
00:46:18,200 --> 00:46:21,510
Mas - mas, mas, mas - a segunda linha é a mais importante.

784
00:46:21,510 --> 00:46:26,310
ON DUPLICADOS partes da atualização chave = partes + valores (ações).

785
00:46:26,310 --> 00:46:28,350
Então, totalmente enigmático aparência à primeira vista.

786
00:46:28,350 --> 00:46:31,990
Mas o fato de que esta consulta SQL, mesmo que ele quebra em duas linhas,

787
00:46:31,990 --> 00:46:35,920
É uma consulta longa, isso significa que é atômica

788
00:46:35,920 --> 00:46:41,000
no sentido em que esta consulta irá ser executado em conjunto ou não em todos.

789
00:46:41,000 --> 00:46:45,100
E, por definição do MySQL, que é como eles implementaram esta consulta.

790
00:46:45,100 --> 00:46:51,010
Ele é, por definição, no manual garantido para executar todos de uma vez ou de modo nenhum.

791
00:46:51,010 --> 00:46:54,020
A motivação para isso é a seguinte.

792
00:46:54,020 --> 00:46:58,540
Se neste caso você está tentando comprar 10 ações do,

793
00:46:58,540 --> 00:47:02,260
é uma espécie da mesma história como o leite, é uma espécie da mesma história como o ATM.

794
00:47:02,260 --> 00:47:04,970
>> Se você não faz o erro de usar esta sintaxe

795
00:47:04,970 --> 00:47:09,610
mas a seleção do banco de dados para ver quantas ações desta tostão estoque

796
00:47:09,610 --> 00:47:13,750
que o Presidente Skroob tem, e acho que ele tem 10 ações,

797
00:47:13,750 --> 00:47:19,330
e então alguns fração de segundo mais tarde você faça uma declaração UPDATE,

798
00:47:19,330 --> 00:47:24,810
que é uma outra declaração em SQL que diz vá em frente e adicionar 10 mais ações

799
00:47:24,810 --> 00:47:28,700
à sua 10 atual de modo que, idealmente, o total é de 20,

800
00:47:28,700 --> 00:47:33,490
o problema é porque os atuais sistemas de banco de dados e porque em computadores de hoje

801
00:47:33,490 --> 00:47:35,990
você tem múltiplos processadores, núcleos múltiplos -

802
00:47:35,990 --> 00:47:38,920
em outras palavras, os computadores podem ser literalmente fazendo várias coisas ao mesmo tempo -

803
00:47:38,920 --> 00:47:44,270
não há nenhuma garantia de que o seu SELECT e UPDATE em seu caso

804
00:47:44,270 --> 00:47:46,150
vão acontecer de costas.

805
00:47:46,150 --> 00:47:49,140
Assim, um cenário ruim seria você fazer o SELECT

806
00:47:49,140 --> 00:47:51,670
para ver quantas ações desta tostão estoque não Skroob tem,

807
00:47:51,670 --> 00:47:54,710
e depois é só por acaso outra consulta de banco de dados é executado -

808
00:47:54,710 --> 00:47:57,740
talvez o seu Skroob em outra janela do navegador tentando comprar 10 partes

809
00:47:57,740 --> 00:48:00,700
em outra janela completamente, muito parecida com a ATM -

810
00:48:00,700 --> 00:48:05,410
e supor que outra consulta fica entre SELECT e UPDATE.

811
00:48:05,410 --> 00:48:10,210
Poderia ser o caso de que Skroob agora perde um pouco número de ações

812
00:48:10,210 --> 00:48:14,340
porque outro processo está a inspeccionar o estado do seu mundo,

813
00:48:14,340 --> 00:48:17,800
ou ele fica mais ações do que ele deve ter.

814
00:48:17,800 --> 00:48:23,250
Não vou entrar em detalhes de exatamente o que essas linhas história particular seria,

815
00:48:23,250 --> 00:48:28,380
mas o ponto é, se você tem que verificar um valor de variáveis ​​e então tomar uma decisão,

816
00:48:28,380 --> 00:48:32,500
se há um risco de alguém fazer alguma coisa entre esses dois depoimentos,

817
00:48:32,500 --> 00:48:36,220
como pode acontecer em sistemas multiprocessados, em sistemas multicore,

818
00:48:36,220 --> 00:48:41,220
computadores com a capacidade de fazer várias coisas ao mesmo tempo, coisas ruins podem acontecer

819
00:48:41,220 --> 00:48:44,530
contas bancárias como sendo debitado incorretamente, a compra de leite duas vezes mais,

820
00:48:44,530 --> 00:48:46,730
ou, neste caso, o número errado de ações.

821
00:48:46,730 --> 00:48:48,370
Mas há uma maneira mais fácil pensar sobre isso.

822
00:48:48,370 --> 00:48:53,290
>> Acontece que também suporta SQL, se você configurar a sua tabela corretamente,

823
00:48:53,290 --> 00:48:56,920
algo chamado transações, o que eu diria é realmente ainda mais fácil de entender

824
00:48:56,920 --> 00:49:00,650
do que isso, mas não é um 1-liner, por isso é realmente um pouco mais envolvido.

825
00:49:00,650 --> 00:49:04,960
Há, literalmente, uma declaração em SQL chamado START TRANSACTION.

826
00:49:04,960 --> 00:49:08,300
Assim como há SELECT, UPDATE, INSERT, DELETE e JOIN e um monte de outros,

827
00:49:08,300 --> 00:49:10,970
há palavras-chave como START TRANSACTION.

828
00:49:10,970 --> 00:49:13,560
E o que você faça no contexto de pset 7 -

829
00:49:13,560 --> 00:49:17,270
você não tem que fazer isso para pset 7, que é explicitamente negada como não é necessário,

830
00:49:17,270 --> 00:49:18,830
mas para projetos finais pode ser útil -

831
00:49:18,830 --> 00:49:22,820
se você chamar uma consulta de START TRANSACTION e depois outra consulta

832
00:49:22,820 --> 00:49:25,620
e, em seguida, consulta outro e depois outro, outro, e outro,

833
00:49:25,620 --> 00:49:31,860
essas consultas não vai realmente ser executado até que você chamar a instrução SQL COMMIT,

834
00:49:31,860 --> 00:49:37,220
em que ponto, se é duas declarações ou 20 depoimentos, todos eles vão ser executados de uma só vez,

835
00:49:37,220 --> 00:49:42,770
o que significa que ninguém pode acidentalmente comprar muito leite ou débito muito dinheiro

836
00:49:42,770 --> 00:49:46,340
ou comprar ações muitas porque todas as suas dúvidas executará

837
00:49:46,340 --> 00:49:48,410
de costas para trás, para trás.

838
00:49:48,410 --> 00:49:51,580
E isso é super importante, especialmente quando você está fazendo algo assim.

839
00:49:51,580 --> 00:49:54,900
Este é um exemplo arbitrário que diz vamos atualizar a conta bancária

840
00:49:54,900 --> 00:50:00,200
estabelecendo um equilíbrio igual a equilíbrio - $ 1000, onde o número da conta é 2.

841
00:50:00,200 --> 00:50:04,260
E então a segunda instrução é agora vamos depositar que $ 1000

842
00:50:04,260 --> 00:50:07,310
em alguém da conta bancária cuja conta número é 1.

843
00:50:07,310 --> 00:50:10,400
>> Em outras palavras, este é um exemplo perfeito de onde você quer ter a certeza

844
00:50:10,400 --> 00:50:13,590
que ambas as afirmações acontecer ou não em todos

845
00:50:13,590 --> 00:50:15,450
porque caso contrário o cliente vai se ferrar

846
00:50:15,450 --> 00:50:17,670
e você vai ter seu dinheiro e não depositá-lo em outro lugar,

847
00:50:17,670 --> 00:50:20,470
ou o banco vai se ferrar, onde você vai depositar o dinheiro

848
00:50:20,470 --> 00:50:23,140
mas na verdade não subtrai-lo da conta do usuário.

849
00:50:23,140 --> 00:50:25,810
Então você quer os dois juntos para executar.

850
00:50:25,810 --> 00:50:29,140
Assim entra nas transações mundiais.

851
00:50:29,140 --> 00:50:31,360
Então, isso é algo para se manter na parte de trás de sua mente,

852
00:50:31,360 --> 00:50:34,710
não tanto para fins de apenas um projeto final,

853
00:50:34,710 --> 00:50:36,700
mas se você quiser ter o seu projeto final em algum lugar,

854
00:50:36,700 --> 00:50:39,040
Se você deseja iniciar alguma empresa em torno dele,

855
00:50:39,040 --> 00:50:41,270
se você quer resolver problema algum grupo de estudantes no campus

856
00:50:41,270 --> 00:50:45,210
e realmente tem um site, ao vivo ativa, esse é o tipo de erros sutis que podem surgir

857
00:50:45,210 --> 00:50:49,480
se você não consegue pensar no que pode acontecer se duas pessoas

858
00:50:49,480 --> 00:50:54,190
está tentando acessar o seu site em, literalmente, no mesmo momento no tempo,

859
00:50:54,190 --> 00:50:56,890
em que suas consultas poderiam se entrelaçam.

860
00:50:58,840 --> 00:51:01,420
>> Pronto para um pouco de JavaScript, um teaser do mesmo?

861
00:51:01,420 --> 00:51:04,320
Este é o nosso último idioma para o semestre. Tudo bem.

862
00:51:04,320 --> 00:51:09,940
Felizmente, JavaScript parece muito, muito, muito semelhante às duas línguas, C e PHP,

863
00:51:09,940 --> 00:51:11,140
que temos feito até agora.

864
00:51:11,140 --> 00:51:14,340
Não há JavaScript no pset 7, mas é uma ferramenta incrivelmente útil

865
00:51:14,340 --> 00:51:18,840
quando se trata de fazer projetos na web finais ou realmente apenas programação web em geral.

866
00:51:18,840 --> 00:51:20,950
Assim, uma visão rápida de algo chamado DOM.

867
00:51:20,950 --> 00:51:23,600
Aqui é uma página web super simples que realmente só diz Olá mundo,

868
00:51:23,600 --> 00:51:25,970
tanto no título e no corpo.

869
00:51:25,970 --> 00:51:29,270
À medida que a indentação tem sugerido por algum tempo,

870
00:51:29,270 --> 00:51:31,380
existe realmente uma hierarquia para as páginas web.

871
00:51:31,380 --> 00:51:34,220
Eu poderia desenhar esse trecho mesmo do HTML como uma árvore,

872
00:51:34,220 --> 00:51:37,470
pensar de volta para as nossas discussões de estruturas de dados em C, como se segue.

873
00:51:37,470 --> 00:51:40,710
Eu tenho algum nó raiz especial chamado de nó de documento,

874
00:51:40,710 --> 00:51:43,650
e vamos ver o análogo desta em JavaScript em apenas um momento.

875
00:51:43,650 --> 00:51:48,330
O primeiro filho e filho único de que neste caso é a tag HTML.

876
00:51:48,330 --> 00:51:49,880
Não há mapeamento direto do doctype.

877
00:51:49,880 --> 00:51:53,170
Isso é uma coisa especial, de modo que devemos simplesmente ignorá-la quando se trata deste DOM,

878
00:51:53,170 --> 00:51:55,810
este Documento árvore Object Model.

879
00:51:55,810 --> 00:51:59,530
Observe que a tag HTML, que eu arbitrariamente representado como um retângulo,

880
00:51:59,530 --> 00:52:02,890
tem 2 filhos: cabeça e corpo.

881
00:52:02,890 --> 00:52:04,840
>> Aqueles são igualmente desenhado como rectângulos.

882
00:52:04,840 --> 00:52:08,970
É significativo que a cabeça é pictoricamente à esquerda do corpo.

883
00:52:08,970 --> 00:52:11,960
A implicação é que a cabeça está em primeiro lugar na árvore.

884
00:52:11,960 --> 00:52:14,910
Portanto, não há, na verdade, uma ordenação de uma árvore quando você desenhá-lo como este,

885
00:52:14,910 --> 00:52:17,460
embora as formas e whatnot são arbitrárias.

886
00:52:17,460 --> 00:52:20,360
Chefe entretanto tem um filho único chamado título,

887
00:52:20,360 --> 00:52:25,170
e título, na verdade, tem o seu próprio filho, que é "Olá, mundo",

888
00:52:25,170 --> 00:52:32,210
que eu deliberadamente atraiu como um oval aqui para torná-lo um pouco diferente do retângulo.

889
00:52:32,210 --> 00:52:37,420
Estes retângulos são elementos, enquanto Olá, mundo é realmente um nó de texto.

890
00:52:37,420 --> 00:52:39,850
Portanto, é um nó na árvore, mas é um tipo diferente de nó

891
00:52:39,850 --> 00:52:41,730
Então eu desenhei isso arbitrariamente diferente.

892
00:52:41,730 --> 00:52:45,000
Da mesma forma que o corpo tem um filho chamado Olá mundo, bem como,

893
00:52:45,000 --> 00:52:47,910
nó de modo diferente, mesmo que eles estão coincidentemente o mesmo texto,

894
00:52:47,910 --> 00:52:52,100
mas eu desenhei-lo usando a mesma forma. Então, quem se importa?

895
00:52:52,100 --> 00:52:56,820
Bem, o que é agradável sobre HTML é que ela tem esta natureza hierárquica.

896
00:52:56,820 --> 00:53:01,010
E o que é agradável sobre JavaScript e particularmente bibliotecas que estão disponíveis gratuitamente

897
00:53:01,010 --> 00:53:07,120
e populares como jQuery, você pode navegar pela estrutura de árvore de forma surpreendentemente fácil.

898
00:53:07,120 --> 00:53:11,790
Qualquer uma das coisas que fizemos em C com ponteiros e árvores de deslocamento e recursing em nós

899
00:53:11,790 --> 00:53:15,300
criança entregue a criança direita, de repente, podemos classificar de ter concedido

900
00:53:15,300 --> 00:53:19,450
como sendo incrivelmente esclarecedor se não um pouco frustrante

901
00:53:19,450 --> 00:53:22,470
mas não quase uma maneira eficiente de percorrer cerca de programação.

902
00:53:22,470 --> 00:53:24,470
E assim, com estas linguagens de alto nível como JavaScript

903
00:53:24,470 --> 00:53:28,340
nós vamos ser capazes de navegar esta árvore muito mais intuitiva.

904
00:53:28,340 --> 00:53:30,430
>> E de fato a sintaxe vai ser bastante familiar.

905
00:53:30,430 --> 00:53:32,950
Se você nunca viu JavaScript antes, esta é uma referência muito bom

906
00:53:32,950 --> 00:53:35,910
do pessoal do Mozilla, as pessoas que fazem o Firefox,

907
00:53:35,910 --> 00:53:38,370
assim me sinto livre para procurar que a sua conveniência.

908
00:53:38,370 --> 00:53:41,590
O que você vai encontrar - e esses slides são idênticos aos que usamos no outro dia -

909
00:53:41,590 --> 00:53:44,030
similarmente, principal está desaparecido.

910
00:53:44,030 --> 00:53:47,010
Então, quando você escrever um programa em JavaScript, não há nenhuma função principal.

911
00:53:47,010 --> 00:53:48,690
Você acabou de começar a escrever código.

912
00:53:48,690 --> 00:53:51,660
Mas uma distinção fundamental entre JavaScript e C e PHP

913
00:53:51,660 --> 00:53:55,890
é que, enquanto C e PHP, até agora, ter sido executado do lado do servidor

914
00:53:55,890 --> 00:53:59,180
pelo aparelho, neste caso, ou mais geralmente, por um servidor,

915
00:53:59,180 --> 00:54:04,270
JavaScript por projeto é geralmente executado por um navegador.

916
00:54:04,270 --> 00:54:08,440
Em outras palavras, você pode escrever código JavaScript, como estamos prestes a,

917
00:54:08,440 --> 00:54:13,080
em um servidor no aparelho, mas você incluí-lo entre seu HTML, entre o CSS,

918
00:54:13,080 --> 00:54:16,100
entre os seus GIFs e seus PNGs e seus JPEGs

919
00:54:16,100 --> 00:54:19,170
de modo que quando o usuário visita a página web, se você estiver usando JavaScript,

920
00:54:19,170 --> 00:54:21,770
que o código JavaScript vem do servidor para o navegador,

921
00:54:21,770 --> 00:54:24,540
e é o navegador que realmente executa.

922
00:54:24,540 --> 00:54:27,960
Então, isso tem implicações significativas para a propriedade intelectual, mesmo.

923
00:54:27,960 --> 00:54:32,600
É uma espécie de bobo para pensar sobre como proteger seu IP quando se trata de código JavaScript

924
00:54:32,600 --> 00:54:37,560
porque, por natureza da linguagem que é executada normalmente lado do navegador.

925
00:54:37,560 --> 00:54:40,360
>> Você pode ofuscar, o que significa que você pode fazê-lo parecer louco e feio

926
00:54:40,360 --> 00:54:45,400
com nenhum espaço em branco, horríveis nomes de variáveis, para tornar mais difícil para as pessoas para roubar o seu IP,

927
00:54:45,400 --> 00:54:48,120
mas o fundamental é que ele é executado lado do navegador.

928
00:54:48,120 --> 00:54:51,790
Mesmo que um lado do servidor como de lado JavaScript pode ser usado,

929
00:54:51,790 --> 00:54:54,480
o caso de uso mais comum agora ainda está no navegador.

930
00:54:54,480 --> 00:54:59,800
E aqui é o que parece. Aqui é um if-else if-else construir apenas como C, assim como PHP.

931
00:54:59,800 --> 00:55:02,420
Aqui é uma expressão booleana quando você "ou" 2 coisas juntos.

932
00:55:02,420 --> 00:55:04,330
Aqui é quando você "e" duas coisas juntas.

933
00:55:04,330 --> 00:55:08,300
Aqui está uma instrução switch, que é semelhante ao PHP

934
00:55:08,300 --> 00:55:10,810
em que você pode alternar em diferentes tipos de valores.

935
00:55:10,810 --> 00:55:15,180
Loops semelhante tem loops aqui, que são estruturados de forma idêntica ao que nós já vimos antes.

936
00:55:15,180 --> 00:55:18,110
Enquanto laços; temos fazer enquanto loops.

937
00:55:18,110 --> 00:55:20,290
Variáveis, sempre tão ligeiramente diferente.

938
00:55:20,290 --> 00:55:24,560
Você declarar variáveis, como você faz em PHP e C,

939
00:55:24,560 --> 00:55:27,860
mas igualmente é fracamente JavaScript digitado.

940
00:55:27,860 --> 00:55:32,730
Você não especificar int ou float ou string ou qualquer coisa assim normalmente.

941
00:55:32,730 --> 00:55:34,240
Você pode especificar var.

942
00:55:34,240 --> 00:55:38,040
Você não tem que especificar var, mas tem implicações se não o fizer.

943
00:55:38,040 --> 00:55:42,000
Normalmente, se você omitir var, você acidentalmente criar uma variável global em vez de local.

944
00:55:42,000 --> 00:55:46,420
Então deixe-me propor que você quase sempre apenas dizer var e então o nome da variável.

945
00:55:46,420 --> 00:55:48,740
Não é um tipo, é apenas para a variável var.

946
00:55:48,740 --> 00:55:52,930
Este seria um exemplo, se é 123 ou "Olá mundo".

947
00:55:52,930 --> 00:55:58,910
Matrizes estão presentes e sintaticamente semelhante ao PHP.

948
00:55:58,910 --> 00:56:03,690
Eu vou dizer números var e então eu usar colchetes novamente para declarar uma variável

949
00:56:03,690 --> 00:56:08,870
cujo tipo é matriz que tem esses números específicos em que, separados por vírgulas.

950
00:56:08,870 --> 00:56:11,740
E então, finalmente, este é o único que realmente parece diferente.

951
00:56:11,740 --> 00:56:16,700
Lembre-se que em PHP que teria aplicado uma matriz associativa para um estudante

952
00:56:16,700 --> 00:56:20,220
como Zamyla que pode parecer como este, em que a variável é chamado de aluno.

953
00:56:20,220 --> 00:56:23,370
Os colchetes significam aqui vem uma matriz.

954
00:56:23,370 --> 00:56:28,500
>> O fato de que eu não estou usando índices numéricos mas cordas - id, casa, e nome -

955
00:56:28,500 --> 00:56:30,990
significa que esta é uma matriz associativa,

956
00:56:30,990 --> 00:56:34,490
e essas flechas com o sinal de igual eo suporte angular

957
00:56:34,490 --> 00:56:37,310
significa que a chave é "ID", o valor é 1;

958
00:56:37,310 --> 00:56:39,310
a chave é a "casa", o valor é Winthrop House;

959
00:56:39,310 --> 00:56:41,800
a chave é "nome", o valor é Zamyla Chan.

960
00:56:41,800 --> 00:56:47,110
Portanto, há três chaves dentro desta matriz associativa, cada qual tem seu próprio valor.

961
00:56:47,110 --> 00:56:52,880
Nós vimos que em pset 7, ou você em breve, em JavaScript mesma idéia,

962
00:56:52,880 --> 00:56:55,220
mas isso vai ficar assim.

963
00:56:55,220 --> 00:57:00,070
Estudante para var - sem sinal de dólar e nenhuma menção de tipo ainda, mas var -

964
00:57:00,070 --> 00:57:05,860
iguais e abra chaves porque em JavaScript, quando você tem pares de valores-chave,

965
00:57:05,860 --> 00:57:08,900
você realmente usa algo chamado um objeto.

966
00:57:08,900 --> 00:57:13,490
E aqueles de vocês que demorou APCS ou similar pode se lembrar de objetos Java

967
00:57:13,490 --> 00:57:15,140
ou línguas semelhantes.

968
00:57:15,140 --> 00:57:17,880
JavaScript não é Java, em primeiro lugar.

969
00:57:17,880 --> 00:57:21,600
Foi uma decisão deliberada anos atrás projeto para derrubar outra coisa que era popular,

970
00:57:21,600 --> 00:57:25,640
o seu nome, mesmo que não tem qualquer relação fundamental Java em si.

971
00:57:25,640 --> 00:57:31,490
JavaScript possui objetos, e você cria-los por meio da notação chaveta.

972
00:57:31,490 --> 00:57:36,710
Objetos em JavaScript são praticamente equivalentes a arrays associativos em PHP

973
00:57:36,710 --> 00:57:40,030
quando se trata de armazenamento de dados para dentro delas.

974
00:57:40,030 --> 00:57:44,100
>> Mas, ainda mais poderosa em JavaScript você pode associar facilmente funções

975
00:57:44,100 --> 00:57:48,040
dentro de um objeto, e que você pode fazer isso em outros idiomas,

976
00:57:48,040 --> 00:57:50,040
é bem um paradigma comum, como vamos ver.

977
00:57:50,040 --> 00:57:54,380
Em suma, este objeto representa um aluno, que é particularmente Zamyla,

978
00:57:54,380 --> 00:58:00,380
e é semelhante conceitualmente, apenas sintaticamente diferente deste.

979
00:58:00,380 --> 00:58:03,840
Vamos realmente usar JavaScript em um arquivo.

980
00:58:03,840 --> 00:58:05,570
Acontece que há uma tag script.

981
00:58:05,570 --> 00:58:08,180
Temos visto uma marca de estilo e vimos outras tags HTML.

982
00:58:08,180 --> 00:58:11,510
A tag script realmente irá conter algum código JavaScript.

983
00:58:11,510 --> 00:58:15,500
Deixe-me ir para dentro do aparelho onde temos algum código fonte pré-feita.

984
00:58:15,500 --> 00:58:18,700
Eu não tenho postado ainda no site, mas eu vou fazer isso depois da aula.

985
00:58:18,700 --> 00:58:21,770
Vamos abrir um presente, blink.html.

986
00:58:21,770 --> 00:58:27,560
Na década de 1990, houve literalmente uma tag HTML chamado de tag piscar de olhos,

987
00:58:27,560 --> 00:58:30,340
e esta foi uma das marcas mais maravilhosamente demasia na Internet

988
00:58:30,340 --> 00:58:36,140
pelo qual você visitar alguns década de 1990 página web estilo e começar a ver texto piscando-lhe assim,

989
00:58:36,140 --> 00:58:39,810
os resultados da tag marquês, que tinha texto, indo assim.

990
00:58:39,810 --> 00:58:45,070
Uma das poucas vezes em que o mundo foi realmente estabeleceram um padrão web,

991
00:58:45,070 --> 00:58:48,250
todos através da placa matou a tag piscar há alguns anos.

992
00:58:48,250 --> 00:58:52,860
Mas podemos ressuscitá-lo com JavaScript como uma demonstração do poder que você tem

993
00:58:52,860 --> 00:58:56,660
quando você pode escrever um programa dentro de uma página web.

994
00:58:56,660 --> 00:59:00,240
Primeiro vamos pular a coisas novas e se concentrar apenas na idade.

995
00:59:00,240 --> 00:59:01,780
>> Aqui está o material antigo neste exemplo.

996
00:59:01,780 --> 00:59:06,350
Eu tenho uma tag HTML, uma marca de cabeça, e um título de tag.

997
00:59:06,350 --> 00:59:11,210
Então eu tenho uma tag corpo aqui com uma div, que recall é apenas uma divisão retangular da página

998
00:59:11,210 --> 00:59:14,720
que eu tenha dado um único ID arbitrariamente de "saudação" para,

999
00:59:14,720 --> 00:59:18,320
só assim eu tenho uma maneira de exclusividade referindo a ele, que tem um texto muito simples:

1000
00:59:18,320 --> 00:59:20,220
Olá, mundo.

1001
00:59:20,220 --> 00:59:23,940
Agora deixe-me ir até o topo do arquivo e ver o que há de novo.

1002
00:59:23,940 --> 00:59:27,710
A primeira coisa que é top-se novo é a tag de script,

1003
00:59:27,710 --> 00:59:31,280
e dentro do aviso de tag script que eu tenha declarado uma função.

1004
00:59:31,280 --> 00:59:34,610
Para declarar uma função em JavaScript, bastante semelhante ao PHP,

1005
00:59:34,610 --> 00:59:37,930
você literalmente escrever função, então o nome da função, entre parênteses,

1006
00:59:37,930 --> 00:59:40,400
e talvez alguns argumentos se tomar qualquer.

1007
00:59:40,400 --> 00:59:43,510
Então eu tenho a minha chaveta como de costume, e agora temos um código um pouco novo,

1008
00:59:43,510 --> 00:59:45,230
mas vamos ver o que isso significa.

1009
00:59:45,230 --> 00:59:48,670
Então div var, isto significa apenas dar-me uma div chamada variável.

1010
00:59:48,670 --> 00:59:50,530
Eu poderia tê-lo chamado foo, mas eu queria que ele seja chamado div

1011
00:59:50,530 --> 00:59:52,620
por razões que ficará claro em um segundo.

1012
00:59:52,620 --> 00:59:57,480
Em seguida, ele se transforma em JavaScript - e este é o código JavaScript embutido na minha página da web -

1013
00:59:57,480 --> 01:00:01,760
há uma variável global especial do tipo chamado de documento.

1014
01:00:01,760 --> 01:00:04,780
JavaScript é na verdade uma linguagem orientada a objetos.

1015
01:00:04,780 --> 01:00:07,230
Nós não vamos entrar em detalhes em 50, como o que isso significa,

1016
01:00:07,230 --> 01:00:11,180
mas por agora saber que um objeto é muito bonito como uma estrutura.

1017
01:00:11,180 --> 01:00:14,740
Como vimos caminho de volta quando, em um dos mais antigos conjuntos de problema

1018
01:00:14,740 --> 01:00:17,150
onde vamos colocar um monte de informações em uma estrutura,

1019
01:00:17,150 --> 01:00:21,330
da mesma forma é documentar uma estrutura especial que vem com o navegador,

1020
01:00:21,330 --> 01:00:24,810
vem com qualquer página da web. Não é algo que eu criei.

1021
01:00:24,810 --> 01:00:28,210
Dentro desta estrutura do documento, porém, você tem não apenas dados

1022
01:00:28,210 --> 01:00:30,010
mas você também tem funções.

1023
01:00:30,010 --> 01:00:34,090
>> E a qualquer momento que você tem uma função dentro de uma estrutura, dentro de um objeto,

1024
01:00:34,090 --> 01:00:36,490
é chamado de método. Mas é a mesma coisa.

1025
01:00:36,490 --> 01:00:40,110
Um método é uma função que só acontece a estar dentro de outra coisa.

1026
01:00:40,110 --> 01:00:42,990
Então isso significa que esta variável global especial chamado de documento

1027
01:00:42,990 --> 01:00:47,690
tem uma função chamada getElementById que literalmente faz isso.

1028
01:00:47,690 --> 01:00:52,460
Ele vai te um elemento do DOM, Document Object Model árvore,

1029
01:00:52,460 --> 01:00:55,520
cuja identificação é nesta saudação caso.

1030
01:00:55,520 --> 01:00:59,200
Em outras palavras, todo o tempo que passamos em estruturas de dados entra em jogo aqui.

1031
01:00:59,200 --> 01:01:01,400
Esta imagem de um DOM que tivemos um momento atrás,

1032
01:01:01,400 --> 01:01:06,100
mesmo que a página é um pouco diferente, se eu tivesse uma div na foto,

1033
01:01:06,100 --> 01:01:11,180
document.getElementById que voltaria para mim seria efetivamente um ponteiro

1034
01:01:11,180 --> 01:01:15,440
para o retângulo na árvore, uma referência para o retângulo na árvore.

1035
01:01:15,440 --> 01:01:18,410
Então, isso é o que significa, na verdade, chamar uma dessas funções.

1036
01:01:18,410 --> 01:01:21,960
Neste caso, mais uma vez é uma div. Não é um corpo ou um título.

1037
01:01:21,960 --> 01:01:26,480
Então, vamos ver o que eu faça com este div agora que eu tenho isso dentro deste div variável chamada.

1038
01:01:26,480 --> 01:01:32,580
Acontece com JavaScript você tem a capacidade de ajustar o CSS da sua página dinamicamente.

1039
01:01:32,580 --> 01:01:39,060
Até agora, todo o CSS que fizemos, embora limitado, é em atributos de estilo,

1040
01:01:39,060 --> 01:01:41,730
ou onde mais nós colocar CSS?

1041
01:01:42,730 --> 01:01:45,810
Eu meio mimada que um. Na etiqueta de estilo no topo do ficheiro.

1042
01:01:45,810 --> 01:01:49,180
Ou o terceiro lugar foi em?

1043
01:01:50,710 --> 01:01:54,590
>> Um arquivo externo, alguma coisa. Css.

1044
01:01:54,590 --> 01:01:56,730
Então esses são os três lugares que fizemos CSS, até agora,

1045
01:01:56,730 --> 01:01:59,310
mas o problema é que já codificado tudo.

1046
01:01:59,310 --> 01:02:04,060
Você decidiu que você mergulhou pset 7, decidimos antes de palestra que o nosso CSS seria.

1047
01:02:04,060 --> 01:02:07,380
Mas se você quiser mudar o seu CSS, você pode realmente fazer isso

1048
01:02:07,380 --> 01:02:09,370
uma vez que você tem uma linguagem de programação real.

1049
01:02:09,370 --> 01:02:13,910
CSS, HTML - linguagens de programação não. JavaScript é.

1050
01:02:13,910 --> 01:02:18,200
Assim, verifica-se que, logo que você tem um desses retângulos da árvore

1051
01:02:18,200 --> 01:02:23,050
chamado o DOM, tem-se alguns dados dentro dela.

1052
01:02:23,050 --> 01:02:27,820
Assim, o div que eu simplesmente peguei a partir da árvore tem o que nós vamos chamar uma propriedade no interior do mesmo

1053
01:02:27,820 --> 01:02:34,390
chamado de estilo, e tem a propriedade de estilo em si uma propriedade chamada visibilidade.

1054
01:02:34,390 --> 01:02:37,330
Eu gostaria de saber isso só de olhar-se um manual de usuário CSS.

1055
01:02:37,330 --> 01:02:41,160
Acontece que há uma visibilidade propriedade CSS que faz o que diz.

1056
01:02:41,160 --> 01:02:44,530
Ele faz algo visível ou não, visível ou não.

1057
01:02:44,530 --> 01:02:46,810
E como você faz que é isso.

1058
01:02:46,810 --> 01:02:50,510
Estou pedindo programaticamente se a visibilidade deste div está oculto,

1059
01:02:50,510 --> 01:02:53,390
o que eu mudar para? Visível.

1060
01:02:53,390 --> 01:02:58,840
Outra coisa se a visibilidade desta página não está escondido, logicamente eu não torná-lo oculto.

1061
01:02:58,840 --> 01:03:04,070
Eu não tenho idéia por que é visível e oculto e não é visível e invisível.

1062
01:03:04,070 --> 01:03:06,000
Esta foi uma decisão má concepção ao longo do caminho.

1063
01:03:06,000 --> 01:03:09,530
Mas esses são de fato opostos em CSS: visíveis e ocultas.

1064
01:03:09,530 --> 01:03:15,520
Tudo isso faz é que significa alterar o CSS do meu arquivo e fora, dentro e fora

1065
01:03:15,520 --> 01:03:16,870
para que div particular.

1066
01:03:16,870 --> 01:03:20,630
Mas, novamente, esta é uma função chamada piscar de olhos. Quando é que a função de piscar chamado?

1067
01:03:20,630 --> 01:03:24,080
Acontece que há uma outra janela especial variável global chamada,

1068
01:03:24,080 --> 01:03:28,220
similares em espírito documento, mas que o documento se refere a sua página web,

1069
01:03:28,220 --> 01:03:31,700
como a árvore DOM, o HTML que você enviado do servidor,

1070
01:03:31,700 --> 01:03:35,250
janela se refere ao cromo em torno dele, a barra de endereço, a barra de título,

1071
01:03:35,250 --> 01:03:37,880
e todo esse material em torno de sua página web.

1072
01:03:37,880 --> 01:03:42,800
>> E verifica-se que o objeto da janela tem uma função especial dentro do que chamou de setInterval

1073
01:03:42,800 --> 01:03:44,360
que faz o que diz.

1074
01:03:44,360 --> 01:03:48,600
Ele irá definir um intervalo - neste caso a cada 500 milissegundos -

1075
01:03:48,600 --> 01:03:52,270
e, dar um palpite, o que é que vai fazer a cada 500 milissegundos?

1076
01:03:52,270 --> 01:03:55,240
Vai para executar essa função piscar.

1077
01:03:55,240 --> 01:03:58,560
E o que é bom aqui é que poderíamos ter feito isso em C mesmo que nunca fizemos.

1078
01:03:58,560 --> 01:04:01,580
C tem algo chamado de ponteiros de função onde você pode passar em torno de funções

1079
01:04:01,580 --> 01:04:03,140
como argumentos.

1080
01:04:03,140 --> 01:04:07,620
Da mesma forma em JavaScript você pode passar o nome de uma função para outra função.

1081
01:04:07,620 --> 01:04:10,630
E notem que eu estou fazendo. Eu não estou fazendo isso.

1082
01:04:10,630 --> 01:04:14,380
Se eu colocar parênteses após o piscar, isso significa chamar a função de intermitência.

1083
01:04:14,380 --> 01:04:17,430
Se eu omiti-los, isso significa que aqui é a função de piscar

1084
01:04:17,430 --> 01:04:21,330
para que setInterval pode chamá-lo a cada 500 milissegundos.

1085
01:04:21,330 --> 01:04:28,200
Assim, o resultado final, atroz que seja, é que se eu entrar em localhost e ir para blink.html,

1086
01:04:28,200 --> 01:04:32,120
Agora tenho isso acontecer de novo e de novo.

1087
01:04:32,120 --> 01:04:34,950
E se eu realmente Inspect Element, vamos ver se podemos ver isso.

1088
01:04:34,950 --> 01:04:38,550
Deixe-me Inspect Element, deixe-me rolar um pouco,

1089
01:04:38,550 --> 01:04:44,320
deixe-me escolher Elementos mais aqui, e observe o interior DOM do inspector do Chrome.

1090
01:04:44,320 --> 01:04:48,840
É literalmente mudando e para trás a cada 500 milissegundos.

1091
01:04:48,840 --> 01:04:55,660
Se formos para o nosso amigo de Nate,

1092
01:04:55,660 --> 01:05:00,020
Se você já se perguntou como isso está funcionando idéia, semelhante com um intervalo,

1093
01:05:00,020 --> 01:05:04,810
mas Nate está realmente fazendo uso muito eficaz de cor, neste caso particular aqui.

1094
01:05:04,810 --> 01:05:07,350
Então, o que mais podemos realmente fazer com isso?

1095
01:05:07,350 --> 01:05:09,990
Vamos abrir um outro exemplo e tentar algo

1096
01:05:09,990 --> 01:05:12,940
isso é programaticamente ainda mais útil do que fazer piscar coisas.

1097
01:05:12,940 --> 01:05:17,990
Deixe-me ir em nosso diretório formas hoje e ir para form0.

1098
01:05:17,990 --> 01:05:20,820
Esta foi a forma mais feia possível que eu venha com,

1099
01:05:20,820 --> 01:05:23,290
e deixe-me mostrar-lhe o que parece em um navegador.

1100
01:05:23,290 --> 01:05:28,960
>> Deixe-me entrar em localhost / formas, e isso é form0.

1101
01:05:28,960 --> 01:05:33,400
Esta é uma forma feia de super HTML que tem alguns campos de e-mail, a senha,

1102
01:05:33,400 --> 01:05:37,190
senha e, em seguida, uma caixa pequena de concordar com alguns termos e condições.

1103
01:05:37,190 --> 01:05:41,350
O problema é se eu visitar esta forma e eu não quero dar-lhe o meu endereço de e-mail,

1104
01:05:41,350 --> 01:05:44,730
Eu não quero a concordar com os termos e condições, talvez, eu possa clique em Registrar

1105
01:05:44,730 --> 01:05:46,920
e deixa-me através de qualquer maneira.

1106
01:05:46,920 --> 01:05:50,800
Isso acontece se submeter a um arquivo PHP chamado estúpido dump.php.

1107
01:05:50,800 --> 01:05:58,420
Tudo que faz é imprimir os conteúdos de $ _GET apenas para fins de diagnóstico.

1108
01:05:58,420 --> 01:06:01,580
Isso foi o que foi apresentado pelo usuário agora.

1109
01:06:01,580 --> 01:06:05,010
Mas suponha que realmente deseja validar a submissão do form do usuário.

1110
01:06:05,010 --> 01:06:06,530
Deixe-me ir para a versão 1.

1111
01:06:06,530 --> 01:06:11,420
Este é form1.html. Parece esteticamente tão ruim, mas repare como ele é fantasia.

1112
01:06:11,420 --> 01:06:15,450
Se eu clique em Register sem cooperar, eu fico gritado.

1113
01:06:15,450 --> 01:06:17,320
"Você deve fornecer seu endereço de e-mail."

1114
01:06:17,320 --> 01:06:21,670
Tudo bem. Então deixe-me tentar isso. Então malan@harvard.edu. Eu não preciso de uma senha.

1115
01:06:21,670 --> 01:06:25,100
Registre-se. "Você deve fornecer uma senha." Tudo bem.

1116
01:06:25,100 --> 01:06:28,470
Então eu vou fornecer uma senha de carmesim. Registre-se.

1117
01:06:28,470 --> 01:06:32,300
"As senhas não coincidem." Eu tenho que digitar aqui agora carmesim.

1118
01:06:32,300 --> 01:06:35,710
Eu acidentalmente verificado isso. Registre-se.

1119
01:06:35,710 --> 01:06:39,860
"Você deve concordar com os termos e condições." Tudo bem. Concordo lá. Registre-se.

1120
01:06:39,860 --> 01:06:43,700
E agora ele me mostra a saída de diagnóstico por lá.

1121
01:06:43,700 --> 01:06:45,630
>> Então, o que aconteceu?

1122
01:06:45,630 --> 01:06:48,330
Nós tivemos essa capacidade de validar as submissões de formulário.

1123
01:06:48,330 --> 01:06:51,420
Na verdade, se você fez mergulhar em pset 7, há uma função de desculpar

1124
01:06:51,420 --> 01:06:54,620
que o torna muito fácil de gritar com o usuário com uma mensagem na tela.

1125
01:06:54,620 --> 01:06:57,580
Eu estou usando um mecanismo um pouco diferente, a função de alerta,

1126
01:06:57,580 --> 01:07:03,690
o que não é uma função que está em cima sorriu uma vez que torna mensagens de usuários muito feias.

1127
01:07:03,690 --> 01:07:05,710
Mas vamos ver o que eu estou fazendo aqui.

1128
01:07:05,710 --> 01:07:09,620
Este é form1.html, e perceber que eu tenho alguma sintaxe muito familiar:

1129
01:07:09,620 --> 01:07:12,920
tag corpo, tag de formulário, atributo de ação, atributo método.

1130
01:07:12,920 --> 01:07:17,050
Mas note que eu dei a minha forma uma identificação única para a conveniência.

1131
01:07:17,050 --> 01:07:19,190
Então eu tenho um campo de e-mail cujo tipo é texto,

1132
01:07:19,190 --> 01:07:23,780
um campo de senha, cujo tipo é campo de confirmação de senha, cujo tipo é a senha,

1133
01:07:23,780 --> 01:07:28,070
e, em seguida, uma caixa de seleção, cujo nome é acordo por aqui, é tipo caixa de seleção.

1134
01:07:28,070 --> 01:07:30,380
E então eu tenho um botão de envio.

1135
01:07:30,380 --> 01:07:33,050
Mas repare no topo o que mais eu tenho.

1136
01:07:33,050 --> 01:07:35,810
Primeiro de tudo, há um outro uso da tag script.

1137
01:07:35,810 --> 01:07:40,520
Se você tem algum código JavaScript em outro arquivo, assim como com CSS você pode incluí-lo.

1138
01:07:40,520 --> 01:07:44,530
E você faz isso com fonte do script, e depois perceber que eu estou conectando aparentemente

1139
01:07:44,530 --> 01:07:50,349
para googleapis.com para um caminho muito longo, mas cujo nome do arquivo termina em jquery.min

1140
01:07:50,349 --> 01:07:52,420
para mínimo. js.

1141
01:07:52,420 --> 01:07:55,969
jQuery é uma biblioteca super popular para JavaScript que só faz JavaScript

1142
01:07:55,969 --> 01:07:58,230
tudo o mais user-friendly para usar.

1143
01:07:58,230 --> 01:08:00,610
É efetivamente se tornar um padrão de fato.

1144
01:08:00,610 --> 01:08:04,090
Assim, mesmo que o que você está prestes a ver não é puro JavaScript, por si só,

1145
01:08:04,090 --> 01:08:09,340
é uma biblioteca em cima de JavaScript muito parecido com a biblioteca CS50 é uma camada

1146
01:08:09,340 --> 01:08:13,670
em cima do código de baixo nível C, a realidade é quase todos na Internet usa.

1147
01:08:13,670 --> 01:08:18,030
Então, essas não são as rodas de treinamento. Este é apenas o melhor praticar estes dias.

1148
01:08:18,030 --> 01:08:22,830
Agora veja abaixo que é meu tag script próprio, e observe o que eu fiz aqui.

1149
01:08:22,830 --> 01:08:27,450
Acontece que o jQuery faz algo um pouco de fantasia.

1150
01:08:27,450 --> 01:08:29,660
JavaScript tem cifrões, mas eles não fazem sentido.

1151
01:08:29,660 --> 01:08:32,870
>> Eles são como a letra A ou B ou C.

1152
01:08:32,870 --> 01:08:36,670
jQuery simplesmente adotou a convenção ou tipo de reivindicou para o fato de

1153
01:08:36,670 --> 01:08:40,280
que US $ será o seu símbolo especial.

1154
01:08:40,280 --> 01:08:44,950
Assim, logo que você carregar este arquivo JavaScript global até aqui com a tag script,

1155
01:08:44,950 --> 01:08:49,080
você tem acesso a uma variável global especial que é chamada $.

1156
01:08:49,080 --> 01:08:53,009
É mais apropriadamente chamada jQuery, mas que não parece tão sexy quanto $.

1157
01:08:53,009 --> 01:08:56,250
Mas US $ não tem nenhum significado especial. No PHP teve significado especial.

1158
01:08:56,250 --> 01:08:58,440
Você tinha que ter isso na frente de uma variável.

1159
01:08:58,440 --> 01:09:01,670
Esta é apenas uma coisa sexy que eles assumiram.

1160
01:09:01,670 --> 01:09:03,389
O que está acontecendo aqui?

1161
01:09:03,389 --> 01:09:08,830
Repare que eu estou passando para a função jQuery meu documento variável global

1162
01:09:08,830 --> 01:09:10,860
e então eu estou chamando. pronto.

1163
01:09:10,860 --> 01:09:15,480
O jQuery essencialmente faz é que permite que você tome algumas coisas JavaScript baunilha

1164
01:09:15,480 --> 01:09:17,889
como o objeto documento, o objeto janela,

1165
01:09:17,889 --> 01:09:20,790
e se você passá-lo para a função jQuery -

1166
01:09:20,790 --> 01:09:24,429
e, novamente, para ser claro, esta é uma função chamada jQuery -

1167
01:09:24,429 --> 01:09:28,240
o que ele faz é que você volta a uma versão especial de documento

1168
01:09:28,240 --> 01:09:30,700
que tem mais funcionalidade associada a ele.

1169
01:09:30,700 --> 01:09:34,760
Assim, em JavaScript cru não há nenhuma função pronta,

1170
01:09:34,760 --> 01:09:37,810
mas se você passar documento para a função jQuery primeira,

1171
01:09:37,810 --> 01:09:40,960
ele retorna a você uma versão especial do objeto do documento

1172
01:09:40,960 --> 01:09:43,030
que tem características mais extravagantes.

1173
01:09:43,030 --> 01:09:48,230
E é por isso que as pessoas gostam dele. Ela só faz as coisas mais fáceis de fazer, como estamos prestes a ver.

1174
01:09:48,230 --> 01:09:49,820
Então, o que esta linha de código significa?

1175
01:09:49,820 --> 01:09:52,690
Esta linha de código aqui significa quando o documento está pronto -

1176
01:09:52,690 --> 01:09:56,830
em outras palavras, uma vez que o navegador é terminar de ler este arquivo de topo para baixo -

1177
01:09:56,830 --> 01:09:59,200
vá em frente e executar a seguinte função.

1178
01:09:59,200 --> 01:10:03,540
O que é realmente interessante em JavaScript - e PHP tem isso também -

1179
01:10:03,540 --> 01:10:05,450
é funções anônimas.

1180
01:10:05,450 --> 01:10:10,560
Em JavaScript você pode declarar funções que não têm nome, mas eles têm um corpo.

1181
01:10:10,560 --> 01:10:12,570
Observe o que está acontecendo aqui.

1182
01:10:12,570 --> 01:10:16,220
>> Esta é uma função chamada pronto, e isso significa apenas fazer o seguinte

1183
01:10:16,220 --> 01:10:20,220
quando a página web inteira está pronto, quando tudo foi lido a partir do servidor.

1184
01:10:20,220 --> 01:10:23,090
O que você quer fazer? Eu quero executar um pedaço de código.

1185
01:10:23,090 --> 01:10:27,120
Observe que nós não queremos executar esse código imediatamente.

1186
01:10:27,120 --> 01:10:34,350
Se eu omitido isso, isso significaria começar imediatamente a execução destas linhas de código.

1187
01:10:34,350 --> 01:10:39,040
Mas o fato de que eu estou dizendo não, não, não, envolver este em uma função anônima como esta

1188
01:10:39,040 --> 01:10:43,000
significa não executá-lo ainda, chamá-lo, eventualmente.

1189
01:10:43,000 --> 01:10:45,430
Vimos isso há um momento em nosso formulário de exemplo anterior.

1190
01:10:45,430 --> 01:10:49,990
Qual a função que chamamos eventualmente, a 500 milésimos de segundo mais tarde? Blink.

1191
01:10:49,990 --> 01:10:51,480
Assim, a mesma idéia.

1192
01:10:51,480 --> 01:10:53,950
Mais uma vez, mesmo que isso parece um pouco estranho, apenas tomar de agora em fé

1193
01:10:53,950 --> 01:10:57,060
que para declarar uma função anônima que se chama, eventualmente,

1194
01:10:57,060 --> 01:11:01,720
você simplesmente escrever function () {

1195
01:11:01,720 --> 01:11:05,380
Então, o que o código que vamos executar, eventualmente? O seguinte.

1196
01:11:05,380 --> 01:11:10,460
Isso também parece um pouco novo, mas isso significa que aqui é a função jQuery,

1197
01:11:10,460 --> 01:11:13,430
e este agora é um atalho.

1198
01:11:13,430 --> 01:11:18,830
Este trecho de código HTML na parte inferior da tela, claro, tem alguma representação árvore.

1199
01:11:18,830 --> 01:11:21,730
Não é isso. Esta página é mais interessante do que este exemplo Olá mundo.

1200
01:11:21,730 --> 01:11:25,210
Mas há alguma árvore que corresponde a este HTML.

1201
01:11:25,210 --> 01:11:28,910
Seria uma dor no pescoço para ter que implementar algum tipo de função recursiva

1202
01:11:28,910 --> 01:11:34,380
para começar no nó raiz e, em seguida, encontrar o nó cujo ID é o registro.

1203
01:11:34,380 --> 01:11:38,340
Então, o que faz com jQuery super fácil para nós é literalmente isso.

1204
01:11:38,340 --> 01:11:43,000
Vá em frente e me qualquer div ou qualquer forma, qualquer que seja elemento HTML

1205
01:11:43,000 --> 01:11:45,820
tem um ID de registro.

1206
01:11:45,820 --> 01:11:52,440
Isto é equivalente a document.getElementById ('Registro').

1207
01:11:52,440 --> 01:11:54,170
>> Por que pessoas como jQuery?

1208
01:11:54,170 --> 01:12:00,110
Porque é mais curto para digitar. Mas isso é tudo o que é. É a mesma idéia.

1209
01:12:00,110 --> 01:12:02,630
Tirem-me a tag cuja identificação é o registro.

1210
01:12:02,630 --> 01:12:06,300
E quando essa marca, que passa a ser uma forma, é submetido,

1211
01:12:06,300 --> 01:12:08,300
vá em frente e executar o código.

1212
01:12:08,300 --> 01:12:11,320
Portanto, vamos ter um olhar agora como estamos fazendo validação de formulário.

1213
01:12:11,320 --> 01:12:15,950
A sintaxe é reconhecidamente enigmática no início, mas o que está acontecendo?

1214
01:12:15,950 --> 01:12:21,050
Se esta linha de código é verdade, eu vou gritar com que o usuário forneça o seu endereço de e-mail.

1215
01:12:21,050 --> 01:12:22,970
Então o que é esta linha de código?

1216
01:12:22,970 --> 01:12:25,560
$ Significa jQuery. Agora, observe isso.

1217
01:12:25,560 --> 01:12:27,920
Este é tipo de como CSS.

1218
01:12:27,920 --> 01:12:33,370
Se você já mergulhou em CSS, no entanto, você sabe que isso significa que o elemento cuja identificação é o registro.

1219
01:12:33,370 --> 01:12:39,840
O espaço significa encontrar uma criança ou um descendente de inscrição, cujo nome é de entrada.

1220
01:12:39,840 --> 01:12:42,970
E então essa coisa entre colchetes é um filtro pouco.

1221
01:12:42,970 --> 01:12:47,010
E mesmo se isto parece enigmático, isto significa apenas ir para o formulário cujo ID é o registro,

1222
01:12:47,010 --> 01:12:51,230
ir para o interior do elemento de entrada que cujo nome é e-mail,

1223
01:12:51,230 --> 01:12:55,440
e em seguida, obter o seu valor, qualquer que seja o seu valor passa a ser -

1224
01:12:55,440 --> 01:12:59,670
asdf se isso é tudo o que eu digitado ou malan@harvard.edu se é isso que eu digitei.

1225
01:12:59,670 --> 01:13:05,250
Então, se o valor do campo do formulário de e-mail == nada, gritar com o usuário.

1226
01:13:05,250 --> 01:13:09,700
Outra coisa, se o valor do campo de senha == nada, gritar com o usuário.

1227
01:13:09,700 --> 01:13:19,520
>> Else, se o valor do campo de senha não é igual ao valor do campo de confirmação

1228
01:13:19,520 --> 01:13:22,850
que era o elemento outra forma, gritar com o usuário.

1229
01:13:22,850 --> 01:13:25,680
E então, finalmente - e esta também tem algumas nova sintaxe própria,

1230
01:13:25,680 --> 01:13:29,270
mas uma vez que você já viu, é pelo menos um pouco mais razoável -

1231
01:13:29,270 --> 01:13:34,060
mais se o formulário cujo ID é o registro tem um elemento de entrada, cujo nome é acordo

1232
01:13:34,060 --> 01:13:39,720
e é marcada, vá em frente e gritar com o usuário.

1233
01:13:39,720 --> 01:13:42,520
Então, eu totalmente admitir que este é completamente esmagadora à primeira vista.

1234
01:13:42,520 --> 01:13:46,530
É um monte de nova sintaxe. Mas todos jQuery segue estes tipos de padrões.

1235
01:13:46,530 --> 01:13:49,880
E honestamente, eu nem sabia que isso existia até poucos minutos atrás.

1236
01:13:49,880 --> 01:13:53,640
Eu Googled: "Como é que você verifique se a caixa de seleção está marcada em jQuery?"

1237
01:13:53,640 --> 01:13:55,680
e esta é a sintaxe, porque há maneiras diferentes de fazê-lo

1238
01:13:55,680 --> 01:13:58,010
com real código JavaScript prima.

1239
01:13:58,010 --> 01:14:01,030
Assim como a primeira página do Conjunto de Problemas 7 enfatiza,

1240
01:14:01,030 --> 01:14:04,500
pset 7 é muito mais um exercício de inicialização se

1241
01:14:04,500 --> 01:14:08,650
onde nós fornecemos, espero, um quadro conceitual com que para enfrentar o pset.

1242
01:14:08,650 --> 01:14:12,280
>> Mas, como é frequentemente o caso com web design, cabe a você realmente dar uma fuçada,

1243
01:14:12,280 --> 01:14:16,680
incorporar trechos de código e exemplos a partir da Web, desde que você citá-los

1244
01:14:16,680 --> 01:14:17,960
acordo com os termos em que a primeira folha,

1245
01:14:17,960 --> 01:14:21,460
e perceber que aprender HTML, CSS, JavaScript e até SQL

1246
01:14:21,460 --> 01:14:26,020
é realmente pretende ser este exercício em casa, quando começamos a tomar essas rodinhas.

1247
01:14:26,020 --> 01:14:29,150
E perceber também que há tantas coisas mais que você pode fazer com um navegador.

1248
01:14:29,150 --> 01:14:33,790
Dentro da maioria destes elementos há outras coisas chamados manipuladores de eventos.

1249
01:14:33,790 --> 01:14:37,140
E mesmo que apenas olhou para os chamados onsubmit e onReady,

1250
01:14:37,140 --> 01:14:40,310
você pode fazer coisas como onkeydown, onkeyup,

1251
01:14:40,310 --> 01:14:43,410
como quando o usuário toca uma tecla, você pode ouvir isso e para cima.

1252
01:14:43,410 --> 01:14:45,940
O Gmail tem atalhos de teclado.

1253
01:14:45,940 --> 01:14:49,490
Como o Google implementar atalhos de teclado, como C para compor?

1254
01:14:49,490 --> 01:14:54,120
Eles ouvir eventos, como são chamados, como onkeypress ou onkeyup e onkeydown.

1255
01:14:54,120 --> 01:14:56,360
Se você já pairava o mouse sobre alguma opção de menu

1256
01:14:56,360 --> 01:15:00,180
e, de repente, pronto, aparece um menu ou muda de cor gráfico,

1257
01:15:00,180 --> 01:15:01,920
como eles estão fazendo isso?

1258
01:15:01,920 --> 01:15:06,940
Ao invés de ouvir onReady ou onsubmit, você ouvir onmouseover ou onmouseout.

1259
01:15:06,940 --> 01:15:10,920
>> Assim, em breve, com estes princípios muito simples que nós começamos a arranhar a superfície de hoje

1260
01:15:10,920 --> 01:15:13,940
e vamos mergulhar ainda mais para na quarta-feira, que tem, cada vez mais,

1261
01:15:13,940 --> 01:15:17,530
poder de implementar os tipos de coisas que você já está familiarizado.

1262
01:15:17,530 --> 01:15:21,620
Então vamos terminar lá, e nós vamos continuar esta quarta-feira.

1263
01:15:22,690 --> 01:15:24,320
>> [CS50.TV]