DAVID MALAN: Tudo bem. Este é CS50, e este é o final de semana nove. Tem sido um turbilhão sobre nos últimos dias. E sete conjunto de problemas, se você for joelho profundamente dentro dele, percebe que há um grande pouco novo que está lá dentro. Mas vamos ver se não podemos remendar tudo junto aqui brevemente antes, em seguida, desviando em mais outra direção e visão onde mais podemos ir. 

Então, até agora, nós já conversamos sobre HTML. Nós conversamos sobre CSS. Nós conversamos sobre PHP. Você começou a experimentar SQL. Hoje, vamos falar um pouco sobre JavaScript. Mas como fazer tudo isso díspares línguas se encaixam? 

Então nós conversamos na semana passada sobre o noção de ter um servidor. Então vamos chamar este retângulo como um servidor web aqui. E um servidor web serve certamente arquivos. E alguns desses arquivos podem ser arquivos HTML. Então, uma das coisas que um servidor web pode cuspir pode ser um arquivo que nós vamos chamar assim contendo um pouco de HTML. Assim, em termos leigos, o que O HTML permitem que você faça? 

AUDIÊNCIA: Olhar Página agradável. 

DAVID MALAN: OK, fazer uma página de boa aparência, embora eu acho que eu tenho provado que de outra forma. Assim HTML deixa você colocar para fora páginas estruturalmente, e ele permite que você tipo de esteticamente marcar uma página, marcar o conteúdo estático, de modo que você pode, então, vê-lo com um web browser. 

Mas essa é a chave. É conteúdo estático. Você escreve-lo, salvá-lo, e, em seguida, enviá-lo para você. E o servidor web serve então -lo para os seus visitantes. 

Mas nós estilizar coisas usando um diferente linguagem completamente. Começamos a usar um atributo de estilo em certos tags. E o atributo de estilo, vamos definir coisas como o tamanho da fonte e cor. E você provavelmente já começaram a descobrir, ou você vai logo para a final projetos potencialmente, ainda outro propriedades que você pode usar no CSS. E assim, em termos leigos, o que realmente, será que o CSS faz? Esses são apenas alguns exemplos dos mesmos. O que é que você faz isso HTML Não parece que a partir de que já vimos até agora? 

AUDIÊNCIA: Definir estilos por si mesmo. 

DAVID MALAN: Definir estilos por si mesmo. Assim, definir as coisas como aulas de como você pode ter encontrado, ou exclusivamente identificar nós em um documento para que você pode estilizar-los. Mas, mais especificamente, eu diria que a CSS realmente permite que você levar as coisas a última milha e permite que você especifique muito mais precisamente a estética, enquanto HTML para a maior parte deixa você estruturar suas páginas. 

E mesmo que existam alguns padrões, como vimos a tag para uma tag título, que a grosso modo fez coisas grandes e em negrito. Isso é uma definição muito genérica da marca - grande e corajoso. O tamanho da fonte é essa? Que cor é essa? Como negrito é isso? E CSS permite mais finamente sintonizar coisas assim. Bem como disposição, como alguns de vocês já viram. 

E, francamente, CSS é um pouco de uma linguagem confusa. É muito poderosa em que você pode fazer literalmente qualquer site que você tem visto na web hoje com ele, mas é um tipo de dor no pescoço. E alguns de vocês já bateu sua cabeça contra as paredes já só para fazer algo estúpido como centro de um menu no conjunto de problemas de sete se você chegou a Nesse ponto já. 

Mas perceber, essas coisas ficar mais fácil com o tempo. Você começa a notar padrões. E mais uma vez, o Google vai ser seu amigo para as várias maneiras em que você pode resolver estes tipos de problemas. 

E atrevo-me a dizer, com CSS, HTML e mais Geralmente, você pode resolver problemas em muitas outras maneiras, que pode muito bem ser correto, do que você poderia em algo como C, mesmo agora PHP ou JavaScript. Há apenas muitos diferentes maneiras para colocar as coisas para fora. 

Mas isso começou a ficar bagunçado, dissemos. Apenas tipo de commingling seu HTML e seu CSS com o atributo de estilo foi um pouco desleixado. E, assim, em vez disse, mais ou menos abstratamente falando, que você deve pelo menos começar a fator o seu CSS provavelmente. Atributos não seu estilo, mas pelo menos usar a tag de estilo dentro do que parte da página web? 

AUDIÊNCIA: Head. 

DAVID MALAN: Na cabeça. Até agora, só tínhamos o título se lá, mas você também pode adicionar um estilo marcar, e você pode colocar o seu CSS aproximadamente falando em direção ao topo da página. Mas, então, levou as coisas um passo adiante e nós consignado que mais em um arquivo separado. 

E assim, esses dois arquivos foram de alguma forma, agora ligados. E, de fato, foi o tag que fez isso. E o que foi um dos abrangente motivações para a nossa factoring CSS tudo o mais? 

AUDIÊNCIA: Reutilização. 

DAVID MALAN: Reutilização. Certo? Você pode ter visto em p definir sete já que muitas das páginas, a página de compra, a página de venda, o portfolio página, são, provavelmente, estruturado forma um tanto semelhante. Há um logotipo CS50 finanças no topo a não ser que você decidiu mudá-lo. Há um rodapé na inferior das páginas. E CSS permite que você depois de levar para fora lo em um arquivo separado para que se você quer mudar alguma coisa no mundo ao longo de todo o seu site, você pode realmente basta alterá-lo em um lugar. 

Mas há um preço a pagar potencialmente por ter consignado o CSS do meu arquivo HTML em um separado arquivo de referência com o tag, que vimos na segunda-feira. O que poderia ser o lado negativo disso? Pensando de uma semana atrás, para quando estamos falando sobre HTTP e TCP / IP e como a internet funciona. Algo aqui? 

AUDIÊNCIA: É preciso mais tempo. 

DAVID MALAN: É preciso mais tempo. Por quê? 

AUDIÊNCIA: [inaudível]. 

DAVID MALAN: Yeah. Por isso, sem dúvida, leva um pouco mais de tempo. Porque um, o CSS está obviamente não no mesmo arquivo. Então, agora você não tem que fazer um, mas dois pedidos. E cada um desses pedidos, como vimos em Chrome no chamado Inspector, e nós olhamos a guia de rede, cada desses arquivos requer um HTTP pedido, o que vimos leva uma certa quantidade de tempo. Agora, talvez não seja muito. Talvez seja apenas 20 milésimos de segundo. Talvez seja a 200 milissegundos. 

Mas pensar em uma página, como Facebook, ou CNN, ou o Google, que são muito maior do que os exemplos que temos olhei até agora. Essas páginas podem ter dezenas de arquivos, cada um dos quais pode exigir um Download de um arquivo. Então, as coisas podem potencialmente começar a desacelerar. 

E, especialmente nestes dias em que todos nós têm telefones móveis em nossos bolsos e conexões de internet mais lentas, ter que esperar mais alguns milissegundos, alguns mais milissegundos para adicional ficheiros podem realmente ser lento. Latência é a palavra que descreve o tipo de esperar que você tem que experimentar ao esperar algum pedaço de informação. 

Mas há um lado positivo. Portanto, não é todo o tipo de um - ele realmente é um pouco de uma gangorra aqui. Desvantagem agora, mas o que os navegadores podem fazer se eles são inteligentes, a fim de evitar ter que solicitar o mesmo styles.css arquivo novamente pode ser para fazer o quê? 

Cache-lo. Então cache - C-A-C-H-E - geralmente significa aqui apenas para salvar a arquivo que você solicitou pela primeira vez, e em seguida, verificar o seu cache para ele. Verifique você está tipo de recipiente de armazenamento, e se você já tem um cópia do styles.css, mesmo que algum outro página na p-set, ou em qualquer site, solicita-lo novamente, só para dar o usuário que mesmo cópia em cache. Não se preocupe que o solicite. 

Desvantagem lá, porém, como alguns de vocês ter tropeçado no p-set. Se você fizer uma alteração no servidor e você voltar para o navegador e você recarregar, por vezes, o navegador faz um favor e não se incomoda re-download de seu arquivo styles.css porque, vamos lá, quais são as chances que estes estilos que o Facebook usa vão mudar hora a hora ou dia-a-dia? É muito baixo. Eles podem mudar ao longo do tempo, mas não por minuto ou por hora. 

Assim, um truque, apenas FYI ao fazer web desenvolvimento, é frequentemente mantenha pressionada a chave mudar, por exemplo, e depois clique em recarregar no seu navegador, e que a vontade tipicamente dizer a recarga navegador tudo, até mesmo se você já tem no cache. Então, novamente, vantagens e desvantagens, mas todos eles em última instância, decisões de design. 

Então, agora, nós não apenas terminar a história aqui. Se eu agora ir para trás e para trás e para trás e volta, começamos a introduzir não apenas HTML, mas PHP. Assim, em termos leigos, o que O PHP vamos fazer? 

AUDIÊNCIA: [inaudível]. 

DAVID MALAN: O que é isso? 

AUDIÊNCIA: Apresente lógica no código. 

DAVID MALAN: Sim, introduzir lógica em seu código. Portanto, é uma linguagem de programação de verdade com loops e variáveis, e funções e condições, e todos as coisas que tenho usado caminho de volta quando, desde o início. E PHP, que já vimos, pode ser usado ou na linha de comando - é não tem que ter nada a ver com a web, mesmo que isso é realmente suas origens e que tende para ser bom e propício para - mas você pode usar o PHP apenas pela natureza o facto de que ele tem uma impressão () função, e uma função () printf, ou uma função () echo. Há grupos de maneiras que você pode imprimir um texto com PHP. 

Portanto, você pode usar esta programação língua para saída exactamente o que estávamos falando antes. Você pode gerar dinamicamente seu HTML. Talvez não toda ela. Talvez as coisas códigos rígidos, como o cabeçalho e rodapé, e logotipo, e suas folhas de estilo, e tudo isso. Mas para algo como-p definir sete, onde você está manipulando ações e mostrando a carteira do usuário, que é vai mudar dinamicamente, você pode certamente usar o PHP ea lógica que dá você como uma linguagem de programação para saída subconjuntos dinamicamente da página. 

Então, quando você fala sobre sites dinâmicos, ou programação web, que é o que você está realmente falando. Usando uma linguagem como PHP, ou coisas chamado Python, ou Ruby ou Java, ou Ainda outras línguas, para consultar um banco de dados muitas vezes, ou outro servidor, e depois cuspir dinamicamente HTML. 

Agora, o resultado final, como um aparte, é que o HTML da maioria dos sites, incluindo o seu set-p sete, é, provavelmente, vai ser uma grande confusão se você olhar para a fonte código em um navegador. Isso não é um grande negócio. Neste momento, quando nos preocupamos estilo, nos preocupamos com o coisas que você escreve. Não se preocupam com as coisas que o que suas saídas de código. Então não se preocupe com recuo aqui, se é que é PHP na verdade, a saída de material. Afinal de contas, o navegador não vai se importar, e um ser humano não estará olhando na fonte de qualquer maneira. Nós os funcionários, por exemplo, seria estar a olhar para o seu PHP. 

Então deixe-me dar um exemplo rápido agora de por que mais isso pode ser útil. Então, francamente, eu não me lembro da última vez que eu usei C para resolver um problema em no mundo real. Foi, provavelmente, na pós-graduação quando Eu precisava usar uma linguagem que foi bastante baixo nível e me deu a oportunidade de fazer algo muito alta realização de realmente salvar o maior número CPU ciclos como eu poderia, em grande parte, porque eu estava usando enormes conjuntos de dados, e todos os ciclos de CPU contadas. E, francamente, mesmo em coisas como telefones estes dias e outros dispositivos onde você não consegue ter tanto memória e você não consegue ter como muito CPU, usando linguagens mais rápidas ainda é atraente. 

Mas no mundo real, quando você acabou de quero jogar algum programa juntos para analisar alguns dados, ou se você tiver recolhido um monte de inscrições para algum grupo de estudantes e você quer muito rapidamente automatizar o envio de e-mails um por um para cada um daqueles inscritos, você está indo para alcançar uma linguagem de alto nível a C, por assim dizer. Algo como PHP ou Python, ou Ruby, ou uma meia dúzia de outros que existem nos dias de hoje. Mas os três são provavelmente o direito mais moderno agora. 

E o que isto significa é que você pode abrir um editor de texto como o gedit ou mais que qualquer outra coisa e depois é só começar escrever código sem ter que se preocupar sobre a compilação, sem ter que realmente se preocupar com o gerenciamento de memória, manter em mente que um pouco sloppiness acabará por voltar para mordê-lo, se o conjunto de dados fica maior ou o problema fica grande. Mas o que isso significa para nós é o seguinte. 

Deixe-me ir em frente e correr speller problema de definir seis. Então, esta é a minha implementação baseada em trie que I utilizado na grande placa onde eu não realizada tão bem. Nós vamos voltar em uma semana e revisitar aqueles que se acabar no topo da placa grande em nossa última aula. Mas, por agora, deixe-me ir em frente e apenas executar a minha solução no texto, e vamos fazer Bíblia do Rei James, e aqui vamos nós. 

Portanto, estas são todas as supostamente palavras com erros ortográficos fora de a Bíblia do Rei James. E minha implementação levou uma segunda metade do total. Então não é tão ruim neste determinado computador. Mas pense o quanto código que eu tinha que escrever. Pense em quanto código você tinha que escrever. Pense quantas horas você gastou no D-hall ou seu dormitório ou onde quer realmente codificação se essa solução. 

Bem, se eu realmente tenho um nível mais elevado linguagem como PHP, tome nota do o que posso fazer aqui. Em primeiro lugar, suponhamos que este é, ao invés seu código de distribuição. Este é um arquivo chamado speller. Ele está disponível como parte de hoje código de distribuição. E eu vou acenar minha mão, no máximo, dos detalhes, mas isso é realmente um exemplo interessante de como você pode portar uma linguagem como C até PHP. Eu literalmente abriu duas janelas de texto, uma com a minha versão C de speller.c, e eu só comecei a traduzi-lo em meu cabeça para PHP e digitando-lo usando os mais próximos funções equivalentes. 

Então, algumas dessas coisas são diferentes. Vimos da última vez que o PHP não usa incluir no exatamente da mesma maneira. Ele usa requerem tipicamente, embora incluem existe. Definir é um pouco diferente do # Define em C, mas isso é como nós fazemos uma constante. $ Argc despeja existe em PHP, por isso temos visto isso antes. Estes são apenas variáveis, todos que começam com cifrões. Lembre-se estes são apenas um bando de pontos flutuantes. 

Assim, longa história curta, você é bem-vindo para folhear este se curiosos, esta é quase uma conversão de linha para linha do Versão C de speller.c em PHP. E você pode fazer isso de novo para meia dúzia de outras línguas. 

Mas o que é interessante é isso. Ou o que é francamente desanimador é o seguinte. Deixe-me ir em frente e escrever sobre dictionary.php, e afirmam que eu sou indo para ir em frente e re-implementar problema de definir seis aqui. 

Então, vamos propor que, neste primeiro arquivo, que será implementado em PHP, então deixe-me abrir minhas marcas assim. Deixe-me dar-me um mundial variável, $ tamanho fica zero. E eu vou dar me uma tabela hash. Vou usar uma tabela hash para esta coisa. Como faço para declarar uma tabela hash em PHP? Concluído. OK. 

Então abra o suporte próximo suporte representa que em PHP, como vimos? Uma matriz, mas uma matriz que podia ser uma matriz associativa. Uma matriz associativa é uma estrutura de dados chaves associados com valores. 

Agora, o mais simples indexada numericamente matriz, as chaves são o quê? Zero, um, dois, três, certo? Old school coisas de volta a partir de C. Mas pode também ser strings como foo e bar, ou Maxwell, ou qualquer string. Então eu posso aproveitar essa em apenas um momento. 

Deixe-me ir em frente e declarar uma função como - vamos fazer load () em primeiro lugar. Assim, a função load (). E PHP é um pouco diferente, já que você literalmente tipo de função, mas você não digitar um tipo de retorno. Eu estou indo para ir em frente e dizer que o função load () deve levar em argumento $ dicionário, apenas como a versão C fez. Eu estou fazendo isso da memória. 

E proponho que eu sou vai fazer isso. Estou simplesmente vai fazer foreach. Eu vou chamar uma função chamada file (), passando o nome da ficheiro, que é a variável $ $ Dicionário como palavra. E, em seguida, dentro do meu laço for aqui, eu sou indo para ir em frente e guardar na minha $ $ Word tabela que fica verdadeiro. Concluído. Oh, espere. Concluído. OK. 

Isto é uma função da carga () dizer em PHP. Agora, por que isso funciona? E eu sou o tipo de trapaça aqui. 

Então, um, foreach vimos brevemente última vez. Significa apenas que você pode iterar uma matriz, sem se preocupar com i e n e, mais além, e tudo isso. Dicionário é, naturalmente, o nome do arquivo, algo como grande ou pequeno, os dois dicionários foram utilizados pela última vez. O arquivo é uma função que abre o texto arquivo, lê-lo em linha por linha, e mãos para trás um enorme variedade, cada um de cujos elementos é um linha desse arquivo. Então essa é a combinação de fopen, e fread, e enquanto loop, e fclose, e tudo isso. Finalmente, como a palavra significa apenas que o variável que eu vou ter acesso a em cada iteração neste loop. 

Assim, em breve, este forro aqui significa abrir o arquivo cujo nome é em dicionário, a variável, iterar linha por linha, e cada vez que você começa uma linha, loja em um chamado palavra variável, e, em seguida, fazer algo com a palavra. O que eu quero fazer? Eu quero colocar palavras na minha tabela de hash. 

Bem, eu posso colocar alguma coisa na minha tabela hash, assim como em C usando colchetes. Este é o nome de minha tabela de hash. Vou índice para esse hash mesa neste local. Portanto, não suporte a zero, não um suporte. Bracket citação unquote alguma coisa, o que essa palavra é. E, assim como você pode ter em seu tabela hash trabalho trie, basta armazenar efetivamente um valor booleano, implicitamente ou explicitamente. Concluído. Eu estou armazenando o valor verdadeiro. 

Agora há um par de coisas Estou cortando cantos aqui. Tecnicamente, não vai ser um nova linha irritante, / n, no final de cada uma dessas palavras. Então, eu provavelmente deveria chamar uma função PHP chamado costeleta (), que será literalmente cortar aquilo. E eu realmente preciso fazer outra coisa. Eu provavelmente deveria incrementar o tamanho de cada iteração, por isso estou mantendo o controle global do que é. E, francamente, e este é um dos aspectos estúpidos de PHP, se você estiver usando uma variável global, você precisa dizer explicitamente que você é. Então, eu estou indo realmente digitar mundial $ Tamanho, $ tabela global, e agora minha função é completa. 

Portanto, não é tão simples como antes, mas provavelmente levou menos tempo do que o C versão, talvez? OK. 

Então, agora vamos fazer a função de verificação (). Vamos ver se isso pelo menos levou o horas a fio que nos levaram em C. Então deixe-me ir em frente e declarar verificar como uma função. Toma na argumentação palavra, que é vai vir de speller. E eu estou indo só para verificar se o seguindo isset variável, mesa suporte strtolower de palavra - vamos equilibrar todos os meus parênteses - em seguida, retornar verdadeiro. Else - que era realmente o disco parte deste programa. Caso contrário, retornará false. Concluído. Isso é cheque (). 

Agora, por que isso funciona? Bem, um passei em uma palavra, que é uma string. Dois, eu estou verificando dentro do hash mesa, que é chamado de $ table. Estou forçando-o a minúsculas chamando uma função tolower bastante semelhante () em C, mas isso não a palavra inteira, não um único personagem. E se isso for definido, em outras palavras, não é um valor definido, por outras palavras, se for verdade, então sim, esta é uma palavra. Porque eu colocá-lo lá com load (). E se não, eu vou retornar false. 

Agora, os outros são fácil. Tamanho function (), como eu faço isso? Eu basicamente não retornar $ size. Mas tecnicamente precisa fazer essa coisa irritante. E na verdade se ouvir, eu estava cortando um canto muitos. Eu realmente preciso fazer $ table global. 

Mas o que foi dito, descarregar). Descarregar () é incrível. Função descarregar (). Como é que eu quero implementar descarregar (?) Concluído. OK. 

Então descarregar (), gerenciamento de memória é completamente tomado cuidado para você algo como PHP e muito de linguagens de alto nível. Então, isso é incrível. Como por que diabos nós passamos o passado oito semanas, além de redação C aparentemente muito lento, muito tempo problemas de consumo com dezenas de horas de trabalho sob os cintos? 

Bem, por um lado, isso pode funcionar muito bem para pequenos programas. Ele certamente acelerou o meu tempo de desenvolvimento. Mas vamos ver o que acontece no mundo real. 

Deixe-me ir para este diretório em uma janela de terminal. Há speller. E observe como um aparte, e você pode encontrei este conjunto de problemas em seis ou sete conjunto de problemas. Você não tem estritamente acabar com arquivos PHP com. php. Se você colocar uma linha como a primeira em o topo, que é uma linha especial de sintaxe que significa, essencialmente, encontrar o programa chamado PHP e usá-lo para interpretar este arquivo. Então, agora ninguém sabe realmente o que Estou executando um programa PHP. Eu posso executá-lo apenas como se foram algo compilados em C. 

Mas aqui está a coisa. Na verdade, vamos fazer isso de novo. Dropbox/pset6 /. Há speller. OK, 0,44 segundos. Ele ficou mais rápido dessa vez. 

Agora vamos para a versão PHP. Toque agradável. Mas basta pensar quanto tempo Salvei em horário de expediente. OK. 

Então 3,59 segundo, o que realmente não soa precisa também. Mas isso é porque longa história curta, quando você estiver imprimindo uma grande quantidade de material para a tela, que si atrasa as coisas. O que realmente levou o CPU no aparelho foi de 3,59 segundos, em contraste com C, que tomaram 0,44 segundos mais recentemente. Isso é realmente uma ordem de magnitude diferente. 

Então, onde é que o preço vem? Por que é muito mais lento? Por que o PHP executar tão mal? Danielle? 

AUDIÊNCIA: Você realmente não utilizar uma tabela hash. 

DAVID MALAN: Eu realmente não utilizar uma tabela hash. Então eu meio que fiz. Portanto, é um array associativo. O mais provável é que as pessoas em PHP são muito inteligente, eles usavam por baixo da capa uma tabela hash que foi realmente executado em algo como C ou C + +. Mas. Sim. 

AUDIÊNCIA: [inaudível]. 

DAVID MALAN: Yeah. Assim, cada uma das funções que eu escrevi agora - Na verdade, você pode dizer que mais uma vez por pouco mais alto? 

AUDIÊNCIAS: Cada uma das funções que você incluiu tem muito mais completo capacidade do que - 

DAVID MALAN: Então, isso é muito verdadeiro. Há muito mais sobrecarga que estamos não realmente vendo, concentrando-se apenas em dictionary.php, que eu acabei de escrever. Por outro lado, há um intérprete inteiro ir ao fundo. Na verdade, quando eu corri este programa, ele não estava funcionando zeros e uns compilados projetado para o meu CPU Intel. Em vez disso, ele estava correndo linha por linha Código PHP que parece exatamente como se digitou. E assim, sempre que você usar uma linguagem interpretada, você realmente fazer pagar esse preço. Vai levar algum tempo para ler seu topo arquivo para baixo, da esquerda para direita, e então executar cada linha de novo e de novo. 

Agora, na realidade, especialmente na web, você pode realmente acelerar esse processo armazenando em cache os resultados da Código PHP que está sendo interpretado. E isso faz sentido na web, porque se você não tiver um usuário, como me aqui, mas 1.000 ou 10.000 usuários, em seguida, talvez a primeira vez que o arquivo é acessada é lento, mas, posteriormente, é muito mais rápido. 

Mas isso também, mais uma vez, é um trade off. E para algo como um dados de pesquisa conjunto, ou mesmo algo grande como isso, seus usuários, eventualmente, começar a sentir que a desaceleração. 

Assim, em breve, interpretado línguas são muito em voga, muito popular, e francamente são, provavelmente, os idiomas que deve chegar para a resolução de problemas subsequente para CS50. Mas perceba o quanto você está realmente tendo por certo debaixo do capô realmente essas últimas semanas em Hash tabelas e árvores, e tentativas, os quais são utilizados, em última instância para realmente implementar coisas como suporte aberto, colchete, que podemos agora gratidão tomar para concedido. 

Então, vamos dar uma olhada agora neste contexto web. E eu mencionei da última vez que não há um bando de superglobais em PHP que não são realmente relevantes na linha de comando. Eles são mais relevantes no contexto de usar o PHP em um contexto web. Então, rodando o PHP em um servidor web, a fim para gerar coisas como HTML. 

E olhou para $ _GET e $ _POST, e que é onde os usuários automaticamente ' entrada acaba simplesmente se você enviar uma formulário para um arquivo que termina em. php em um web servidor como o aparelho. Mas vamos examinar brevemente $ _COOKIE E $ _SESSION. 

Em termos leigos, o que é um cookie como entendê-lo no contexto de usando a web? 

AUDIÊNCIA: ficheiro para o computador. 

DAVID MALAN: Yeah. É um arquivo no computador do usuário plantada por qualquer website acontecer de você visitar. Então, quando você vai para o Facebook, quando você vai para bankofamerica.com, quando você vai para google.com, quando você vai a quase qualquer website no mundo nos dias de hoje, incluindo cs50.net, um cookie é plantada no seu computador, o que é ou um valor armazenado na memória RAM em seu computador na memória do seu navegador, ou às vezes, na verdade um arquivo armazenado em seu disco rígido. 

E o que normalmente armazenados no arquivo não é o seu nome de usuário, e não o seu senha, normalmente não é algo sensível a menos que o site não é tão bom com a sua segurança, mas sim é um grande identificador exclusivo entre outras coisas. É um número aleatório grande plantado em seu computador, mas você pode pensar como uma espécie de selo de mão virtual como de um clube ou algum parque de diversões que permite que a equipe, os proprietários desse serviço, para lembrar quem você é. Então, se o número aleatório grande é como 12345678, apesar de que, obviamente, não muito aleatório, pense que, como o selo de mão que quando você visita facebook.com pela primeira vez, eles carimbar esse número em sua mão. E então, porque você fala HTTP, você sendo um navegador, e por causa do Facebook obviamente fala o mesmo que um web servidor do protocolo HTTP que diz sempre que, posteriormente, visitar facebook.com, quer se trate de um segundo mais tarde, uma hora mais tarde, mesmo no dia seguinte, contanto que você não tem explicitamente desconectado, o que efetivamente é como lavar as mãos. HTTP diz que você deve apresentar seu selo mão toda vez que você voltar para o site. 

O Facebook, então não é que eles olha aquele selo de mão e eles dizem, oh, 123456789. Eu não sei, à primeira vista que este é David Malan, em Cambridge, Massachusetts, mas eles podem verificar o seu banco de dados e dizer, oh, a pessoa em cujo computador plantamos 123456789 é David Malan de Cambridge, Massachusetts. Vamos mostrar que o usuário, em seguida, o perfil dele página ou do seu Feed de notícias. 

Mas há um problema aqui, se este É assim que a web de fato funciona. Vamos dar uma olhada em um exemplo rápido. Vamos realmente ir dizer facebook.com. Mas antes que pudéssemos ir para lá, vamos me ir em frente e abrir Chrome Inspector aqui. Deixe-me olhar para a aba de rede. E agora vamos em frente e digite em https://facebook.com. E eu estou fazendo isso para que nós não vemos todos esses redirecionamentos e resíduos tempo olhando através delas. Deixe-me aperte enter. 

Tudo bem. Nós vemos um monte de pedidos. Chega Facebook. Há um monte de arquivos. E aqui, por minha menção de latência da última vez, isso é um monte de solicitações HTTP. Mas o primeiro é provavelmente o mais interessante. 

Então, vamos rolar para baixo aqui, e Vou aumentar o zoom em um segundo. Esta vai ser uma espécie de uma bagunça, mas vamos ver. Facebook está nos enviando um todo monte de coisas. 

Mas ei, interessante. Eles estão plantando não um, mas quatro selos de mão para o meu lado aqui. Set-Cookie, Set-Cookie, set-cookie set-cookie. E existem algumas características aqui. Todos eles mencionar alguns tipo de validade. E parece que o Facebook está esperando para me lembrar até 2015. Então, isso é, presumivelmente, o tempo em que Devo sair ou eles simplesmente assumem automaticamente que eu sou não voltar. Então, isso é realmente um decente quantidade de tempo. 

E há alguma outra coisas acontecendo aqui. Este cookie parece ser forçosamente excluída, dizendo que expirou em 1970 antes existia cookies. Assim, o navegador é só ir assumir OK, isso é como lavando o selo mãos. 

Mas agora, quando meu navegador faz um pedido posterior - deixe-me ir em frente e fazer isso novamente e reload. Agora deixe-me rolar de volta para a pedido topo e descer aqui, solicitar cabeçalhos. Observe isso. Então agora eu estou sob cabeçalhos não resposta, mas aviso que diz cabeçalhos de solicitação. E note que o meu computador, como parte de o seu pedido depois de bater de recarga tem enviado pelo menos os seguintes informações. Não Set-Cookie, mas cookie. Portanto, esta é a linha, o cabeçalho HTTP para dizer, onde o meu navegador é uma espécie de sem que eu soubesse apresentando minha mão para inspeção do Facebook. 

Então, esses cookies podem ser usado então para quê? Para se lembrar de quem você é, ou se lembrar de como muitas vezes você já esteve lá, ou realmente nada. 

Então aqui está counter.php. E deixe-me ampliar a fonte. E cada vez que eu recarregue esta página, aviso é lembrar quantas vezes Eu estive lá. Bem, isso não é tão impressionante. Vamos fechar essa guia, e agora vamos voltar para http://localhost/counter.php. 

Oh, isso é interessante. Ele ainda se lembrava, mesmo embora eu fechei a guia. E, francamente, se eu fechar o browser, se implementada da maneira certa, eu poderia ainda lembrar que este usuário é que ele ou ela era a primeira vez, e apenas uma vez eu vou para o menu do Chrome, que aqui está aqui, e ir para Histórico e clique em Limpar dados de navegação, como alguns de vocês podem ter no passado, só então os cookies realmente ser apagado durante web desenvolvimento. 

Então, se nós vamos - vamos fechar-se gedit aqui. E se nós vamos agora para este arquivo. Deixe-me ir para o nosso vhosts / localhost / public, e deixe-me fazer counter.php. Observe que esta é uma bonita programa simples. É um site bem simples. 

Assim, a parte superior do arquivo está apenas a comentários. Mas aqui está uma nova linha que você pode Já vimos em-p definir sete, session_start (). Esta é uma linha de código PHP que essencialmente, diz o servidor web, fazer Certifique-se de carimbar as mãos e fazer Certifique-se de verificar carimbos manuais. Isso é tudo o que a linha faz, e faz todo esse processo para nós. Então observe Eu só tenho duas filiais aqui. Se o contador chave dentro desta variável global especial chamada $ _ Session está definido - por outras palavras, se há algum valor lá - vamos obtê-lo e armazená-lo em um local de variável chamada $ contador. Senão, vamos atribuir $ counter o valor padrão de 0. 

Ora aqui está um aspecto do PHP que é tanto uma bênção e uma maldição. PHP é um pouco desleixado. Assim, enquanto no C, o que seria o âmbito do contador foram seja aqui ou aqui? 

Teria sido confinado a essas chaves. Adivinha o quê? No PHP, ele existe mesmo fora dos chaves, aqui, e aqui, e aqui, e aqui, e mesmo abaixo. Então eu digo isso é uma bênção, no sentido que você não tem que pensar como duro como fizemos semanas. Mas também é um pouco de uma maldição em que não importa onde você usa uma variável em PHP, pelo menos em um programa como este, é globalmente acessível para melhor ou para pior. Então você tem que ter em mente agora que suas variáveis ​​não pode ser indefinido. Você pode ter definido outro lugar. 

Mas o que é que eu vou fazer, em última instância? Eu estou indo para armazenar dentro desse mundial variável como um valor do contador chave o resultado de fazendo contra mais 1. Portanto, esta é apenas a aritmética que faz o incrementação do contador que. E o fato de que eu estou armazenando que valor de volta aqui é meio para essencialmente atualizar o banco de dados para lembrar que 123456789 utilizador esteve aqui duas vezes. E quando eu fazê-lo novamente na próxima vez que recarregar a página, ele vai verificar meu selo mão e dizer, oh, 123456789 usuário tem agora Estive aqui três vezes. 

E então o que linguagens PHP e similares estão fazendo para nós é que eles estão tentando como e onde e por quanto tempo para armazenar valores neste especial superglobal. E esse superglobal na próxima vez que visite a página é uma espécie de passe de mágica pré-povoada, cheia de valores que estavam lá a última vez que você visitou, se isso era um segundo atrás, uma semana atrás, ou em 2013, e agora estamos falando sobre 2015. PHP eo servidor web cuidar de tudo isso para você. 

AUDIÊNCIA: [inaudível]. 

DAVID MALAN: Variáveis ​​em PHP são essencialmente global, a menos que você sempre declará-los dentro de uma função, e, em seguida, eles são locais para apenas a função. Mas porque eu não tenho escrito qualquer funções, eles estão agora efetivamente mundial ao longo de todo o meu arquivo aqui. 

AUDIÊNCIA: Existe uma maneira para torná-los local? 

DAVID MALAN: Existe alguma forma a torná-los local? Só por envolvê-los em funções. Que na última versão do PHP, você pode fazer isso com uma função anônima. Mas mais sobre isso no contexto de JavaScript. Mas a resposta é não. A resposta mais longa é sim. Nice. Boa pergunta quiz. Tudo bem. 

Então, por fim, a página em si é realmente muito simples. Observe que uma vez que eu sair do modo PHP, lembre-se que todo este material para baixo abaixo é só ir para obter espeto a matéria para o navegador. O que é bom, porque eu quero enviar o usuário um pouco de HTML, mas eu quero para atualizar dinamicamente que HTML. E uma maneira que eu posso fazer é classificar de cair muito rapidamente de volta para PHP modo, use aberto suporte de interrogação sinal de igual, e, em seguida, o valor de saída do contador. 

Ou, se isso parece um pouco enigmática, este sinal de igual é na verdade apenas alguns açúcar sintático para este printf ($ contador). Mas, francamente, isso é só um pouco feio e um pouco chato de digitar. Então PHP muito bem oferece esse recurso onde você pode apenas dizer que mais sucinta da mesma maneira. 

Então, o que está acontecendo por baixo o capô? Vamos olhar rapidamente na rede guia aqui para counter.php. E deixe-me ir em frente e primeiro Vamos limpar os cookies. Limpar dados de navegação Vamos desde o início do tempo. Agora vamos voltar para cá. Agora vamos recarregar a página. E eu estou de volta a zero. Porque o meu selo de mão foi lavado, Agora começa um novo cookie. 

De fato, se eu olhar para o guia da rede e olhar para cabeçalhos de resposta, observe que o aparelho está me enviando um cookie cujo nome é um pouco arbitrariamente, mas o tipo de razoavelmente, PHPSESSID. E isso está me mandando isso realmente número aleatório grande. Não é um bom número. Não é bem hexadecimal. É uma espécie de seqüência alfanumérica, mas provavelmente é aleatória. E esse é o selo de mão, de modo a falar que eu estou me referindo. 

Enquanto isso, se eu clicar em recarregar e, em seguida, olhar para esta segunda linha para a minha segunda pedido, observe agora que o meu pedido cabeçalhos incluem PHPSESSID iguala esta, não set-cookie, mas apenas cookie. E isso é a apresentação do meu navegador do meu selo de mão. 

Então, agora como um teaser, e nós vamos falar mais sobre isso em uma semana ou assim, mas de que forma isso faz você vulnerável, sua conta de Facebook vulneráveis, e outros, tais contas vulneráveis? 

AUDIÊNCIA: Se alguém tem o seu cookie. 

DAVID MALAN: Sim, se alguém tem seu cookie. Quero dizer, realmente, muito parecido com alguns de vocês poderia ter tentado a como um clube ou um parque de diversões, se você tentar alguma coisa como este para copiar o selo, embora para trás a mão de outra pessoa, e então ele ou ela apresenta como conta própria, se ele realmente se parece idênticos, 123456789, então a teia servidor aparentemente está indo só para confiar em que o usuário é você. 

E isso é realmente um direito fundamental ameaça a qualquer momento você usar cookies porque se alguém apenas satiriza assim falar o seu cookie, descobre o que é, seja por realmente copiá-lo , olhando para o seu computador e sendo assim, OK. Bolinho de David é JJ3JIK e assim por diante, e, em seguida, eles são inteligentes o suficiente para saber como classificar de enviar manualmente que biscoito a partir de uma ou de um navegador programa eles escrevem, eles poderiam totalmente entrar em um site que você. Não é tão difícil de fingir ser outra pessoa, a menos que revisitar p-set dois, que introduziu o quê? 

AUDIÊNCIA: Criptografia. 

DAVID MALAN: Um pouco bit de criptografia. Criptografia simples, pelo menos na Standard Edition, mas crypto no entanto. menos. Assim, verifica-se se você criptografar todos estes cabeçalhos usando algo que você pode agora saber mais familiarmente como SSL, secure socket layer, ou URLs https:// em seguida, todas essas coisas que estivemos olhando são realmente criptografado, o que significa que é como se você não consegue ler o selo mão. Apenas facebook.com pode, ou google.com, ou, neste caso, o aparelho pode leia esse selo mão. 

Tragicamente, porém, e mais uma vez, este é muito apropriado com o material NSA de tarde, mesmo SSL é quebrável. E na verdade não é tão difícil até mesmo quebrar a criptografia. Não tanto por quebrar a criptografia, mas enganando o navegador para descriptografar os dados prematuramente. Mas, novamente, vamos provocá-lo com que em pouco tempo. Por agora, basta ter medo. É tragicamente tipo de verdade. 

Tudo bem. Então, onde é que isto agora nos deixa? Bem, vamos fazer isso. Vamos em frente e dê uma rápida provocação antes de fazer uma pausa. E eu acho que nós vamos demorar um pouco mais hoje, mas vamos mergulhar algo novo e sexy, que será aguçar o apetite para mais. Então, isso é o teaser. 

Então, SQL, começamos a falar sobre sempre tão brevemente última vez. Você realmente vai sujar as mãos com alguns deles em-p definir sete. E, em termos leigos, o que faz SQL - S-Q-L - para você? O que é isso? Sim. 

AUDIÊNCIA: Vamos-lhe dados de acesso. 

DAVID MALAN: Yeah. É você deixar os dados de acesso numa base de dados. Structured Query Language. E isto é, essencialmente, um linguagem de programação. Existem recursos de que não vamos mesmo usar em sala de aula. Mas você pode efetivamente definir funções. Eles são chamados armazenados procedimentos em SQL. Mas nós vamos mantê-lo bastante simples e apenas usá-lo para algumas operações básicas como a seleção de dados, inserção de dados, atualização de dados e exclusão de dados. 

E você pode realmente pensar em um banco de dados, como um banco de dados SQL, como apenas sendo Microsoft Excel. Como o SQL se refere a um relacional base de dados, onde relação significa apenas tabelas. Linhas e colunas. Então, qualquer coisa que você pode colocar em uma planilha assim ou o Google Docs, você poderia colocar em um banco de dados SQL declarando uma tabela. 

Agora, como você realmente acessar essa informação? Bem, com comandos ou consultas como esta. SELECT, INSERT, UPDATE e DELETE. E para a maioria dos casos, estes são o quatro apenas ingredientes que você precisa para fazer algo bastante poderosamente no conjunto de problemas sete. 

Agora, de volta ao dia, você realmente interagir com um banco de dados em um janela do terminal preto e branco em um prompt piscando assim. E o banco de dados que estamos executando no aparelho é chamado MySQL, que é motor de banco de dados livre e open source. Se você Google e ler a Wikipedia artigo, você vai saber que o nome é um pouco de transição para alguns versões do Linux. Banco de dados de Maria é na verdade um garfo para falar de MySQL. 

Longa história curta, a Oracle comprou a MySQL. A Oracle é uma grande empresa. As pessoas têm medo de que seria já não permanecem bastante como open source, então este é apenas uma cópia do MySQL que é ainda livre, ainda open source, e instalado no Fedora Linux por padrão. 

Mas este é um tipo de dor no pescoço para se familiarizar com a banco de dados desta forma. Assim, incluir no aparelho CS50 uma ferramenta open source gratuito chamado phpMyAdmin. Apenas uma coincidência que é escrito em PHP. Não há nenhuma base necessidade de PHP aqui. Mas esta é apenas uma ferramenta baseada na Web que que baixado gratuitamente, instalado em o aparelho, que nos permite ter uma interface gráfica do usuário com o qual para explorar a base de dados de sete-p definida com que para criar novos bancos de dados, dizer para o seu próprio projeto final se tivesse como e, finalmente, criar sites dinâmicos como CS50 Finanças que lhe permitem consultar dados e atualizar os dados dinamicamente. 

Você não vai ter que usar apenas um arquivo de texto simples ou CSV. Você pode realmente usar um banco de dados inteligente programa para que você possa executar mais consultas sofisticadas do que apenas a leitura através de tudo de forma linear. 

Assim, por exemplo, é isso que nós damos você fora da caixa para-p definir sete. Esta é uma tabela com, aparentemente, pelo menos três colunas, uma das quais está nome de utilizador, um dos quais é de hash, e o outro dos quais é ID. 

Mas a coisa interessante, e apenas para destrinchar um pensamento aqui, nome de usuário é, presumivelmente, já único, certo? Quero dizer, a maioria qualquer site, se você tem um nome de usuário, não Não pode haver dois Césares. Não pode haver dois Malans. Não pode haver dois jharvards. A sua única. Caso contrário, eles não sabem o que jharvard que realmente é. Então, o que pode ser a motivação para também tendo uma terceira coluna da esquerda lá chamado ID, o que parece um número que é semelhante única? Parece um pouco redundante para mim à primeira vista. Por isso pode ser atraente para ter não apenas nomes de usuários únicos, mas também números exclusivos? 

AUDIÊNCIA: Eles poderiam ter a mesma senha. 

DAVID MALAN: As pessoas podem ter a mesma senha, com certeza. Isso pode absolutamente acontecer. Mas se eles têm esse nome de usuário único, I diria que isso não faz muito matéria, porque se eles digitar seu nome de usuário, eu só preciso verificar a sua senha, seu hash de facto. Por que mais? 

AUDIÊNCIA: Mais rápido pesquisando. 

DAVID MALAN: Faster pesquisa. Por quê? 

AUDIÊNCIA: ID é apenas um. 

DAVID MALAN: ID é apenas um personagem, ou para ser mais preciso, é um número, por isso é provavelmente 32 bits ou algo assim. Considerando que o nome de utilizador, aparentemente Jason Up de Hirschhorn não é uma espécie de ridiculamente muito tempo, e que vai me levar muito mais tempo para string comparar H-I-R-S-C-H-H-O-R-N, e talvez a / 0 ou algo assim, em ordem para procurar Jason, ao invés de apenas dizendo-me dar o número do usuário dois. Isso é 32 bits. É um único INT que você tem que comparar. E, de fato, é exatamente por isso que os bancos de dados tendem a atribuir IDs únicos para linhas neles. 

Agora, o que outros tipos de dados estão lá além de INT e, aparentemente, cordas como este? Bem, para ser mais adequada, Bancos de dados SQL, como MySQL, têm campos CHAR. E CHAR um pouco enganadora não é uma única CHAR. Um campo CHAR em um banco de dados MySQL é um ou mais caracteres, mas é um número fixo de caracteres. 

Assim, por exemplo, se eu passar por cima de phpMyAdmin como você já deve ter ou em breve um conjunto de problemas de sete, e eu vou para o meu banco de dados, e apenas por diversão, vamos criar uma nova tabela chamada testar com apenas duas colunas. Eu vou clique em Ir. E isso vai se tornar muito familiar, especialmente quando você mexer em torno de seu próprio país. Aqui posso digitar ID para criar uma nova tabela do tipo INT. Mas aqui eu pode digitar nome de usuário para recriar a tabela anterior. E notem que eu tenho um grupo inteiro de tipos para escolher. 

E isso também é por isso que phpMyAdmin é uma espécie de bom. É uma espécie de auto-aprendizagem, em que você pode apenas uma espécie de ponto e clique, e olhar para menus suspensos, e inferir que o que lhe dá poderes SQL. 

E, de fato, se eu escolher CHAR, então eu tem que especificar o comprimento, ou como diversos valores, quantos CHARs. Valores muito comuns são coisas como 255, mas isso é um pouco longo. Comumente é de oito para um nome de usuário. Mas isso é um pouco pequeno estes dias. Portanto, esta é uma decisão de projeto. É 8 caracteres no máximo, 32, 255, 1000? É realmente até você. Mas um campo CHAR é um número fixo. Portanto, escolha muito poucos e você é do tipo parafusado, se você quer um nome de usuário maior. Escolha demais e que é a desvantagem? 

AUDIÊNCIA: [inaudível]. 

DAVID MALAN: É um desperdício. Assim como em C, se você tem uma maior pedaço de memória que você precisa, você está apenas perdendo tempo e desperdiçando espaço. Assim, como uma alternativa, existe VARCHAR, que resolve este problema Duração do tratamento e não como um comprimento fixo, mas como o comprimento máximo, e usando um número variável de caracteres, que, em seguida, tende a usar apenas o número de CHARs como você realmente precisa. Isso soa perfeito. 

Por que não se livrar do Tipo de dados char, então? O que poderia ser a desvantagem de usando VARCHARs, que soa como se fosse uma bela vitória? Sim? 

AUDIÊNCIA: [inaudível]. 

DAVID MALAN: OK, muito bom. Então, se todos os seus dados é o mesmo comprimento, qual é a preocupação? 

AUDIÊNCIA: Porque você está desperdiçando dados, dizendo-lhes tudo. 

DAVID MALAN: Então, se todos os seus dados é o mesmo comprimento, porém, eu diria especificando que o comprimento máximo em VARCHAR não é diferente de especificando um comprimento fixo sobre se CHAR você sabe que o número de antecedência. Mas não é verdade, e eu vou classificar de extrair que a resposta à realidade que ainda há um máximo, o que poderia ser irritante, especialmente se você encontrar o nome de uma pessoa que está excepcionalmente longo que você não fez antecipar. E também é um pouco menos eficiente para realmente pesquisar sobre VARCHARs como oposição à busca CHARs, especialmente para mesas compridas que têm lotes e grandes quantidades de dados. Portanto, aqui também, temática é novamente nenhuma escolha óbvia. 

Então, só para lhe dar uma sensação de outro tipos de dados que podem ser de seu interesse tanto para p-set sete ou o futuro, há INT. Há BIGINT, que é como long long. Ele tende a ser de 64 bits. Há decimal, que você verá no o conjunto de problemas, que é um tanto limpador resposta aos problemas que encontrado com flutuador e flutuando imprecisão ponto. E depois há DATETIME. Há, literalmente, um tipo de dados que tem a aparência de um ano, um mês, um dia, e uma hora, minuto e segundo. 

Mas bancos de dados SQL também têm coisas que vou chamar índices. E um índice é algo que você especificar ao criar a tabela de fazer pesquisas e outras operações mais eficiente. Especificamente, há algo chamado o índice primário que você poderia declarar como se segue. 

Fizemos isso para você com a tabela de usuários que te dar. Mas repare se eu fosse recriar manualmente a tabela de usuários aqui dando um nome de usuários. Eu já especificado ID. Eu especifiquei INT. Eu especifiquei nome de usuário com máximo de 32 caracteres. Mas se continuarmos a rolagem neste bastante ampla janela, observe que há uma monte de outras coisas que eu posso especificar. 

Um deles, posso especificar atributos como, você sabe o quê, isso INT deve ser assinado. Eu não quero que os números negativos, então vamos fazê-lo sem sinal. Nulo não é relevante aqui porque Eu quero que cada usuário têm um número ímpar. Eu não quero que seja nulo. 

Mas isso é interessante. Eu posso especificar que ID seja o chave primária desta base de dados, ou é texto único, ou é indexado, ou completo. Assim, para fins de hoje, a longa história , principal meio curto que este deve ser tanto conceitualmente e tecnicamente o campo que usamos para excepcionalmente identificar os usuários. 

Assim, quando olhamos para os usuários, esta é uma espécie de uma promessa de procurá-los principalmente por que identificador exclusivo. E o banco de dados irá garantir que, se você tem um número de usuário 3, você não pode inserir fisicamente outro usuário com o mesmo número 3. O banco de dados vai simplesmente se recusam para salvar suas alterações. Que é uma coisa boa, porque você pode proteger-se de si mesmo. eu 

Alternativamente, o nome de usuário. Assim, a segunda linha, aviso, é o campo de nome de usuário. Assim, a segunda linha aqui é nome de utilizador, como fizemos no canto esquerdo lá. 

Então, o que mais eu poderia querer especificar? Eu não estou autorizado, de acordo com o SQL, para especificar duas chaves primárias. você pode especificar uma chave de conjunto, onde você olhar para ambos os campos, mas não podem ser individualmente chaves primárias. Então, isso é fora de questão. Então, o que eu poderia querer escolher? 

Bem, UNIQUE é semelhante em espírito a um chave primária, onde você especificar esta campo deve ser único, mas é não vai ser o único Eu uso o tempo todo. E nós não estamos indo para usar este tudo o tempo para o que razão outra vez? É mais lento, potencialmente, se é uma longa username. É apenas um desperdício de tempo. 

INDEX, por sua vez, especifica que é não vai ser único, mas eu gostaria você trabalhar sua magia debaixo do capô para torná-lo mais rápido para mim pesquisa neste campo. Então, isso provavelmente não é relevante aqui. Para nome de usuário, eu diria que UNIQUE é uma boa resposta. Mas suponha que fizemos os usuários mais interessante do que apenas nomes de usuário, hashes, e números de identificação. E se deu às pessoas nomes completos? E se nós lhes deu endereços e outros dados sobre eles? 

Bem, se você especificar que uma coluna em uma banco de dados é indexado, isso significa que MySQL ou Oracle, ou qualquer banco de dados você está usando, deve trabalhar a sua magia e usar algum tipo de dados fantasia estrutura como uma árvore, ou uma trie, ou um tabela hash, ou algo para garantir que quando você pesquisar dados usando selecionar nesse campo em particular - como eu mostrar a todos que vive em Oxford Street. Uma consulta assim. Se você tiver especificado de antemão que você quer um índice em que campo, o pesquisas serão muito, muito mais rápido. 

Se você não especificar um índice, o melhor você pode fazer é uma busca linear se ele não está classificada. Mas se você especificar INDEX, o inteligente pessoas que fizeram o banco de dados - pessoas como você que agora conhece árvores e tentativas e tabelas de hash - vai construir automaticamente um tal de dados estrutura na memória RAM para se certificar de que essas pesquisas são muito mais rápidos. 

FULLTEXT, entretanto, é semelhante em espírito, mas permite que você faça curinga pesquisas, como eu mostrar a todos que mora em ruas que começam com a letra O, por qualquer motivo. Você pode fazer pesquisas curinga assim. Ou coisas mais fortes, como mostram me todos os que tem a palavra - me mostrar a todos cujo nome começa com uma carta particular. Você pode pesquisar por palavras-chave desta forma. Tudo bem. 

Assim, oportunidades de design há potencial. Há outros que eu vou acenar as mãos no. Acontece que você pode ter mecanismos de armazenamento diferentes. E isso é mais misterioso do que precisamos certamente para o problema de definir sete. Por padrão, o que vocês estão usando algo chamado InnoDB. Você verá menção a isso em algum lugar A interface do phpMyAdmin mais provável. Mas sei que há outro projeto decisões que são de potencial juros vêm projetos finais se você faz algo baseado na web. 

Mas vamos fazer isso. Vamos em frente e colocar isso no tela como um teaser para uma história envolvendo você, um companheiro de quarto, e um copo de leite. Vamos dar um dois minutos ou então quebrar aqui. E se você pode ficar por aqui, vamos chegar para trás, olhar um pouco mais em SQL, e em seguida, um pouco de JavaScript com -p definir oito em mente. 

Tudo bem. Então, vamos começar a pensar sobre um caso canto que pode muito facilmente surgir no contexto da utilização de um banco de dados, ou francamente, mesmo usando as coisas do mundo real como caixas eletrônicos para conseguir dinheiro. Então aqui está um frigorífico. Suponha que você tem um também em seu dormitório ou sua casa. E você tem um companheiro de quarto, e ambos você realmente gosta de leite, por exemplo. 

Então você chega em casa da aula um dia. Ele ou ela ainda não voltou. Você abre a geladeira. Você realmente quer um grande copo de leite. Não há leite. Então, o que você faz? Você fecha da geladeira. Você agarra suas chaves. Você sai para a praça. E você começa na fila CVS àqueles coisas Self Checkout, que sempre demorar mais tempo do que realmente ter caixas. De qualquer forma. 

Então, enquanto isso, dot dot dot, seu companheiro de quarto chega em casa e ele ou ela da mesma forma tem um desejo ardente um pouco de leite. Assim, ele ou ela abre a geladeira, olha para dentro, e oh, droga. Não há leite. Assim, ele ou ela vai para fora, acontece a ir para o outro CVS, que era apenas um bloquear afastado por algum motivo, e ele ou ela fica na fila para comprar um pouco de leite. 

Enquanto isso, você chega em casa, ele ou ela chega em casa, eo que fazer você finalmente tem? Duas vezes mais leite. Mas você realmente não gosto leite muito. Então agora você tem tanto leite que agora um deles só vai azedar eventualmente. Portanto, este é um problema muito ruim. Certo? 

Então o que aconteceu? Então, fundamentalmente, este é o tipo de um exemplo ridículo. Mas debaixo do capô, o que nós tivemos acontecer aqui é tanto de você verificados o estado de algum pedaço de memória, a geladeira. Ambos você verificou o estado de alguma variável. Vocês dois tiraram uma conclusão que, em seguida, executado. Mas, infelizmente, enquanto seu companheiro de quarto estava na loja, o estado desse variável mudou, ele ou ela voltou e agora quer mudar o estado, mas ele já foi mudado sobre ele ou ela. E, claro, ele ou ela não teria ido à loja se eles sabiam que já estavam a caminho. 

Assim, no mundo real, como você pôde evitar esse problema, supondo que você tem uma geladeira, você tem um companheiro de quarto, e você realmente gosta de leite? 

AUDIÊNCIA: Comunicação. 

DAVID MALAN: Comunicação. OK. Mas como você pode se comunicar? 

AUDIÊNCIA: Deixe um recado. 

DAVID MALAN: Deixe uma nota, certo? Sempre deixar uma nota, por os fãs da série. Tudo bem, então sempre deixar um bilhete, ou colocar verdadeiramente como um cadeado ou algo na geladeira que mantém o seu companheiro de quarto de inspecionar o estado de essa variável. 

Agora, por que isso pode ser pertinente para conjunto de problemas de sete, ou para caixas eletrônicos. Bem, imagine um mundo em um caixa eletrônico, onde você pode ser capaz de ir até um caixa eletrônico máquina aqui, e outra caixa eletrônico aqui. E isso acontece com bastante frequência. E suponha que você tinha dois cartões ATM, que é possível obter. E você entrar em ambas as máquinas efetivamente ao mesmo tempo, espero que enquanto ninguém está olhando. E então você digitar seu PIN aproximadamente ao mesmo tempo. E então você faz uma consulta equilíbrio ver quanto dinheiro você tem. E digamos que você tem $ 100 deixou em sua conta. Então, basicamente ao mesmo tempo, você dizer um, zero, zero, entrar. E espero voltar algum dinheiro. 

Mas quanto dinheiro você pode receber de volta? Agora, os computadores, no final do dia, especialmente se eles estão falando servidores, não necessariamente fazer coisas na ordem em que é esperado. 

Então suponho que o que acontece, por causa da qualquer rede problemas de velocidade lá são, ou questões de CPU existem, ou nada disso, suponha que o primeiro ATM verifica seu saldo e vê, oh, essa pessoa tem US $ 100. Mas, então, se distrai porque talvez uma cópia de segurança está acontecendo e por isso é abrandar. Ou talvez durante a verificação, a rede conexão ficou um pouco mais lento porque isso simplesmente acontece. Eles são dispositivos físicos. Então, enquanto isso, a segunda caixa eletrônico é fazendo a mesma pergunta. Quanto dinheiro é que David tem? US $ 100 é a resposta. Mas porque a primeira ATM ainda não enviou a mensagem subtrair US $ 100, ambos ATMs ter inspecionado cofre do banco, vendo há 100 dólares lá, e agora ambas as máquinas são potencialmente vai cuspir uma resposta. 

Agora, isso é ótimo para você, em algum sentido se o que o banco faz, em última instância é mudar o valor para menos de 100 por definindo a variável igual ao seu conta bancária igual a 0, em oposição a fazer menos 100. Agora, no pior caso para o Bank - ou, no melhor para o banco, por sua vez, eles dão-lhe US $ 200, e sua conta bancária agora mostra negativo US $ 100, o que realmente não faz beneficiá-lo em tudo. Mas o ponto é que esta corrida condição para a obtenção de dois companheiros de quarto leite, ou para dois caixas eletrônicos que tentam obter dinheiro e alterar o estado de um cofre ao mesmo tempo, existe alguma vez que você tem um banco de dados. 

Agora, no conjunto de problemas de sete, esta questão surge no sentido de que se você comprar um parcela de ações do Facebook, e em seguida para exemplo, você comprar uma segunda parcela de Facebook estoque, você precisa fazer uma decisão como programador. A fim de decidir como atualizar o banco de dados, a probabilidade de que você vai tem uma linha para que o estoque, e este é uma maneira de implementá-lo. E você vai ter uma ação do FB, que é seu símbolo de cotações da bolsa para este nome de usuário, ou este usuário ID, o identificador único. 

Mas a mesma história pode acontecer aqui. Se você fizer um SELECT em SQL, como você verá no conjunto de problemas de sete, quando você vê, oh, David tem uma partes de ações do Facebook. Deixa-me mudar isso para ser duas ações, porque ele quer comprar um segunda parte. Mas suponha que David realmente tinha dois janelas do navegador abertas, ou supor que é uma conta conjunta com dois cônjuges, e ambos estão tentando realizar a mesma operação, existe, também, o existe potencial para uma decisão a ser feita com base na anterior estado do mundo - a conta tem uma ação - e as duas pessoas ou dois servidores, agora tente dizer incrementá-lo para duas ações. Mas, neste caso, você pode ter cobrado me dinheiro para ambas as partes, mas incrementado apenas aquela vez. 

Assim, em breve, o problema fundamental aqui, como com a piada sobre deixando um notar, ou colocar um cadeado nele, é se duas pessoas, ou dois tópicos - acho que volta a zero - pode inspecionar o estado de alguma variável e, em seguida, tentar mudar essa variável, mas essas duas coisas não acontecem no mesmo tempo, mas pode ficar interrompido por outras coisas que estão acontecendo, os dados podem entrar em um estado muito estranho. E você pode se beneficiar ou você pode sofrer no sentido do exemplo de dinheiro. 

Assim, no conjunto de problemas sete, nós damos-lhe esta linha de código, que por muito tempo Resumindo, resolve este problema no MySQL. Esta muito longa instrução que não faz mesmo caber em uma linha na tela aqui garante que a sua operação é o que se chama atômica. Tudo acontece de uma vez, ou isso não acontece em todos. Esta mesma frase longa não pode ficar interrompido parcialmente. 

E o que ele faz é literalmente o que diz. Insira em alguma mesa da seguinte três campos esses valores específicos mas em chave duplicada, não faça uma inserção. Faça uma atualização. Então, isso é como fazer um SELECT e um INSERIR por assim dizer, ao mesmo tempo. E o que é a chave que provavelmente é sendo referido aqui? 

Acontece, e você vai ver isso em conjunto de problemas de sete de especificação, porque nós já declarou que haja uma chave única nesta tabela particular tal que você não pode ter várias linhas para o mesmo utilizador, com a mesmo símbolo tostão estoque - neste exemplo, aqui, é DVN.V um tostão estoque bobo que nós referem-se na especificação. Porque nós já declarou que ele seja único, o que isto significa é que se você tentar inserir uma linha duplicada, você está em vez de ir para atualizá-lo sem qualquer outra pessoa ter uma chance de mudar o estado do mundo, quer. Assim, em breve, o que garante coisas são atômicas. 

Mais geralmente, no entanto, as bases de dados como MySQL - e você não precisa desse recurso para p-set sete, mas mantê-lo em mente para o futuro - apoiar o que são chamados de transações, onde você pode dizer START TRANSACTION literalmente. Você pode então executar duas instruções SQL. E uma instrução SQL, como você verá in-p definir sete, parece um pouco algo como isto. Atualizar uma tabela chamada conta. Definir a coluna equilíbrio igual a tudo o que a coluna de equilíbrio atualmente é menos 1,000, onde o número, o número da conta, como o ID do usuário, igual a 2, e, em seguida, atualizar conta dot dot dot. 

Assim, em termos leigos, o que esses dois consultas parecem estar fazendo na sentido real da banca? 

AUDIÊNCIA: Transferindo-se para a poupança. 

DAVID MALAN: Exatamente. Transferência de fundos de uma conta para o outro. E este é outro exemplo onde você realmente quer essas duas coisas para acontecer ou não acontecer. Você não quer algo para entrar no meio deles e potencialmente atrapalhar a matemática, ou bagunçar o quanto dinheiro que você tem, ou quanto dinheiro que o banco tem. Então, o que é muito legal sobre transações no MySQL é que, e bases de dados de forma mais geral, é que eles e pessoas inteligentes que já implementadas esses recursos descobrir como fazer Certifique-se que ambas as coisas acontecem ou não em todos. 

E se você está realmente aspiram a fazer um site que é usado por pessoas em campus, as pessoas no mundo real, fazendo algo no sentido de inicialização, estes são os tipos de decisões de design que tornar-se sempre tão importante. Caso contrário, você começa a perder dados, perdem utilizadores, ou, no pior caso, nós vimos aqui, potencialmente perder dinheiro. Então, novamente, mais sobre isso em conjunto de problemas sete, bem como, talvez, para alguns dos você em projetos finais. 

Então vamos mudar essa imagem que tínhamos há pouco apenas em mais de uma maneira. Então deixe-me ver se eu realmente pode - nope, que se foi. Aqui está. 

Portanto, este é o lugar onde nós deixamos da última vez. E acontece que nós estamos indo para atirar mais uma coisa na mistura por aqui - uma linguagem chamada JavaScript. Então JavaScript realmente se encaixa nesta parte - e eu não queria muito deixar espaço suficiente, então isso não é agora em escala. OK, isso é realmente patético. OK, então isso é JavaScript. Tudo bem. Estou realmente fazendo um desserviço. Tudo bem. 

Então JavaScript é outra programação linguagem, e nosso passado, Se isso ajuda reafirmar que não há muito mais dos hidrantes aqui. Assim JavaScript é também uma interpretação linguagem, o que significa que você não compilá-lo em zeros e uns. Você só executá-lo. Mas o que é fundamentalmente diferente com JavaScript geralmente é que você não executá-lo no seu servidor web. Ele não se correr na aparelho em si. Em vez disso, ele é baixado por um usuário via HTTP em seu navegador - Chrome, Safari, Internet Explorer, Firefox, o que for - e é o navegador que executa este especial linguagem de programação. 

Então, para ser claro, PHP, até agora, tem sido executado ou na linha de comando em nossa janela preto e branco, em um servidor como o aparelho, um computador como o aparelho, ou tem sido executado por um servidor web rodando em um computador. Mas o tema aqui é que, até agora, PHP foi executado do lado do servidor, de modo o usuário eo navegador do usuário nunca vê uma linha de código PHP. 

Na verdade, se você nunca abrir um navegador para seu site ou outro e você realmente ver o código PHP em sua janela, alguém tem asneira. Porque não é para ser enviada para um navegador da directamente. É suposto ser executado e virou em algo como HTML. 

Mas JavaScript é essencialmente o oposto. É concebido para ser executado normalmente dentro da janela do navegador do usuário. E que tipos de sites usam JavaScript seguida, nos dias de hoje? 

Como literalmente cada site popular. Cada site que vocês provavelmente usar uso diário JavaScript para o mais simples e até mesmo o características mais quentes. 

Então, algo como o Facebook Converse se você usar isso. Como é que isso realmente funciona? Bem, até agora, todas as coisas que tenho feito com HTML e PHP assume que você puxe uma URL, e você pressionar Enter, e você vê algum conteúdo HTML. E você clicar no link, que muda a URL, muda a página, e recarrega algum novo conteúdo. Clique em outra URL ou enviar um formulário, você se levado para outra página e você vê algum conteúdo novo. 

Mas usar algo como o Facebook Chat, ou Gchat, ou o Google Maps, raramente faz toda a página de atualização de modo que você verá uma tela branca momentaneamente e em seguida, um novo conteúdo. Em vez disso, as páginas web hoje são dinamicamente sendo atualizado de novo e novo e de novo todo o tipo de bastidores. E verifica-se que quando você vai fazer a algo como o Facebook, ou Gchat, ou Gmail, e as atualizações da página automaticamente sem recarregar a tela inteira, o que aconteceu é que o navegador fez uma espécie de segredo solicitações HTTP adicionais - não para páginas web inteiras, mas apenas para pequenos blocos de dados, como o mensagem instantânea que o seu amigo apenas enviou-lhe, ou a atualização de status que alguém apenas lhe enviou, ou o tweet que alguém acabou de enviar. É só fazer pequenos pedidos de de dados, e em seguida, usando JavaScript, este linguagem de programação, para mudar o que a página da web parece sem a servidor de ajuda, sem o servidor geração que HTML. 

Assim, em breve, o JavaScript pode ser usado, em seguida, não só para buscar novos dados o servidor sem recarregar um todo página ou enviar um formulário. Ele também pode ser usado para a mudança o chamado MOD - Document Object Model - que é apenas a maneira extravagante para dizendo que a árvore de HTML que vimos da última vez. 

Então, para tranquilizar, JavaScript sintaticamente tão semelhante a C também. Não há nenhuma função principal. Você acabou de começar a escrever o código e serão executados, ou interpretadas de maneira mais adequada. Condições será parecido com este. Não é diferente a partir de C ou PHP para essa matéria. Expressões booleanas ou-ed juntos será parecido com este. ANDed juntos semelhante a este. 

Switches será parecido com este. Por voltas será parecido com este. While loops será parecido com este. Do while será parecido com este. 

Isso é novo. Então JavaScript não tem um foreach construir, por si só, mas este constructo para a variável i na matriz, e eu neste caso torna-se um valor de índice. Portanto, é um pouco diferente do que foreach, embora as novas versões do JavaScript estão saindo o tempo todo, assim mesmo esses recursos de linguagem estão evoluindo. 

E como um aparte, JavaScript nestes dias também pode ser usado em um servidor tal como PHP usando uma estrutura chamada Node.js. Um de CS50 TFs, Kevin, levou um seminário sobre Node.js que está disponível em cs50.net/seminars. Então, se você está curioso, saiba que você pode usar esta no lado do servidor como bem, mas isso é uma tendência relativamente recente, mas um poderoso nisso. 

Este é um pouco diferente. Esta é uma matriz em JavaScript. E o que lhe parece diferente contra C ou PHP? Existem algumas histórias rápidas podemos dizer aqui. O que está faltando em relação PHP? 

AUDIÊNCIA: [inaudível]. 

DAVID MALAN: Sim? Desculpe, dizer de novo? 

AUDIÊNCIA: Não declarando o tipo de variável. 

DAVID MALAN: Não estamos declarando o tipo de variável. Então, na verdade, bastante como PHP, não estamos especificando os tipos de esta variável. Em vez disso, estamos mais genericamente dizendo var para a variável. Não temos de incômodo do PHP sinal de dólar, enquanto que tedioso tipo, faz mais claro que algo é uma variável. Enquanto aqui, nós somos uma espécie de volta ao A abordagem de C por apenas chamar um variável com o nome que queremos para dar-lhe, como números. E também como PHP, temos colchetes para a valores dentro dessa matriz. 

Assim, as variáveis ​​em JavaScript também pode ser assim. Observe aqui esta é uma string chamada s, mas da mesma forma que nós não especificada que é uma string. Aqui, porém, é uma característica que não faz existe exatamente da mesma maneira em PHP, mas um pouco semelhante. Este é um objeto em JavaScript. E os objetos são uma espécie de exército suíço Faca de uma estrutura de dados em que pode usá-los para qualquer número de coisas. 

Aqui, por exemplo, estamos declarando uma variável chamada cotação. O tipo de variável que é um objeto. Você pode pensar nisso como um struct C que tem as chaves e valores. Symbol é uma chave. FB é um valor, aparentemente um símbolo de ação. Vírgula. O preço é outra chave, e seu valor é aparentemente um ponto flutuante, ou um número mais geral em JavaScript, de 49,26 dólares. 

Então PHP não tem - não temos visto em objetos PHP bastante assim, mas fizemos ver um analógico, que era o que? 

AUDIÊNCIA: [inaudível]. 

DAVID MALAN: Matrizes associativas. Assim, enquanto o PHP tem arrays associativos cuja sintaxe é sempre um pouco para diferente - vimos os colchetes. Vimos os símbolos setas estranhas. JavaScript tem objetos, mas esta é principalmente uma diferença semântica e uma sinônimo diferente por enquanto. No entanto, como um aparte, PHP também tem objectos de uma maneira que Java e outros línguas têm objetos em programação orientada a objetos. Mas vamos usar estes apenas para os tipos de dados para agora. Os objetos e arrays associativos. 

Este pode torná-lo um pouco mais clara. Aqui está o porquê de um objeto é útil. Quando você deseja declarar um estudante, como Zamyla, podemos realmente encapsular assim dizer no interior do referido objeto usando chaves como antes de um monte de chaves e os valores aqui. Temos uma identificação, uma casa, e um nome para Zamyla, seguido por um ponto e vírgula como habitual no final. 

Por aqui também, isso é um pouco diferentes, mas também muito potente nos dias de hoje. Aqui está uma matriz, e eu sei disso porque há um colchete up superior e um colchete na parte inferior. E isto é uma matriz de dados que digite aparentemente em JavaScript? Esta é uma matriz de parece como três objetos. E eu sei que é apenas um objeto por causa das chaves. E note que há chaveta aberta, algumas coisas, perto chaveta, vírgula, em seguida, um pouco mais, vírgula, e, em seguida, um pouco mais. Então, isso é três argumentos separadas por duas vírgulas. 

Portanto, esta é uma matriz de três objetos. E cada um dos objectos a ser exibida um estudante ou funcionário de algum tipo, cada um com um ID, casa, e nome. Mas eu chamei este algo chamado JSON - JavaScript Object Notation. E isto é um formato de dados que realmente é tão popular e em voga nestes dias que se você escrever um aplicação que utiliza o Facebook API, a API do Twitter, realmente quase qualquer API lá fora nos dias de hoje, incluindo alguns dos próprio CS50, o dados que você receber de volta não está na formato CSV da velha escola. 

Porque lembre-se que CSV é super simples. Fica apenas a colunas separadas por vírgulas. Dados JSON dá-lhe mais de metadados. Ele associa uma chave com todos os valores assim eles não tem que simplesmente assumir que a coluna de ordem zero é um valor, coluna uma outra, de duas colunas é outro. Tudo em um objeto JSON aqui é uma espécie de auto-descritivo, porque cada um dos nomes neste arquivo tem literalmente nome na frente dele como um string. 

Então, vamos dar uma olhada em um alguns exemplos aqui. Deixe-me ir para dentro do aparelho. E deixe-me ir para o nosso vhost diretório em público. E deixe-me ir para o JavaScript diretório. E vamos em frente e abrir dom-0.html, onde DOM significa apenas Document Object Model. É o material árvore para que Me referi anteriormente. 

E deixe-me propor o seguinte. Aqui está uma página web cujo corpo é bastante simples. Então, aqui em baixo, na parte inferior, perceber Eu tenho um formulário. Vimos aqueles antes. Ele tem duas entradas, uma das quais contém um ID de nome, um dos quais tem um Tipo de apresentar, e do primeiro um do tipo é texto. Então, isso realmente soa bastante simples. 

Vamos aqui. Vamos voltar para esta página aqui. Vamos entrar em localhost, e entra nosso diretório JavaScript, e ir para dom-0, e aqui temos essa forma. Então, isso é, aparentemente, tudo isso página faz. Ele tem um campo de nome com um botão Enviar. Mas eu não vou usar o PHP aqui. Eu vou fazer tudo o lado cliente por assim dizer, em JavaScript da seguinte forma. 

Observe que eu realmente dado o nome campo de entrada esta uma única identificador, que será, na verdade, salva-me algum tempo em um momento. E note que eu tenho apresentado uma outra tag na cabeça da minha página web, o  tag. 

Portanto, é neste sentido que é JavaScript uma linguagem de programação do lado do cliente. Neste caso, como CSS, eu coloquei em linha reta dentro do meu HTML. Mas note que eu declarada uma função que parece um pouco com PHP sintaticamente, mas esta é realmente JavaScript, porque mais uma vez, é do lado do cliente no navegador. E dar um palpite que isso vai fazer, mesmo que alguns da sintaxe aqui é novo. 

AUDIÊNCIA: Diga Olá para quem quer. 

DAVID MALAN: Vai dizer Olá para quem visita esta página. Então, como? 

Então, observe, verifica-se em JavaScript há um alerta () função. Esta é uma função muito triste que tipo de realmente só tende a incomodar os usuários. Não é que você realmente deve usar normalmente, mas é um rápido e sujo forma de uma espécie de impressão de algo a um utilizador gráfica interface, como um browser. Observe aqui que eu tenho um cadeia entre aspas simples. Acontece que ao contrário de C, JavaScript pode realmente você tem uso único cita, e, francamente, é só tipo da convenção estilística entre JavaScript programadores usar aspas simples. PHP, eles realmente têm um pouco significado diferente. Mas, por enquanto, só sei que essa é a única razão. A convenção em JavaScript é muitas vezes a usar aspas simples, mas poderíamos usar aspas duplas em ambos os lugares também. 

Então, isso é interessante. Lembre-se da última vez que tivemos que imagem na tela que desenhou uma árvore onde você tinha o nó HTML, eo cabeça nó eo nó corpo, e, em seguida, algum texto. Mas não houve um nó especial no muito superior que liguei para o documento. Bem, acontece que em JavaScript, qualquer vez que você escrever um programa em JavaScript em um navegador, você tem acesso a uma variável global especial. Similares em espírito à superglobais do PHP, este é chamado em todo documento minúsculas. 

É como uma estrutura, mas esta estrutura também tem funções dentro dela. Assim, um struct C só tem dados normalmente. Mas um objeto JavaScript como este tecnicamente é também tem funções, também conhecido como métodos, no interior do mesmo. E você pode chamar uma função dentro de este objeto literalmente fazendo a sua nome, ponto, e depois o nome a função, ou ainda método. É apenas um sinônimo, realmente. 

E o que essa função faz? Você pode tipo de adivinhar o seu nome. Obter elemento por ID. Então, isso vai pesquisar a página da web, pesquisar a árvore, olhando para tudo o que nó, elemento AKA, tem uma ID única de citação nome unquote. E então o que é que eu vou fazer? Eu estou indo para obter o valor dentro de esse nó na árvore, e eu vou de alguma forma, dizer Olá a esse nome. 

Então dê um palpite, mesmo que nós não temos vi isso ainda, o que fazer a mais símbolos significam aqui e aqui, provavelmente? 

AUDIÊNCIA: Concatenar. 

DAVID MALAN: Concatenar. Certo, e estes são apenas tipo de decisões de projeto pessoas fizeram anos atrás. No PHP, você concatenar coisas com pontos. Em C, você saltar através de aros e várias funções como strcopy (call) ou strcat () ou outras funções. Mas em JavaScript, você usa trunfos. Portanto, esta é apenas a concatenação três cordas - Olá, um nome, e, em seguida, um ponto de exclamação. 

Então, quando e por que essa função chamado embora? Bem, dar um palpite do HTML na parte inferior. Por que cumprimentar () chamado, ou quando? 

Aparentemente, o melhor que eu posso dizer, em apresentar, quando este formulário é enviado, Eu vou fazer o que for dentro destas citações. E, especificamente, eu vou ligar para cumprimentar () e, em seguida, retornar false. 

Bem, vamos ver o que a rede efeito aqui é o primeiro. Então deixe-me ir em frente e escrever em, digamos, Loren, em Enviar. Olá Loren. Vamos ver se talvez este foi apenas uma implementação de sorte. Não.. Então está digitando o que quer que nome eu realmente colocar lá. 

Mas note que não está mudando. A URL ainda é dom-0.html. Não há register.php. Não há segundo arquivo. Não há nenhum atributo action. Então, qual é essa falsa retorno presumivelmente fazendo? Por que eu estou chamando cumprimentar () e, em seguida, retornando falso provavelmente? O que normalmente acontece quando você clica Enviar em um formulário que ainda temos visto na semana passada? 

AUDIÊNCIA: [inaudível]. 

DAVID MALAN: Vai em algum lugar, certo? Ele vai para um URL de destino. Mas eu não quero que isso aconteça aqui. Eu quero a minha página da web para ser completamente dinâmico como Gmail, onde uma vez que você é lá, você ficar lá. O URL não muda de um modo que indica a página inteira está recarregando. Em vez disso, eu só quero mudar alguma coisa como imprimir algo aqui na tela. 

Bem, deixe-me limpar isso -se um pouco. Deixe-me abrir não dom-0, mas deixe-me abrir dom-2. Só para que você tenha visto alguma sintaxe aqui. 

Acontece que o que acabamos de se está usando JavaScript cru. Portanto, esta é verdadeiramente a linguagem JavaScript. Alguns de vocês podem saber de uma biblioteca chamada jQuery. 

Assim jQuery não é a mesma coisa como JavaScript. É apenas uma biblioteca que realmente inteligente cara escreveu e popularizado como que quase todos no mundo agora usa jQuery ao usar JavaScript. E à primeira vista, honestamente, parece um pouco mais enigmática. Mas você vai encontrar, especialmente se você for lá para o seu projeto final com web desenvolvimento, você verá que este limpa as coisas e você economiza bastante algumas linhas de código. 

Então vamos olhar para como este formulário está funcionando. Observe o que eu remover aparentemente do meu HTML? Não há em enviar manipulador por assim dizer. Não há nenhum atributo. Porque você sabe, o que Eu realmente não gosto? Eu me senti como se estivesse caindo em velhos hábitos lá. Assim como ele estava começando a sentir-se desleixado se misturar tanto com CSS HTML, porque você está meio que jogando línguas diferentes em todo o lugar, da mesma forma que isso começar a se sentir como um mau caminho para ir até onde Estou colocando o código JavaScript dentro da minha HTML em vez de factoring-lo. 

Então essa é a lição aqui. Em dom-2.html, estou factoring-lo. E eu estou fazendo as coisas um pouco de forma diferente. Por enquanto, eu vou acenar as mãos o que isso realmente debaixo do capô. Mas por agora assumir que esse primeiro linha de código nesta biblioteca chamado jQuery significa apenas quando o documento está pronto, faça o seguinte. 

Como as páginas da web podem ter algum tempo para carregar. Você pode estar em uma internet lenta conexão, e pode estar girando e girando, e, finalmente, ele é carregado. Essa linha de código apenas diz esperar até a página inteira estiver pronto, o documento está pronto, antes de executar este código. 

E agora percebe, este é, provavelmente, o mais útil primeiro tirar de jQuery. Esta linha aqui é muito semelhante em espírito para essa linha por muito mais tempo aqui. Considerando que o código JavaScript cru, não existe um objeto global documento que tem uma função chamada getElementById () as pessoas que escreveram jQuery simplificado que apenas dizer sinal de dólar, e, em seguida, dentro de parênteses colocar duas citações, e, em seguida, colocar um símbolo de hash seguido pelo ID exclusivo que você quer pegar. Então, isso é equivalente a document.getElementById. 

Enquanto isso, a submeter-se. Apenas significa em apresentação de qualquer forma você está referindo-se à esquerda, ir em frente e executar isso. Mas isso é agora a curiosidade também. O que é estranho sobre o que Tenho destacado aqui? Não só é uma espécie de sintaticamente novo, também há algo faltando. 

AUDIÊNCIA: É só uma chamada de função? Não é chamado de alerta? 

DAVID MALAN: Yeah. Bem, então alert () é baixo aqui, para ser justo. Mas não há nenhuma menção de um nome, como você sabe, foo ou algo aqui em cima. E, de fato, esta é uma das características de JavaScript que é bastante poderoso, mas também muito novo. E PHP realmente tem isso também. 

Deixe-me ir em frente e fazer algo bem rápido. Deixe-me ir em frente e colocar isso aqui. Deixe-me fazer isso. Função. Vamos chamar esse manipulador (). A função de manipulador por assim dizer. Algo que lida com alguma operação. Deixe-me limpar o meu recuo. E colocar isso aqui. E colocar isso aqui. Yep. OK. 

Então agora eu tenho uma função chamada handler () que eu realmente não sei o que ele faz ainda. Ele só ainda tem essas coisas. Gritos. Demorou muito. Vamos fazer isso. Tudo bem. Desculpe. Tudo bem. Deixe-me fazer isso. OK. Isso parece bom e em linha reta encaminhar agora. Deixe-me fazer isso. Faça isso. E OK. Então, agora, vamos colocar isso aqui. Não há mais a programação em tempo real. OK. 

Então, agora, vamos voltar para onde a história começou. Anteriormente, eu disse que essa linha aqui significa que quando o documento estiver pronto, vá em frente e fazer isso. O que eu quero fazer? Bem, especificamente, eu quero ir em frente e faça o seguinte. Executar esta linha de código, e em seguida o que eu quero que você faça é chamar este funcionar quando o formulário é enviado. 

Agora isso é o que é interessante. Isto não é em si mesmo uma função. Repare que eu não estou colocando parênteses aqui de uma forma normal. Estou literalmente passando por uma função chamada manipulador () para outra função chamado submit () como um argumento como mas é como uma variável. E esta é uma das características de JavaScript, é si funções são realmente apenas objetos. Na verdade, eles são realmente apenas variáveis ​​de algum tipo. E se o nome da função é manipulador (), não há nenhuma razão pela qual eu não posso passá-la como um argumento daqui. E isso significa que quando a forma com o ID de demonstração é submetido, chamar esta função. 

Mas agora, se eu desfazer de tudo isso, por que então eu talvez fazer este um momento atrás? Bem, esta é uma função anônima. Porque, francamente, eu percebi por que eu sou se preocupar em perder tempo declarando uma função chamada manipulador () apenas para chamar lo em um e somente um lugar? Se eu não preciso do nome, e eu não precisa chamá-lo mais de um lugar, vamos implementar a função bem onde eu precisar dele. E assim, JavaScript e PHP apoiar o que são chamados de funções anônimas que me permite fazer exatamente isso aqui. 

Mas estamos apenas arranhando a superfície. Vamos brincar com apenas um par exemplos finais aqui. 

Se eu entrar em quote.php. Observe que este é realmente um PHP função, um programa PHP, que eu escrevi espera que um parâmetro HTTP chamado símbolo, e eu posso passar em um valor como FB. E se nós realmente olhar para a fonte código, isso está consultando um site gratuito chamado Yahoo Finance, como p-set sete, e ele está retornando para mim algo aparentemente o formato conhecido é JSON - JavaScript Object Notation. É apenas um objeto. Observe as chaves, as citações, do cólon, e as vírgulas. 

Agora, entretanto, isso é muito legal. Porque eu provavelmente pode usar uma programação linguagem para gerar URLs que se parecem com esta dinâmica, certo? Eu posso mudar isso para o Google e voltar do Google preço das ações de US $ 1,017.55. Então, vamos ver se não podemos usar isso agora. 

Deixe-me ir para ajax-0 aqui, que parece com o seguinte. É apenas um site que tem um formulário com um botão. Deixe-me aqui, vá em frente e digite YHOO para o símbolo das ações do Yahoo, clique em Obter Quote, e agora percebe que eu comecei um alerta com 32,86. 

Deixe-me realmente ir para uma versão mais extravagante desta página, versão dois, e digitar digamos Microsoft, MSFT. Obter cotação. E agora perceber, nenhum alerta. Observe onde diz preço a ser determinado? Não é o mais simples dos exemplos que aponta para o que Gchat e Facebook Bate-papo, e Gmail, e outros tais sites estão fazendo por realmente mudar a página da web. 

Observe isso. Deixe-me recarregar a página. Deixe-me abrir Inspector do Chrome. Deixe-me ir para os elementos guia aqui. Agora note, se eu aumentar o zoom até aqui e abrir isso, perceber que esta é a minha HTML DOM - o meu modelo de objeto de documento. Este é o meu HTML. Mas agora percebe, mesmo que está acontecendo ser um pouco difícil de vê-lo em ambos lugares ao mesmo tempo, se eu digitar no FB aqui em cima, observe a parte inferior da tela só. 

É realmente mudando meu HTML na mosca. E está fazendo isso muito simplesmente fazendo algo assim. Se eu abrir ajax-2, aviso implementação algo tão sexy como que, apesar de ser muito feio, mas tão sofisticado como esse funcionalmente, tem alguns HTML na parte inferior. Mas note que eu usei para marcar. Nós não usei isso antes, mas esta é como uma, mas não força tudo em uma nova linha. Ela só faz uma região retangular na mesma linha, essencialmente. 

Observe que eu dei-lhe um ID de preço. E acontece que, utilizando o mesmo Biblioteca JavaScript, eu tenho uma função chamado quote () que é chamado sempre que o formulário é enviado. E o que eu estou fazendo é isso. Estou declarando uma variável em JavaScript chamado url, salvando o valor quote.php? símbolo =. Em outras palavras, eu mesmo estou começando para preparar uma solicitação HTTP, e depois Estou concatenando para que com um plus qualquer que seja o elemento com o ID de símbolo é, que o aviso é que campo de texto bem aqui. Então, assim como tínhamos formas no passado. 

E então ele se transforma em jQuery, se você chamar. val (), que chama de um val função, uma função de valor, que recebe tudo o que o usuário digitou dentro E, em seguida, todo o tráfego de rede o que acontece é isso. $. GetJSON. 

E, como um aparte, sinal de dólar é apenas uma notação abreviada. É realmente jQuery.getJSON. Tirem-me para JSON a partir desta URL, e quando o pedido vem de volta, chamar este função e passar como argumento o que veio de volta a partir do servidor. 

Portanto, em outras palavras, se eu voltar para a navegador, e eu voltar para quote.php, o meu navegador está fazendo é ficar este bloco de dados. E quando eu ir a esta página web aqui, perceber se em vez de ir para a rede separador e limpá-la, e em seguida, digite algo como GOOG para o Google e ganhe Citação, observe a página não se alterou. Mas uma solicitação HTTP foi feito, eo que voltei aqui, se olharmos para o resposta é um monte de JSON que acedida finalmente com esta linha simples aqui. 

Dados é o que foi obtido a partir do servidor. O preço é o nome do chave que me interessa. Então data.price me dá isso. 

Agora, entretanto, e este é o último exemplo. Você pode fazer ainda mais com a página. Uma verdade, bem dois. Nós podemos trazer de volta a tag, se você se lembrar disso. Isso é JavaScript. Nós podemos fazer isso. Muito emocionante. Vamos deixar isso como um cliffhanger. 

Mas o mais empolgante, você pode fazer coisas como esta. Se eu for para geolocalização-1, verifica-se que o Chrome sabe que estamos em longitude latitude 42,37. -71,10. Assim, há ainda mais lá à sua disposição. Mas mais sobre isso na próxima semana. Vejo você segunda-feira.