DAVID Malan: Très bien. C'est CS50, et c'est la fin de la neuvième semaine. Il a été un tourbillon sur ces derniers jours. Et problème réglé sept, si vous êtes genou profond en elle, se rendent compte qu'il ya tout un peu nouveau que c'est là-dedans. Mais nous allons voir si nous ne pouvons pas reconstituer le tout brièvement ici avant puis virant au large dans l'instant une autre direction et de voir où que nous pouvons aller. 

Donc, jusqu'à présent, nous avons parlé de HTML. Nous avons parlé de CSS. Nous avons parlé de PHP. Vous avez commencé à faire l'expérience de SQL. Aujourd'hui, nous allons parler un peu sur JavaScript. Mais comment faire tout cela disparate langues s'emboîtent? 

Nous avons donc parlé la semaine dernière sur la idée d'avoir un serveur. Alors disons simplement tirer ce rectangle comme un serveur web ici. Et un serveur Web sert sûrement fichiers. Et certains de ces fichiers peuvent être des fichiers HTML. Donc, une des choses que d'un serveur Web peut cracher peut être un fichier qui nous allons tirer comme ça contenant du code HTML. Donc, en termes simples, ce ne laissez HTML que vous faites? 

PUBLIC: page joli. 

DAVID Malan: OK, faire une page de belle apparence, même si je pense que j'ai prouvé que le contraire. Donc HTML ne laisse vous disposez pages structurellement, et il vous permet de sorte de marquer esthétiquement une page, marquer le contenu statique, de sorte que vous peut ensuite visualiser avec un navigateur Web. 

Mais c'est la clé. C'est le contenu statique. Vous écrivez, vous enregistrez, et puis vous l'expédier. Et le serveur Web sert alors il à vos visiteurs. 

Mais nous styliser les choses en utilisant un autre langue tout à fait. Nous avons commencé à utiliser un attribut de style sur certaines balises. Et l'attribut de style Posons des choses comme la taille de police et la couleur. Et vous avez probablement commencé à découvrir, ou vous allez bientôt pour finale projets potentiellement, d'autres encore propriétés que vous pouvez utiliser en CSS. Et donc, en termes simples, ce alors vraiment ne faire CSS? Ce ne sont que des exemples de ceux-ci. Que faut-il vous laisser faire ce que HTML ne semble pas de ce nous avons vu jusqu'à présent? 

PUBLIC: Définir modèles par vous-même. 

DAVID Malan: Définir les styles par vous-même. Donc, définir les choses comme les classes que vous peut avoir rencontré, ou unique identifier les nœuds dans un document afin que vous pouvez les styliser. Mais plus spécifiquement, je dirais que le CSS vous permet vraiment de prendre les choses les dernier mile et vous permet de spécifier beaucoup plus précisément l'esthétique, alors que HTML pour la plupart permet vous structurez vos pages. 

Et même si il ya quelques défauts, comme nous l'avons vu l'étiquette pour un tag position, qui grosso modo fait les choses en grand et gras. C'est une définition assez générique de l'étiquette - gros et gras. Qu'est-ce que la taille de police est-ce? De quelle couleur est-ce? Comment audacieux que c'est? Et CSS vous permet plus finement tuner des choses comme ça. Ainsi que la mise en page, comme certains vous avez vu. 

Et franchement, CSS est un peu d'une langue désordonnée. Il est très puissant en ce que vous pouvez faire littéralement n'importe quel site Web que vous avez vu sur le web aujourd'hui, mais c'est une sorte de douleur dans le cou. Et certains d'entre vous ont cogné la tête contre les murs déjà juste pour faire quelque chose de stupide comme centre d'un menu sur problème réglé sept si vous avez appris à ce point déjà. 

Mais réaliser, ces choses plus facile au fil du temps. Vous commencez à remarquer les modèles. Et encore une fois, Google sera votre ami pour les différents moyens par lesquels vous pouvez résoudre ces types de problèmes. 

Et j'ose dire avec CSS et HTML plus généralement, vous pouvez résoudre les problèmes dans beaucoup plus de manières, qui pourrait très bien être exact, que vous pourriez dans quelque chose comme C, même maintenant PHP ou JavaScript. Il ya juste beaucoup de différents moyens pour jeter les choses. 

Mais cela a commencé à se malpropre, nous l'avons dit. Tout type de commingling votre code HTML et votre CSS avec l'attribut style est un peu bâclé. Et si nous disions à la place, une sorte de parler abstraitement, que vous devriez au moins commencer à facteur Départ probablement votre CSS. Ce n'est pas votre attributs de style, mais au moins utiliser la balise de style à l'intérieur ce qui partie de la page Web? 

PUBLIC: Head. 

DAVID Malan: Dans la tête. Jusqu'à présent, nous n'avions que le titre jusqu'à là, mais vous pouvez également ajouter un style tag, et vous pouvez mettre votre CSS ou moins parlant vers le haut de la page. Mais nous avons pris les choses un peu plus loin et nous pondérée que plus dans un fichier séparé. 

Et si ces deux dossiers étaient en quelque sorte maintenant lié. Et en effet, c'était la tag qui a fait cela. Et ce qui était un des objectifs primordiaux motivations pour l'affacturage notre CSS d'autant plus? 

PUBLIC: réutilisation. 

DAVID Malan: réutilisation. Droite? Vous avez peut être vu dans le p-mis sept déjà que beaucoup de pages, le Cette page d'achat, la page de vente, la portefeuille page sont probablement structuré de façon assez similaire. Il ya un logo de financement du CS50 au sommet sauf si vous avez décidé de changer. Il ya une page sur les bas des pages. Et CSS vous permet alors à l'intégrer à dans un fichier séparé de sorte que si vous voulez changer quelque chose à l'échelle mondiale dans l'ensemble de votre site, vous pouvez vraiment il suffit de changer en un seul endroit. 

Mais il ya un prix que vous payez potentiellement en ayant pris en compte les CSS de mon fichier HTML dans un distinct fichier de référencement avec le tag, que nous avons vu lundi. Quel pourrait être le inconvénient être cela? En y repensant, il ya une semaine quand nous sommes parler HTTP et TCP / IP et comment Internet fonctionne. Quelque chose ici? 

PUBLIC: Il faut plus de temps. 

DAVID Malan: Il faut plus de temps. Pourquoi? 

PUBLIC: [inaudible]. 

DAVID Malan: Ouais. Donc, il faut sans doute un peu plus de temps. Parce que l'un, le CSS est évidemment pas dans le même fichier. Alors maintenant que vous avez à faire pas un, mais deux demandes. Et chacune de ces demandes que nous avons vu dans Chrome dans le soi-disant inspecteur, et nous avons examiné l'onglet Réseau, chaque de ces fichiers nécessite un HTTP demande, que nous avons vu se un certain laps de temps. Maintenant, c'est peut-être pas beaucoup. C'est peut-être seulement 20 millisecondes. C'est peut-être de 200 millisecondes. 

Mais pensez à une page comme Facebook, ou CNN, ou Google, qui sont beaucoup plus grande que les exemples que nous avons regardé jusqu'à présent. Ces pages peuvent avoir des dizaines de fichiers, , dont chacun peut exiger une téléchargement d'un fichier. Donc, les choses peuvent potentiellement commencer à ralentir. 

Et surtout ces jours où nous sommes tous avoir des téléphones mobiles dans nos poches et connexions Internet lentes, ayant pour attendre quelques millisecondes, un peu plus de millisecondes pour plus fichiers peuvent effectivement être lente. La latence est le mot qui décrit le genre d'attente que vous avez que vous l'expérience lors de l'attente pour un morceau de l'information. 

Mais il ya un côté positif. Donc ce n'est pas tout sorte de - il est en fait un peu de balançoire ici. La baisse, maintenant, mais ce que les navigateurs peuvent faire si ils sont intelligents, afin d'éviter avoir à demander la même styles.css déposer à nouveau peut être pour quoi faire? 

Mettre en cache. Donc, la mise en cache - C-A-C-H-E - signifie généralement ici juste pour sauver la déposer vous avez demandé la première fois, et puis vérifiez votre cache pour cela. Vérifiez que vous êtes en quelque sorte de réservoir de stockage, et si vous avez déjà un copie de styles.css, même si un autre page dans le p-ensemble, ou tout site Web, demande à nouveau, juste pour donner l' ce même utilisateur copie mise en cache. Ne vous embêtez pas la demande. 

Inconvénient il, si, comme certains d'entre vous ont trébuché dans le p-ensemble. Si vous faites un changement sur le serveur et vous revenez au navigateur et vous recharger, parfois le navigateur fait vous une faveur et ne dérange pas re-télécharger votre fichier styles.css car, come on, quelles sont les chances que ces styles qui utilise Facebook vont changer d'heure en heure ou au jour le jour? Il est assez faible. Ils pourraient changer au fil du temps, mais pas à la minute ou à l'heure. 

Donc, une astuce, juste FYI Web lorsque vous faites développement, est souvent maintenez la Maj par exemple, puis cliquez sur recharger dans votre navigateur, et que la volonté dire généralement le rechargement du navigateur tout, même si vous avez déjà dans la mémoire cache. Encore une fois, positifs et négatifs, mais chacun d'eux finalement décisions de conception. 

Alors maintenant, nous n'avons pas seulement fin de l'histoire ici. Si je retourne maintenant et à l'arrière et à l'arrière et dos, nous avons commencé à introduire non seulement HTML, mais PHP. Donc, en termes simples, ce PHP ne laissez nous faire? 

PUBLIC: [inaudible]. 

DAVID Malan: Qu'est-ce que c'est? 

PUBLIC: Présentez-logique dans le code. 

DAVID Malan: Ouais, introduire logique dans votre code. C'est donc un véritable langage de programmation avec des boucles et des variables, et les fonctions et les conditions, et tous les choses que nous avons utilisé le chemin du retour quand depuis zéro. Et PHP, nous l'avons vu, peut être utilisé soit à la ligne de commande - il ne pas avoir quelque chose à voir avec le web, même si c'est vraiment ses origines et ce qu'il tend d'être bon et propice à - mais vous pouvez utiliser PHP simplement par la nature du fait qu'il a un print () fonction, et une fonction printf (), ou une fonction () echo. Il ya des grappes de façons dont vous peut imprimer du texte avec PHP. 

Par conséquent, vous pouvez utiliser cette programmation langue de sortie exactement ce que nous parlions auparavant. Vous pouvez générer dynamiquement votre code HTML. Peut-être pas tout. Peut-être vous durs choses de code, comme le tête et le pied de page, et le logo, et vos feuilles de style, et tout cela. Mais pour quelque chose comme p-ensemble de sept, où vous manipuler les stocks et montrant le portefeuille de l'utilisateur, qui est va changer dynamiquement, vous pouvez utiliser sûrement PHP et la logique, il donne vous en tant que langage de programmation pour production sous-ensembles dynamiquement de la page. 

Ainsi, lorsque vous parlez de sites web dynamiques, ou la programmation web, c'est ce que vous êtes vraiment parler. En utilisant un langage comme PHP, ou des choses appelé Python, ou Ruby ou Java, ou encore d'autres langues, pour interroger une base de données souvent, ou un autre serveur, et puis cracher dynamiquement HTML. 

Maintenant, le résultat final, en passant, est que le code HTML de la plupart des sites, y compris votre p-ensemble de sept, est probablement va être un énorme gâchis si vous regardez la source code dans un navigateur. Ce n'est pas une grosse affaire. À ce moment, quand nous nous soucions modèle, nous nous soucions de la choses que vous écrivez. Nous ne serons pas se soucier de l'étoffe que ce que vos sorties de code. Donc, ne vous inquiétez pas indentation ici si c'est PHP c'est sortie effectivement choses. Après tout, le navigateur ne s'en soucient pas, et un être humain ne sera pas à la recherche à la source de toute façon. Nous le personnel, par exemple, serait être à la recherche à votre PHP. 

Permettez-moi de donner un exemple rapide maintenant de quelle autre raison cela pourrait être utile. Donc, franchement, je ne me souviens pas la dernière fois que j'ai utilisé C à résoudre un problème en le monde réel. Il a probablement été à l'école d'études supérieures quand J'avais besoin d'utiliser un langage qui était assez faible niveau et m'a donné l' possibilité de faire quelque chose de très haute effectuer pour sauver vraiment autant de CPU cycles que j'ai pu, en grande partie parce que j'étais en utilisant d'énormes ensembles de données, et chaque cycle de la CPU en compte. Et franchement, même dans les choses comme les téléphones ces jours-ci et d'autres dispositifs où vous n'avez pas tout à fait autant mémoire et vous n'avez pas tout à fait comme avez de CPU, en utilisant des langages plus rapides toujours en appel. 

Mais dans le monde réel, quand vous venez de vouloir jeter un programme ensemble pour analyser des données, ou que vous avez recueillies tout un tas d'enregistrements pour un groupe d'étudiant et que vous voulez très automatiser rapidement l'envoi de courriels un par un pour chacun de ces inscrits, vous allez atteindre pour un langage de haut niveau que C pour ainsi dire. Quelque chose comme PHP ou Python, ou Ruby, ou une demi-douzaine d'autres qui existent ces jours-ci. Mais ces trois sont probablement le plus à la mode en ce moment. 

Et ce que cela signifie est que vous pouvez ouvrir un éditeur de texte comme gedit ou plus rien d'autre et puis il suffit de commencer écrire du code sans avoir à se soucier sur la compilation, sans avoir à vraiment s'inquiéter gestion de la mémoire, en gardant à l'esprit que un peu négligence finira par revenir à vous mordre si l'ensemble de données devient plus grand ou le problème devient grand. Mais ce que cela signifie pour nous est la suivante. 

Permettez-moi aller de l'avant et lance orthographe de problème posé six. Donc, c'est ma mise en œuvre sur la base trie- que j'ai utilisé sur le grand conseil où j'ai effectué pas si bien. Nous y reviendrons dans le temps d'une semaine et revoir ceux qui ne finissent au sommet de la grand tableau lors de notre dernière conférence. Mais pour l'instant, laissez-moi aller de l'avant et juste exécuter ma solution dans le texte, et nous ferons la King James Bible, et nous y voilà. 

Donc, ce sont tous les soi-disant les mots mal orthographiés sur la Bible King James. Et ma mise en œuvre a une demi-seconde au total. Donc, pas trop mal sur ce particulier ordinateur. Mais pensez à combien code que j'ai eu à écrire. Pensez combien le code que vous aviez à écrire. Pensez combien d'heures vous avez passé dans la D-hall ou votre dortoir ou ailleurs effectivement le codage de cette solution. 

Eh bien, si j'ai fait un niveau plus élevé langue comme PHP, prendre note des ce que je peux faire ici. Tout d'abord, supposons que c'est la place votre code de distribution. Il s'agit d'un fichier appelé correcteur orthographique. Il est disponible dans le cadre d'aujourd'hui code de distribution. Et je vais agiter ma main au plus des détails, mais il s'agit en fait un exemple intéressant de la manière dont vous aimerez le port d'une langue comme C vers PHP. J'ai littéralement ouvert deux fenêtres de texte, un avec ma version de C de speller.c, et j'ai commencé à le traduire dans mon tête de PHP et taper à l'aide les plus proches des fonctions équivalentes. 

Ainsi, certaines de ces choses sont différentes. Nous avons vu la dernière fois que PHP n'utilise pas inclure exactement de la même façon. Il utilise généralement besoin, si inclure n'existe. Définir est un peu différent de # Define en C, mais c'est comment nous faisons une constante. $ Argc il s'avère existe en PHP, de sorte que nous avons vu auparavant. Ce ne sont que des variables, l'ensemble des qui commencent avec des signes dollar. Rappelons ce sont juste un groupe de points flottants. 

Tant histoire courte, vous êtes invités à parcourir ce si curieux, c'est presque une conversion de la ligne à la ligne La version C de speller.c en PHP. Et vous pouvez le faire à nouveau pour une demi-douzaine d'autres langues. 

Mais ce qui est intéressant, c'est ce. Ou ce qui est franchement décourageant est la suivante. Permettez-moi aller de l'avant et tape sur dictionary.php, et demande que je suis aller de l'avant et re-mettre en œuvre problème réglé six ici. 

Donc, nous allons proposer d'abord que dans cette fichier, qui sera mis en œuvre dans PHP, alors laissez-moi ouvrir mes tags comme ça. Permettez-moi de me donner un mondial variable $ taille devient zéro. Et je vais donner me une table de hachage. Je vais utiliser une table de hachage pour cette chose. Comment dois-je déclarer une table de hachage en PHP? Fait. OK. 

Support de façon à ouvrir fermer support représente ce en PHP, comme nous l'avons vu? Un tableau, mais un tableau qui pourrait être un tableau associatif. Un tableau associatif est une structure de données qui associe des touches avec des valeurs. 

Or, dans le plus simple indexé numériquement tableau, ces touches sont quoi? Zéro, un, deux, trois, non? Vieux trucs d'école de retour de C. Mais il peut être également des chaînes comme foo et bar, ou maxwell, ou une telle chaîne. Je ne peux donc tirer parti de cette dans un instant. 

Permettez-moi aller de l'avant et déclare une fonction comme - Faisons load () d'abord. Donc, la charge de la fonction (). Et PHP est un peu différent en ce que vous tapez littéralement fonction, mais vous ne tapez pas un type de retour. Je vais aller de l'avant et de dire que la la fonction load () devrait prendre en argument $ dictionnaire, juste comme la version C fait. Je fais que de la mémoire. 

Et je propose que je suis va le faire. Je vais simplement faire foreach. Je vais appeler une fonction appelée déposer (), en transmettant le nom de cette déposer, qui est la variable $ $ Dictionnaire comme mot. Et puis à l'intérieur de ma boucle for ici, je suis aller de l'avant et de stocker dans mon $ Table $ word obtient vrai. Terminé. Oh, attendez. Terminé. OK. 

C'est la fonction de chargement () dire en PHP. Maintenant, pourquoi ça marche? Et je suis une sorte de tricherie ici. 

Alors, un, foreach, nous avons vu brièvement dernière fois. Cela signifie simplement que vous pouvez parcourir un tableau sans embêter avec i et n et plus plus, et tout cela. Dictionnaire est bien sûr le nom du fichier, quelque chose comme grandes ou petites, les deux dictionnaires, nous avons utilisé la dernière fois. Le fichier est une fonction qui ouvre texte fichier, lit en ligne par ligne, et mains vous sauvegardez un choix énorme, chacun des éléments dont est une La ligne à partir de ce fichier. C'est donc la combinaison de fopen, et fread et boucle while, et fclose, et tout ça. Enfin, comme le mot signifie simplement que c'est le variables, je vais avoir accès à à chaque itération dans cette boucle. 

Donc en bref, cette ligne de commande signifie ici ouvrir le fichier dont le nom est en dictionnaire, la variable, itérer sur ligne par ligne, et chaque fois que vous obtenez une ligne, stocker dans un appelé mot variable, et puis faire quelque chose avec le mot. Ce que je veux faire? Je veux mettre le mot dans ma table de hachage. 

Eh bien, je peux mettre quelque chose dans mon table de hachage comme en C utilisant des crochets. C'est le nom de ma table de hachage. Je vais à l'index dans ce hachage table à cet endroit. Ainsi, non support de zéro, pas un support. Support devis unquote quelque chose, tout ce que ce mot est. Et tout comme vous pourriez avoir dans votre table de hachage trie de travail, il vous suffit de stocker effectivement un booléen, implicitement ou explicitement. Terminé. Je stocker la valeur réelle. 

Maintenant, il ya un certain nombre de choses Je coupe les coins ronds sur ici. Techniquement, il va y avoir une nouvelle ligne gênant, / n, à la fin de chacun de ces mots. Donc, je devrais probablement appeler une fonction PHP appelé chop (), qui sera littéralement abattre cet arrêt. Et j'ai vraiment besoin de faire autre chose. Je devrais sans doute augmenter la taille de chaque itération, donc je suis garder la trace le monde de quoi il s'agit. Et franchement, et c'est l'un des aspects plus stupides de PHP, si vous êtes en utilisant une variable globale, vous devez de dire explicitement que vous êtes. Donc, je vais effectivement taper mondial $ Taille, $ tableau global, et maintenant ma fonction est terminée. 

Donc, pas tout à fait aussi simple qu'avant, mais probablement pris moins de temps que le C La version, peut-être? OK. 

Alors maintenant, nous allons faire la fonction check (). Voyons voir si ce au moins eu le des heures qu'il nous a fallu en C. Donc, laissez-moi aller de l'avant et déclare vérifier en fonction. Prend le mot d'argument, qui est va venir Speller. Et je vais juste vérifier si l' suite isset variable tableau support strtolower de mot - nous allons équilibrer l'ensemble de mes parenthèses - alors retourner vrai. Autres - c'était vraiment le dur cadre de ce programme. Sinon, retourne false. Terminé. C'est chèque (). 

Maintenant, pourquoi ça marche? Eh bien, je passais un en un mot, qui est une chaîne de caractères. Deux, je vérifie à l'intérieur du hachage table, qui s'appelle $ table. Je suis le forçant à minuscules en appelant une fonction tolower assez similaire () dans C, mais cela ne le mot en entier, pas un seul caractère. Et si cela est réglé, en d'autres termes, il est un ensemble de valeurs, en d'autres termes, si c'est vrai, alors oui, il s'agit d'un mot. Parce que je l'ai mis là avec load (). Et sinon, je vais retourner faux. 

Maintenant, les autres sont faciles. taille de la fonction (), comment puis-je faire cela? Je ne reviens essentiellement $ taille. Mais je dois techniquement cela ennuyeux. Et en fait, vous entends, je coupais un coin de trop. J'ai vraiment besoin de faire $ tableau global. 

Mais cela étant dit, déchargement). Décharger () est incroyable. Fonctionner décharger (). Comment puis-je veux mettre en œuvre décharger (?) Terminé. OK. 

Alors décharger (), gestion de la mémoire est entièrement pris en charge pour vous en quelque chose comme PHP et beaucoup des langages de haut niveau. Donc, c'est incroyable. Comme pourquoi diable avons-nous passé la dernière huit semaines ainsi que sur la rédaction C apparemment très lent, vraiment temps problèmes de consommation avec des dizaines d'heures de travail sous nos ceintures? 

Eh bien, pour une chose, cela peut fonctionner très bien pour les petits programmes. Il a certainement accéléré mon temps de développement. Mais nous allons voir ce qui se passe dans le monde réel. 

Laissez-moi aller dans ce répertoire dans une fenêtre de terminal. Il ya Speller. Et remarquez en passant, et vous pourriez ont rencontré ce problème posé dans six ou sept problème réglé. Vous n'avez pas strictement aux fin fichiers PHP avec. php. Si vous mettez une ligne comme ça au premier Tout en haut, c'est une ligne spéciale de syntaxe qui signifie essentiellement trouver le programme appelé PHP et l'utiliser pour interpréter ce fichier. Alors maintenant, on ne sait pas vraiment qui Je cours un programme PHP. Je peux courir juste comme si elle ont quelque chose compilé en C. 

Mais voici la chose. En fait, nous allons le faire à nouveau. Dropbox/pset6 /. Il ya Speller. OK, 0,44 secondes. Il est arrivé plus vite cette fois. 

Passons maintenant à la version PHP. Gentille attention. Mais il suffit de penser combien de temps J'ai économisé aux heures de bureau. OK. 

Donc 3,59 secondes, ce qui en fait ne semble pas exact non plus. Mais c'est parce que longue histoire courte, lorsque vous imprimez une quantité énorme de choses à l'écran, qui elle-même ralentit les choses. Qu'est-ce qu'il a vraiment pris la CPU dans la appareil était de 3,59 secondes, en Contrairement à C, qui a pris 0,44 secondes plus récemment. C'est vraiment un ordre de ampleur différente. 

Alors, où est ce prix vient? Pourquoi est-il si lent? Pourquoi PHP effectuer si mal? Danielle? 

PUBLIC: Vous n'avez pas vraiment utiliser une table de hachage. 

DAVID Malan: Je n'ai pas vraiment utiliser une table de hachage. Donc j'ai un peu fait. Il s'agit donc d'un tableau associatif. Très probablement si les gens de PHP sont très intelligent, ils ont utilisé sous la capot d'une table de hachage réelle mise en œuvre dans quelque chose comme C ou C + +. Mais. Ouais. 

PUBLIC: [inaudible]. 

DAVID Malan: Ouais. Ainsi chacune des fonctions que j'ai écrit aujourd'hui - effectivement, pouvez-vous dire qu'une fois de plus un peu plus fort? 

PUBLIC: Chacune des fonctions que vous avez inclus a beaucoup plus complet la capacité de - 

DAVID Malan: C'est très vrai. Il ya beaucoup plus de frais généraux que nous sommes pas vraiment voir en se concentrant uniquement sur dictionary.php, que je viens d'écrire. En revanche, il ya tout un interprète passer en arrière-plan. En effet, quand j'ai couru ce programme, il n'était pas en cours d'exécution zéros et de uns compilées conçu pour mon CPU Intel. Au contraire, il a été en cours d'exécution ligne par ligne code PHP qui ressemble exactement comme nous avons tapé il. Et chaque fois que vous utilisez un langage interprété, vous effectivement ne pas payer ce prix. Il va prendre le temps de lire votre dossier haut en bas, de gauche à droite, puis exécuter chaque ligne, encore et encore. 

Or, dans la réalité, en particulier sur le web, vous pouvez réellement accélérer le processus en mettant en cache les résultats de l' code PHP interprété. Et cela fait sens sur le web, car si vous n'avez pas un utilisateur comme moi ici, mais 1000 ou 10 000 utilisateurs, peut-être la première fois que le fichier est consultée c'est lent, mais par la suite, c'est beaucoup plus rapide. 

Mais cela aussi, encore une fois, est un hors commerce. Et quelque chose comme une des données de recherche définir, ou même quelque chose de grand comme ce, les utilisateurs finiront commencer à se sentir ce ralentissement. 

Donc en bref, les langages interprétés sont très en vogue, très populaire, et franchement sont probablement les langues vous devrait atteindre pour la résolution de problèmes à la suite de CS50. Mais réalisez combien vous êtes vraiment en prenant pour acquis sous le capot vraiment ces dernières semaines dans hachage tables, et des arbres, et tente, qui sont utilisés en fin de compte à fait mettre en œuvre des choses comme support ouvert, crochet, que nous pouvons maintenant prendre gratitude pour acquis. 

Donc, nous allons jeter un coup d'oeil maintenant dans ce contexte web. Et je l'ai dit la dernière fois qu'il ya un tas de superglobals en PHP qui ne sont pas vraiment pertinentes à la ligne de commande. Ils sont plus pertinentes dans le contexte de l'utilisation de PHP dans un contexte web. Donc, l'utilisation de PHP sur un serveur web afin pour générer des trucs comme HTML. 

Et nous regardions à $ _GET et $ _POST, et c'est là automatiquement les utilisateurs ' entrée finit tout simplement si vous soumettez un former à un fichier se terminant par. php sur un site web serveur comme l'appareil. Mais regardons brièvement $ _COOKIE Et $ _SESSION. 

En termes simples, ce qui est un cookie vous comprenez dans le contexte de en utilisant le web? 

PUBLIC: Dossier sur l'ordinateur. 

DAVID Malan: Ouais. Il s'agit d'un fichier sur l'ordinateur de l'utilisateur planté par tous les site web vous arrive de visiter. Donc quand vous allez à Facebook, quand vous allez à bankofamerica.com, quand vous allez à google.com, quand vous allez à presque n'importe quelle site dans le monde ces jours-ci, y compris cs50.net, un cookie est planté sur votre ordinateur, qui est soit une valeur stockée dans la RAM dans votre ordinateur dans la mémoire de votre navigateur, ou parfois même un fichier stocké sur votre disque dur. 

Et ce qui est généralement stocké dans ce fichier n'est pas votre nom d'utilisateur, pas votre mot de passe, généralement pas quelque chose sensible à moins que le site n'est pas si bon avec leur sécurité, mais plutôt c'est un grand identifiant unique parmi les d'autres choses. C'est un grand nombre aléatoire planté sur votre ordinateur, mais vous pouvez penser que une sorte de timbre virtuel de main comme de un club ou d'un parc d'attractions qui permet le personnel, les propriétaires de ce services, de se rappeler qui vous êtes. Donc, si le grand nombre aléatoire est comme 12345678, même si c'est évidemment pas trop aléatoire, penser que la Timbre à main que lorsque vous visitez facebook.com pour la première fois, ils éradiquer ce numéro sur votre main. Et puis parce que vous parlez HTTP, vous étant un navigateur, et parce Facebook parle évidemment la même que d'une bande serveur, dit le protocole HTTP qui quand vous visitez la suite facebook.com, qu'il s'agisse d'un deuxième plus tard, une heure plus tard, même le jour suivant, aussi longtemps que vous n'avez pas explicitement déconnecté, qui a effectivement c'est comme se laver les mains. HTTP dit que vous devez présenter votre timbre de main chaque fois que vous revenir à ce site web. 

Qu'est-ce que Facebook ne fait alors qu'ils regarder ce timbre à la main et ils disent, oh, 123456789. Je ne sais pas, à première vue que cette David Malan à Cambridge, Massachusetts, mais ils peuvent vérifier leur base de données et dire, oh, la personne pour lequel nous avons planté 123456789 ordinateur David Malan de Cambridge, Massachusetts. Montrons que l'utilisateur puis son profil page ou son Nouvelles RSS. 

Mais il ya un problème ici si ce est de savoir comment fonctionne le web en effet. Jetons un oeil à un exemple rapide. Disons effectivement aller à dire facebook.com. Mais avant que nous puissions y aller, laisser moi aller de l'avant et d'ouvrir Chrome Inspecteur ici. Laissez-moi regarder à l'onglet Réseau. Et maintenant, nous allons aller de l'avant et saisissez dans https://facebook.com. Et je fais cela pour que nous ne voyons pas tous ces redirections et des déchets temps en regardant à travers celles-ci. Permettez-moi de frapper entrer. 

Très bien. Nous voyons tout un tas de demandes. Il arrive Facebook. Il ya tout un tas de fichiers. Et ici, par ma mention de latence dernière fois, c'est un grand nombre de requêtes HTTP. Mais le premier est probablement le plus intéressant. 

Donc, nous allons faire défiler vers le bas ici, et Je zoome dans une seconde. Cela va être une sorte de un désordre, mais nous allons voir. Facebook nous envoie un tas de trucs. 

Mais whoa, intéressant. Ils plantation non pas un, mais quatre timbres main sur ma main ici. Set-Cookie, Set-Cookie, Set-Cookie, Set-Cookie. Et il ya quelques caractéristiques ici. Tout d'entre eux mentionnent une certaine genre d'expiration. Et il semble que Facebook espère me rappeler jusqu'en 2015. Donc, c'est sans doute le moment où Je dois vous déconnecter ou ils vont simplement suppose automatiquement que je suis ne reviendra pas. Donc, c'est en fait un décent quantité de temps. 

Et il ya un autre choses qui se passent ici. Ce cookie semble être de force supprimé en disant qu'il a expiré en 1970 avant existaient cookies. Ainsi, le navigateur va juste à assumer OK, c'est comme le lavage des mains cachet. 

Mais maintenant, quand mon navigateur fait une demande ultérieure - laissez-moi aller de l'avant et faire ce encore et rechargement. Maintenant, laissez-moi revenir en arrière à l' haut demande et descendre ici, demander têtes. Notez ce. Alors maintenant, je suis sous non-têtes de réponse, mais remarquez qu'il dit têtes de requête. Et remarquez que mon navigateur dans le cadre de sa demande après avoir heurté rechargement a envoyé au moins les éléments suivants information. Non Set-Cookie, mais cookie. Donc, c'est la ligne, l'en-tête HTTP pour dire, où mon navigateur est en quelque sorte de mon insu présentant ma main pour l'inspection de Facebook. 

Donc, ces cookies peuvent être utilisé alors pour quoi? Pour rappeler qui vous êtes, ou se rappeler comment Plusieurs fois, vous avez été là, ou vraiment quelque chose. 

Voici donc counter.php. Et laissez-moi un zoom avant sur la police. Et chaque fois que je recharge cette page, un avis c'est se souvenir combien de fois Je suis passé par là. Eh bien, ce n'est pas tout ce qui impressionnant. Disons simplement fermer cet onglet, et maintenant revenons à http://localhost/counter.php. 

Oh, c'est intéressant. Il se souvient encore, même si je fermais l'onglet. Et franchement, si je ferme le navigateur, si elles sont appliquées dans le droit chemin, je pourrait encore se rappeler que cet utilisateur est qui il ou elle a été la première fois, et seulement une fois que je vais dans le menu de Chrome, qui ici est ici, et aller à Historique, cliquez sur Effacer et les données de navigation, comme certains d'entre vous peuvent avoir dans le passé, alors seulement vos cookies effectivement être supprimé lors web développement. 

Donc, si nous allons - fermons jusqu'à gedit ici. Et si nous passons maintenant à ce fichier. Laissez-moi aller dans notre vhosts / localhost / publique, et laissez-moi faire counter.php. Notez que ceci est une jolie programme simple. C'est un site assez simple. 

Ainsi, le début du fichier est seulement commentaires. Mais voici une nouvelle ligne que vous pouvez ont déjà vu dans le p-mis sept, session_start (). Il s'agit d'une ligne de code PHP qui indique essentiellement le serveur web, make Assurez-vous d'apposer les mains et faire N'oubliez pas de vérifier les timbres à main. C'est tout ce qui fait la ligne, et il fait tout ce processus pour nous. Ensuite, notez que je viens de recevoir deux branches ici. Si la touche de compteur à l'intérieur de cette variable globale spéciale appelée $ _SESSION Est réglé - en d'autres termes, si il ya une certaine valeur, il - nous allons l'obtenir et le stocker dans un locale variable appelée $ compteur. Sinon, nous allons assigner $ contre la valeur par défaut de 0. 

Maintenant, voici un aspect de PHP qui est à la fois une bénédiction et une malédiction. PHP est un peu bâclé. Ainsi, alors que dans C, ce qui serait la portée de compteur ont été soit ici ou ici? 

Il aurait été confiné à ces accolades. Devinez quoi? En PHP, il existe même en dehors de ceux accolades, ici, et ici, et ici, et ici, et même en bas. Donc, je dis que c'est une bénédiction dans le sens que vous n'avez pas à penser que dur comme nous l'avons fait il ya quelques semaines. Mais c'est aussi un peu d'une malédiction en ce que peu importe où vous utilisez une variable dans PHP, au moins dans un programme comme celui-ci, il est globalement accessible pour le meilleur ou pour le pire. Donc, vous devez garder à l'esprit maintenant que vos variables ne peuvent pas être indéfini. Vous pourriez avoir les défini ailleurs. 

Mais qu'est-ce que je vais faire en fin de compte? Je vais stocker à l'intérieur de ce monde variable en tant que valeur de l' compteur clé le résultat de faire contre plus 1. Donc, ce n'est que le calcul cela ne l' incrémentation de ce compteur. Et le fait que je suis le stockage que valeur de retour ici est moyen à essentiellement de mettre à jour la base de données pour rappelez-vous que l'utilisateur 123456789 a été ici deux fois. Et quand je le fais à nouveau la prochaine fois que je recharger la page, il va vérifier mon timbre de la main et dire, oh, 123456789 utilisateur a maintenant été ici trois fois. 

Et donc ce que PHP langues et assimilés font pour nous, c'est qu'ils essaient de trouver comment, où et pour combien de temps pour stocker des valeurs dans cette spéciale superglobal. Et cette superglobal la prochaine fois que je visitez la page est une sorte de magie pré-remplie, remplie avec des valeurs qui étaient là la dernière fois que vous avez consultées, si c'était il ya une seconde, une semaine il ya, ou en 2013 et nous parlons maintenant 2015 environ. PHP et le serveur Web se chargent de tout cela pour vous. 

AUDIENCE: [inaudible]. 

DAVID MALAN: les variables en PHP sont essentiellement toujours mondial à moins que vous les déclarer à l'intérieur d'une fonction, et puis ils correspondent à la seule fonction. Mais parce que je n'ai pas écrit fonctions, ils sont maintenant efficacement mondiale tout au long de mon dossier ici. 

AUDIENCE: Y at-il un moyen pour les faire local? 

DAVID MALAN: Yat-il un moyen de les faire local? Seulement en les enveloppant dans des fonctions. Qui dans la dernière version de PHP, vous pouvez le faire avec une fonction anonyme. Mais plus que dans le contexte de JavaScript. Mais la réponse est non. Une réponse plus longue est oui. Nice. Bonne question du quiz. Très bien. 

Alors, enfin, la page elle-même est en fait assez simple. Notez qu'une fois que je sors de mode PHP, rappeler que toutes ces choses vers le bas ci-dessous va tout simplement pour obtenir spit à cru au navigateur. Ce qui est bien, parce que je ne veux envoyer l'utilisateur du code HTML, mais je ne veux de mettre à jour dynamiquement HTML. Et d'une manière que je peux faire est de trier de tomber très vite dans PHP mode, utilisez ouverte support interrogation signe égal, puis sortie de la valeur du compteur. 

Ou si cela ressemble un peu cryptique, cette signe égal est en fait quelques-unes sucre syntaxique pour cette printf ($ compteur). Mais franchement, c'est un peu laid et un peu ennuyeux à taper. Donc, PHP propose très bien cette fonctionnalité où vous pouvez simplement dire plus succinctement de la même manière. 

Alors qu'est-ce qui se passe en dessous le capot? Voyons rapidement regarder le réseau tab ici pour counter.php. Et permettez-moi d'aller de l'avant et le premier nous allons effacer vos cookies. Les données de navigation claires Let depuis le début des temps. Maintenant revenons ici. Maintenant, nous allons recharger la page. Et je suis de retour à zéro. Parce que mon timbre de main a été lavé, Je reçois maintenant un nouveau cookie. 

En effet, si je regarde l'onglet réseau et regardez-têtes de réponse, notez que l'appareil est m'envoie un cookie dont le nom est quelque peu arbitrairement, mais un peu raisonnablement, phpsessid. Et il m'envoie ce vraiment grand nombre aléatoire. Ce n'est pas tout à fait un certain nombre. Ce n'est pas tout à fait hexadécimal. C'est une sorte de chaîne de caractères alphanumériques, mais on peut supposer que c'est aléatoire. Et c'est le cachet de la main afin d' dis ce que je fais allusion. 

Pendant ce temps, si je puis cliquez sur Recharger regarder cette seconde ligne pour mon deuxième demande, remarquez maintenant que ma demande têtes comprennent PHPSESSID équivaut à cela, pas Set-Cookie, mais juste cookie. Et c'est la présentation de mon navigateur de mon cachet à la main. 

Alors maintenant, comme un teaser, et nous parlerons plus à ce sujet dans une semaine ou deux, mais En quoi ce que vous faites vulnérables, votre compte Facebook vulnérables, et d'autres comme comptes vulnérables? 

AUDIENCE: Si quelqu'un a votre cookie. 

DAVID MALAN: Ouais, si quelqu'un a votre cookie. Je veux dire vraiment, un peu comme certains d'entre vous aurait tenté à comme un club ou un parc d'attractions, si vous essayez quelque chose comme ça pour copier le timbre, mais en arrière sur la main d'une autre personne, et puis il ou elle le présente comme eux-mêmes, si elle en fait ne regarde identique, 123456789, puis le web serveur est apparemment juste va confiance que l'utilisateur, c'est vous. 

Et c'est en effet un élément fondamental menace une fois que vous utilisez les cookies parce que si quelqu'un usurpe tellement à parler de vos biscuits, les chiffres sur ce qu'il est, soit en copiant vraiment en regardant votre ordinateur et étant semblable, OK. Le cookie de David est JJ3JIK et ainsi de suite, et puis ils sont assez intelligents pour savoir comment trier des envoyer manuellement que cookie à partir d'un navigateur ou d'un programme, écrivent-ils, ils ne pouvaient totalement se connecter à un site Web que vous. Il n'est pas si difficile à faire semblant d'être quelqu'un d'autre à moins que nous revisitons p-set deux, qui a introduit ce? 

AUDIENCE: Cryptographie. 

DAVID MALAN: Un peu peu de cryptographie. Cryptographie simple, au moins dans la édition standard, mais crypto néanmoins. moins. Ainsi, il s'avère si vous chiffrez tous ces en-têtes à l'aide de quelque chose que vous pourraient désormais savoir plus familièrement comme SSL, secure socket layer, ou URL https:// puis toutes ces choses que nous avons été en regardant sont réellement crypté, ce qui signifie que c'est comme si vous ne peut pas lire le cachet de la main. Seulement facebook.com peut, ou google.com, ou dans ce cas, l'appareil peut lire cette empreinte de la main. 

Tragiquement cependant, et encore, ce n'est trop appropriée avec les trucs NSA de la fin, même SSL est cassable. Et c'est en fait pas si difficile de même casser le cryptage. Pas tellement par craquage du chiffrement, mais en incitant le navigateur dans le décryptage les données prématurément. Mais encore une fois, nous allons vous taquiner avec qu'avant longtemps. Pour l'instant, avoir peur. C'est tragiquement genre de vrai. 

Très bien. Alors, d'où vient ce maintenant laissez-nous? Eh bien, nous allons le faire. Allons de l'avant et prendre une rapide Teaser avant de prendre une pause. Et je pense que nous allons s'attarder un peu plus longtemps aujourd'hui, mais nous allons plonger dans quelque chose de nouveau et sexy, qui sera aiguiser votre appétit pour encore plus. C'est donc le teaser. 

Donc, SQL, nous avons commencé à parler de jamais si brièvement la dernière fois. Vous allez vraiment vous salir les mains avec certaines d'entre elles dans le p-mis sept ans. Et en termes simples, ce qui ne SQL - S-Q-L - faire pour vous? Qu'est-ce que c'est? Ouais. 

PUBLIC: Voyons vos données d'accès. 

DAVID Malan: Ouais. C'est toi données d'accès laisser dans une base de données. Structured Query Language. Et c'est essentiellement un langage de programmation. Il ya des caractéristiques de celui-ci que nous allons même pas utiliser en classe. Mais vous pouvez effectivement définir des fonctions. Ils sont appelés stockée procédures SQL. Mais nous gardons assez simple et juste l'utiliser pour certaines opérations de base comme la sélection de données, insérer des données, la mise à jour des données, et la suppression de données. 

Et vous pouvez vraiment penser à une base de données, comme une base de données SQL, comme on vient de étant Microsoft Excel. Étant donné que SQL se réfère à un relationnel base de données, où relation signifie simplement tableaux. Les lignes et les colonnes. Donc, tout ce que vous pouvez mettre dans une feuille de calcul comme ceci ou Google Docs, vous pourriez mettre dans une base de données SQL en déclarant une table. 

Maintenant, comment voulez-vous accéder à fait cette information? Eh bien, avec des commandes ou requêtes de ce genre. SELECT, INSERT, UPDATE et DELETE. Et, pour la plupart, ceux-ci sont l' quatre seuls ingrédients dont vous aurez besoin pour faire quelque chose de très puissant dans sept problème posé. 

Maintenant de retour dans la journée, vous serait en fait interagir avec une base de données dans un fenêtre du terminal noir et blanc à une invite à clignoter comme ceci. Et la base de données nous courir sur la appareil est appelé MySQL, qui est moteur de base de données libre et open source. Si vous Google et lire la Wikipedia article, vous saurez que le nom est un bit de transition pour quelque versions de Linux. Base de données Maria est en fait une débourser pour ainsi dire de MySQL. 

Longue histoire courte, Oracle a acheté MySQL. Oracle est une grande entreprise. Les gens ont été inquiet qu'il serait plus rester tout à fait en open source, donc c'est juste une copie de MySQL qui est toujours libre, toujours open source, et installé dans Fedora Linux par défaut. 

Mais ce n'est une sorte de douleur dans la cou de se familiariser avec un base de données de cette façon. Donc, nous incluons dans l'appareil de CS50 un outil gratuit et open source appelé phpMyAdmin. Juste une coïncidence que il est écrit en PHP. Il n'y a pas fondamentale besoin pour PHP ici. Mais c'est juste un outil basé sur le Web qui nous avons téléchargé gratuitement, installé dans l'appareil, qui nous permet d'avoir une interface d'utilisateur graphique avec laquelle pour explorer la base de données de sept p-set avec qui de créer de nouvelles bases de données, dire pour votre propre projet final si vous voulez comme, et, finalement, de créer sites web dynamiques comme CS50 Finances qui vous permettent d'interroger les données et mettre à jour les données dynamiquement. 

Vous n'allez pas avoir à utiliser seulement un simple fichier texte ou CSV. Vous pouvez réellement utiliser une base de données intelligente programme de sorte que vous pouvez exécuter plus requêtes sophistiquées que la simple lecture à travers tout linéaire. 

Ainsi, par exemple, c'est ce que nous donnons vous hors de la boîte pour le p-mis sept ans. Il s'agit d'une table avec au moins en apparence trois colonnes, dont l'une est nom d'utilisateur, dont l'un est hachage, et l'autre qui est ID. 

Mais la chose intéressante, et juste pour démêler une pensée ici, le nom d'utilisateur est sans doute déjà unique, non? Je veux dire, la plupart n'importe quel site Web, si vous avez un nom d'utilisateur, il ne peut pas être deux Césars. Il ne peut y avoir deux Malans. Il ne peut y avoir deux jharvards. Son unique. Sinon, ils ne savent pas qui jharvard qu'il est réellement. Alors, que peut-être la motivation pour également ayant une troisième colonne de gauche il appelé ID, qui ressemble à un nombre qui est similaire unique? Il se sent un peu redondant me au premier coup d'œil. Pourquoi peut-il être convaincant d'avoir non seulement les noms d'utilisateurs uniques, mais aussi des numéros uniques? 

PUBLIC: Ils pourraient avoir le même mot de passe. 

DAVID Malan: Les gens pourraient avoir le même mot de passe, bien sûr. Cela pourrait arriver absolument. Mais si elles ont ce nom d'utilisateur unique, je diront que cela n'a pas vraiment d' question, parce que si ils tapent dans leur nom d'utilisateur, j'ai seulement besoin de vérifier leur mot de passe, leur hachage de celui-ci. Sinon, pourquoi? 

PUBLIC: Recherche plus rapide. 

DAVID Malan: Recherche plus rapide. Pourquoi? 

PUBLIC: ID est juste un. 

DAVID Malan: ID est un seul caractère, ou pour être plus précis, il s'agit d'un nombre, il est donc probablement 32 bits ou quelque chose comme ça. Considérant que le nom d'utilisateur, apparemment Jason La place de Hirschhorn il est une sorte de ridiculement longue, et il va me prendre beaucoup plus de temps à chaîne comparer H-I-R-S-C-H-H-O-R-N, et peut-être a / 0 ou quelque chose comme ça, dans l'ordre à voir Jason, plutôt que de simplement disant de me donner l'utilisateur numéro deux. C'est 32 bits. C'est un RC qui vous avez à comparer. Et en effet, c'est exactement la raison pour laquelle les bases de données ont tendance à attribuer des identifiants uniques à les lignes en eux. 

Maintenant, ce que d'autres types de données sont là outre RC et apparemment chaînes de ce genre? Eh bien, pour être plus correct, bases de données SQL, comme MySQL, ont des champs CHAR. Et CHAR un peu trompeuse est pas un seul CHAR. Un champ CHAR dans une base de données MySQL est un ou plusieurs caractères, mais c'est un nombre fixe de caractères. 

Ainsi, par exemple, si je dépasse à phpMyAdmin que vous avez déjà, ou va bientôt un problème posé sept, et je vais à ma base de données, et juste pour le fun, nous allons créer une nouvelle table appelée test avec seulement deux colonnes. Je puis cliquez sur OK. Et cela va devenir assez familier, surtout que vous bricolez autour sur votre propre. Ici, je pourrais taper ID pour créer une nouvelle table de type INT. Mais ici, je pourrais taper le nom d'utilisateur de recréer cette table plus tôt. Et remarquez que j'ai tout un tas de types à choisir. 

Et cela aussi est pourquoi phpMyAdmin est plutôt agréable. C'est une sorte d'auto-enseignement dans que vous peut juste sorte de point et clic, et regarder des menus déroulants, et en déduire que ce pouvoir SQL vous donne. 

Et en effet, si je choisis CHAR, je puis à spécifier la longueur, ou comment de nombreuses valeurs, combien de chars. Ainsi, les valeurs très fréquents sont des choses comme 255, mais c'est un peu long. Est couramment huit pour un nom d'utilisateur. Mais c'est un petit peu ces jours-ci. Donc, c'est une décision de conception. Est-ce 8 caractères max, 32, 255, 1000? C'est vraiment à vous. Mais un champ CHAR est un nombre fixe. Alors, choisissez trop peu et vous êtes un peu vissé si vous voulez un nom d'utilisateur plus. Choisissez un trop grand nombre et ce qui est la baisse? 

PUBLIC: [inaudible]. 

DAVID Malan: C'est du gaspillage. Tout comme en C, si vous avez une plus grande morceau de mémoire que vous avez besoin, vous êtes une perte de temps et de gaspiller l'espace. Ainsi, en variante, il existe VARCHAR, qui résout ce problème en le traitement de la longueur non comme une longueur fixe, mais comme une longueur maximale, et en utilisant un nombre variable de caractères, qui a ensuite a tendance à n'utiliser que de nombreux CHARs que vous réellement besoin. Cela semble parfait. 

Pourquoi ne pas se débarrasser de l' données de type char alors? Quelle pourrait être la baisse de utilisant Varchars, ce qui semble comme c'est une belle victoire? Ouais? 

PUBLIC: [inaudible]. 

DAVID Malan: OK, bon. Donc, si l'ensemble de vos données est la même longueur, ce qui est le problème? 

PUBLIC: Parce que vous perdez données par tous dire. 

DAVID Malan: Donc, si toutes vos données est la même longueur, mais, je dirais que la spécification d'une longueur maximale sur VARCHAR n'est pas différent de spécifiant une longueur fixe sur CHAR si vous savez que nombre à l'avance. Mais il est en effet, et je vais trier de extrait de la réponse de la réalité qu'il ya encore un max, ce qui pourrait être gênant, surtout si vous rencontrer le nom d'une personne qui est inhabituellement longue que vous ne l'avez pas anticiper. Et c'est aussi un peu moins efficace pour réellement chercher sur Varchars comme opposition à la recherche CHARs, en particulier pendant de longues tables qui ont beaucoup et beaucoup de données. Donc, ici aussi, thématique est de nouveau pas de choix évident. 

Donc, juste pour vous donner une idée de l'autre les types de données qui pourraient être d'intérêt soit pour le p-mis sept ou l'avenir, il est INT. Il ya BIGINT, qui est comme long long. Elle tend à être de 64 bits. Il ya DECIMAL, qui vous le verrez dans l'ensemble du problème, qui est une bien réponse propre aux problèmes que nous rencontré avec flotteur et flottant Point imprécision. Et puis il ya DATETIME. Il ya littéralement un type de données qui a pour ressembler à un an, un mois, un jour, et une heure, minute et seconde. 

Mais les bases de données SQL ont aussi choses que nous appelons index. Et un indice est quelque chose que vous spécifier lors de la création de la table de faire des recherches et d'autres activités plus efficace. Plus précisément, il ya quelque chose qui s'appelle l'index primaire que vous pourriez déclare ce qui suit. 

Nous l'avons fait pour vous, avec le table des utilisateurs, nous vous donnons. Mais remarquez si je recréé manuellement la table des utilisateurs ici donner un nom d'utilisateurs. J'ai déjà précisé ID. J'ai précisé RC. J'ai spécifié le nom d'utilisateur avec 32 caractères maximum. Mais si nous continuons à faire défiler dans ce assez large fenêtre, il ya un avis tas d'autres choses que je peux préciser. 

Un, je peux spécifier les attributs comme, vous savez quoi, ce RC devrait être signé. Je ne veux pas les nombres négatifs, Faisons donc il UNSIGNED. Null n'est pas pertinente ici parce que Je ne veux que chaque utilisateur avoir un numéro unique. Je ne veux pas qu'il soit nul. 

Mais ce qui est intéressant. Je peux préciser que ID est soit le clé primaire de cette base de données, ou il est unique, ou il est indexé, ou le texte intégral. Donc, pour les fins d'aujourd'hui, longue histoire Bref, le principal moyen que ce doit être à la fois conceptuellement et techniquement le domaine que nous utilisons pour unique identifier les utilisateurs. 

Alors, quand nous regardons les utilisateurs, c'est en quelque sorte d'une promesse de les chercher principalement par cet identifiant unique. Et la base de données fera en sorte que si vous avoir un numéro d'utilisateur 3, vous ne pouvez pas insérer physiquement un autre utilisateur avec le même nombre 3. La base de données sera simplement refuser pour enregistrer vos modifications. Qui est une bonne chose, parce que vous pouvez vous protéger contre vous-même. soi 

Sinon, le nom d'utilisateur. Donc, la deuxième ligne, le rappel, est le champ Nom d'utilisateur. Donc, la deuxième ligne est ici le nom d'utilisateur, comme nous l'avons fait à l'extrême gauche il. 

Alors quoi d'autre pourrais-je vouloir préciser? Je n'ai pas le droit, selon SQL, de spécifier deux clés primaires. vous pouvez spécifier une clé commune où vous regarder les deux domaines, mais ils ne peuvent pas être individuellement clés primaires. Donc, c'est hors de question. Alors qui pourrais-je vouloir choisir? 

Eh bien, UNIQUE est similaire dans l'esprit à un clé primaire où vous spécifiez ce domaine doit être unique, mais il est ne va pas être une J'utilise tout le temps. Et nous n'allons pas utiliser celui-ci tout le temps pour quelle raison déjà? C'est plus lent potentiellement si c'est un long nom d'utilisateur. C'est juste une perte de temps. 

INDEX, quant à lui, précise que c'est ne vais pas être unique, mais j'aimerais vous permet de travailler votre magie sous l' capot pour le rendre plus rapide pour moi d' recherche sur ce domaine. Donc, ce n'est probablement pas pertinente ici. Pour identifiant, je dirais que Unique est une bonne réponse. Mais supposons que nous avons fait plus d'utilisateurs intéressant que les noms d'utilisateurs seulement, hash et numéros d'identification. Et si on donnait aux gens les noms complets? Et si nous donnions les adresses et d'autres données à leur sujet? 

Eh bien, si vous spécifiez que une colonne dans une base de données est indexée, ce qui signifie que MySQL ou Oracle, ou quoi que base de données que vous utilisez, doit travailler sa magie et utiliser certains types de données de fantaisie Structure d'un arbre, ou une structure arborescente, ou une table de hachage, ou quelque chose de garantir que lorsque vous recherchez des données à l'aide sélectionner sur ce domaine particulier - que je montrer à tous que vit sur Oxford Street. Une requête de ce genre. Si vous avez spécifié à l'avance que vous voulez un index sur ce champ, le Les recherches seront beaucoup, beaucoup plus rapide. 

Si vous ne spécifiez pas d'index, le meilleur vous pouvez faire une recherche linéaire si ce n'est pas triée. Mais si vous spécifiez INDEX, la smart personnes qui ont fait la base de données - des gens comme vous qui connaissent maintenant des arbres et tente et les tables de hachage - va construire automatiquement un de ces données la structure en RAM pour s'assurer que ces recherches sont beaucoup plus rapides. 

FULLTEXT est quant à lui dans le même esprit, mais vous permet de faire joker recherches, comme me montrer à tous que vie aux rues qui commencent par la lettre O pour une raison quelconque. Vous pouvez effectuer des recherches génériques comme ça. Or, les choses plus convaincantes comme spectacle moi tout le monde qui a le dernier mot - montrez-moi tous ceux dont le nom commence par une lettre donnée. Vous pouvez rechercher des mots-clés de cette manière. Très bien. 

Ainsi, les possibilités de conception il ya potentiellement. Il ya d'autres que je serai agiter les mains au. Il s'avère que vous pouvez avoir différents moteurs de stockage. Et ce n'est plus mystérieux que nous devons certainement pour problème posé sept ans. Par défaut, les gars vous utilisez quelque chose qui s'appelle InnoDB. Vous verrez mention de ce quelque part dans L'interface de phpMyAdmin plus probable. Mais sachez qu'il ya autre conception des décisions qui sont du potentiel intérêt viennent projets finaux si vous faites quelque chose sur le web. 

Mais nous allons le faire. Allons de l'avant et mettre cela sur le écran comme un teaser pour une histoire vous, un colocataire, impliquant et un verre de lait. Prenons deux minutes ou alors casser ici. Et si vous pouvez rester dans les parages, Venons en arrière, regarder un peu plus à SQL, et puis un peu de JavaScript avec p-ensemble de huit à l'esprit. 

Très bien. Donc, nous allons vous faire réfléchir sur un cas d'angle qui peut très facilement se produire dans le cadre de l'utilisation d'une base de données, ou franchement, même en utilisant des choses du monde réel comme les guichets automatiques pour obtenir de l'argent. Alors, voici un réfrigérateur. Supposons que vous avez un trop dans votre dortoir ou votre maison. Et vous avez un colocataire, et les deux vous aimez vraiment le lait par exemple. 

Alors, vous rentrez chez vous classe un jour. Il ou elle n'est pas encore de retour. Vous ouvrez le frigo. Vous voulez vraiment un grand verre de lait. Il n'ya pas de lait. Alors, que faites-vous? Vous fermez le réfrigérateur. Vous prenez vos clés. Vous sortez de la place. Et vous obtenez en ligne à CVS à ceux auto choses de caisse, qui a toujours prendre plus de temps que réellement ayant caissiers. Quoi qu'il en soit. 

Alors, en attendant, dot dot dot, votre colocataire vient à la maison et il ou elle a même un penchant pour du lait. Alors, il ou elle ouvre le frigo, regarde à l'intérieur, et oh, zut. Pas de lait. Alors, il ou elle se dirige, qui arrive à aller aux autres CVS, qui n'était qu'une pâté de maisons pour quelque raison, et il elle se fait la queue pour acheter du lait. 

Pendant ce temps, vous rentrez chez vous, il ou elle rentre à la maison, et qu'est-ce que vous avez finalement? Deux fois plus de lait beaucoup. Mais vous n'aimez pas vraiment lait tant que ça. Alors maintenant, vous avez tellement de lait que maintenant l'un d'eux va juste aller aigre finalement. Donc, c'est vraiment un mauvais problème. Droite? 

Alors, que s'est-il passé? Donc, fondamentalement, c'est un peu d'un exemple ridicule. Mais sous le capot, ce que nous avons eu se passer ici est à la fois de vous vérifié l'état de certaines pièces de la mémoire, le réfrigérateur. Tous les deux vous vérifié l'état d'une variable. Vous avez tous deux tiré une conclusion que vous avez ensuite donné suite. Mais malheureusement, alors que votre colocataire était au magasin, l'état de cette variables changé, il ou elle est revenue et veut maintenant changer l'état, mais il a déjà été changé sur lui. Et bien sûr, il ou elle n'aurait pas allé au magasin s'ils savaient que vous étiez déjà en route. 

Ainsi, dans le monde réel, comment pourriez-vous éviter ce problème, en supposant que vous avez un réfrigérateur, vous disposez d'un colocataire, et vous avez réellement comme le lait? 

AUDIENCE: Communiquer. 

DAVID Malan: Communiquer. OK. Mais comment pourriez-vous communiquer? 

PUBLIC: Laissez une note. 

DAVID Malan: Laissez une note, non? Toujours laisser une note, pour fans de la série. Tout droit, laissez donc toujours une note, ou mettre vraiment comme un cadenas ou quelque chose sur le réfrigérateur qui garde votre colocation d'inspecter l'état de cette variable. 

Maintenant, pourquoi cela pourrait-il être germane à problème réglé sept, ou aux guichets automatiques. Eh bien, imaginez un monde dans un guichet automatique où vous pourriez être en mesure d'aller à un guichet automatique la machine ici, et un autre ATM ici. Et cela arrive assez souvent. Et supposons que vous ayez deux cartes ATM, ce qui est possible à obtenir. Et vous vous connectez à deux machines efficacement simultanément, nous l'espérons alors que personne ne regarde. Et puis vous tapez votre code PIN à peu près en même temps. Et puis vous faites une requête de l'équilibre pour voir combien d'argent vous avez. Et disons que vous avez 100 $ laissé dans votre compte. Donc, essentiellement, en même temps, vous dire un, zéro, zéro, entrez. Et vous obtenez espérons un peu d'argent. 

Mais combien d'argent pouvez-vous revenir? Maintenant ordinateurs à la fin de la journée, surtout si ils parlent de serveurs, ne font pas nécessairement les choses dans l'ordre que l'on attend. 

Supposons donc ce qui se passe, en raison de quelles que soient les problèmes là réseau de vitesse sont, ou des problèmes de CPU il ya, ou quelque chose comme ça, supposons que le première ATM vérifie votre équilibre et voit, oh, cette personne a 100 $. Mais obtient alors distrait car peut-être une sauvegarde est en cours et il est donc ralentissement. Ou peut-être lors de la vérification, le réseau connexion a obtenu un peu plus lent, car cela se produit juste. Ils sont des dispositifs physiques. Donc, en attendant, la seconde ATM est poser la même question. Combien d'argent David ont? $ 100 est la réponse. Mais parce que le premier ATM n'a pas encore a envoyé le message soustraire de 100 $, à la fois Distributeurs automatiques de billets ont inspecté la voûte de la banque, voir il ya $ 100 là, et maintenant les deux machines sont potentiellement va cracher une réponse. 

Maintenant, ce qui est excellent pour vous dans un certain sens si ce que la banque fait en fin de compte est de changer le montant à moins de 100 par définissant la variable égal à votre compte bancaire égal à 0, par opposition à faire moins 100. Or, dans le pire des cas pour la banque - ou dans le meilleur pour la banque, quant à lui, ils vous donnent 200 $ et votre compte bancaire montre maintenant négatif De 100 $, ce qui n'est pas vraiment vous bénéficier à tous. Mais le fait est que cette course condition pour obtenir deux colocataires lait, ou pour deux distributeurs automatiques de billets qui tentent d'obtenir des liquidités et changer l'état d'une voûte en même temps, il existe toute fois que vous avez une base de données. 

Maintenant en problème posé sept, cette question se pose dans le sens que si vous achetez un part des actions Facebook, puis pour exemple, vous achetez une deuxième quote-part de Facebook stock, vous devez faire une décision quant au programmeur. Afin de décider de la façon de mettre à jour le base de données, les chances sont que vous allez à avoir une ligne pour ce stock, et ce est une façon de mettre en œuvre. Et vous allez avoir une action de FB, qui est leur symbole boursier pour ce nom d'utilisateur, ou cet utilisateur ID, l'identifiant unique. 

Mais la même histoire peut arriver ici. Si vous faites un SELECT SQL, comme vous le verrez problème posé dans sept quand vous voyez, oh, David a un part des actions Facebook. Permettez-moi maintenant changer cela pour deux actions parce qu'il veut acheter une deuxième quote-part. Mais supposons que David avait fait deux les fenêtres de navigateur ouvertes, ou supposent que c'est un compte conjoint avec deux conjoints, et deux d'entre eux tentent d'effectuer la même opération, là aussi, l' Il existe un potentiel pour une décision d'être faite sur la base de la précédente état du monde - le compte a une action - et deux personnes, ou deux serveurs, l'entreprise essayer de dire incrémenter deux actions. Mais dans ce cas, vous pourriez avoir chargé moi de l'argent pour les actions, mais incrémenté juste qu'une fois. 

Donc en bref, le problème fondamental ici, comme dans la blague de laisser un noter, ou de mettre un cadenas sur elle, est si deux personnes, ou deux fils - penser à zéro - peut vérifier l'état d'une variable et puis essayez de modifier cette variable, mais ces deux choses ne se produisent pas à l' en même temps, mais peut être interrompue par d'autres choses qui se passent, les données peuvent entrer dans un état très bizarre. Et vous pouvez bénéficier ou vous pouvez souffrir dans le sens de l'exemple de l'argent. 

Donc problème posé sept, nous vous donnons cette seule ligne de code, qui a longtemps Bref, résout ce problème dans MySQL. Cette instruction très long qui ne fait pas même tenir sur une seule ligne sur le écran ici garantit que votre opération est ce qu'on appelle atomique. Tout se passe à la fois, ou il ne se passe pas du tout. Cette très longue phrase ne peut pas se interrompu partiellement. 

Et ce qu'il fait est littéralement ce qu'il dit. Insérer dans un certain tableau qui suit trois domaines ces valeurs spécifiques, mais sur une clé en double, ne pas faire un insert. Faire une mise à jour. Donc, c'est comme faire un SELECT et une INSCRIRE pour ainsi dire en même temps. Et quelle est la clé qui est probablement étant appelées ici? 

Il s'avère, et vous verrez ce dans problème réglé de sept spec, parce nous y avons déclaré être une clé unique sur cette table, tels que vous ne pouvez pas avoir plusieurs lignes pour le même utilisateur avec le penny même symbole boursier - Dans cet exemple, ici, est DVN.V un penny stock idiot que nous reportez-vous à la spécification. Parce que nous avons déclaré qu'il est unique, ce que cela signifie, c'est que si vous essayez d'insérer une ligne double, vous êtes au lieu d'aller le mettre à jour sans toute autre personne ayant une chance de changer l'état du monde non plus. Donc en bref, ce qui assure les choses sont atomiques. 

Plus généralement cependant, les bases de données comme MySQL - et vous n'avez pas besoin de cette fonction pour p-ensemble de sept, mais garder à l'esprit pour l'avenir - soutenir ce qu'on appelle des transactions, où vous pouvez dire START TRANSACTION littéralement. Vous pouvez ensuite exécuter deux instructions SQL. Et une instruction SQL, comme vous le verrez en p-set sept, semble un peu quelque chose comme ça. Mettre à jour une table appelée compte. Régler la colonne de solde correspondant à ce que la colonne du solde actuellement est moins 1000, où le nombre est élevé, numéro de compte, comme l'identificateur d'utilisateur, est égal à 2, et ensuite mettre à jour compte Dot Dot Dot. 

Donc, en termes simples, ce que ne ces deux requêtes semblent faire dans le réel sens de monde de la banque? 

PUBLIC: Transfert à l'épargne. 

DAVID Malan: Exactement. Transfert de fonds d'un rendre compte à l'autre. Et ceci est un autre exemple où vous veulent vraiment ces deux choses se produisent ou ne se produira pas. Vous ne voulez pas quelque chose à mettre dans l' milieu d'eux et potentiellement gâcher le calcul, ou gâcher combien l'argent que vous avez, ou combien argent que la banque a. Donc ce qui est vraiment agréable sur les transactions MySQL est que, et bases de données, plus généralement, est qu'ils et des gens intelligents qui ont mis en œuvre ces caractéristiques à comprendre comment faire vous que ces deux choses se produisent ou pas du tout. 

Et si vous êtes vraiment aspirer à faire un site web qui est utilisé par les gens sur campus, les gens dans le monde réel, en faisant quelque chose dans le sens de démarrage, ce sont les types de décisions de conception qui devenir de plus si important. Sinon, vous commencez à perdre des données, perdre les utilisateurs, ou dans le pire des cas en tant que nous avons vu ici, potentiellement perdre de l'argent. Encore une fois, plus que dans problème posé sept, ainsi que peut-être pour certains d' vous dans des projets définitifs. 

Donc, nous allons changer cette image que nous avions il ya un moment juste une façon de plus. Permettez-moi donc effectivement voir si je peux - nope, qui a disparu. Il est là. 

C'est donc là que nous avons quitté la dernière fois. Et il s'avère que nous allons lancer une chose de plus dans le mélange ici - un langage appelé JavaScript. Donc JavaScript correspond effectivement dans cette pièce - et je n'ai pas très bien laisse assez de place, si ce n'est pas maintenant à l'échelle. OK, c'est vraiment pathétique. OK, donc c'est JavaScript. Très bien. Je suis vraiment faire un mauvais service. Très bien. 

Donc, JavaScript est un autre programmation langue, et notre dernière, Si cela aide rassurer qu'il n'y a pas beaucoup plus des bouches d'incendie ici. Donc JavaScript est également une interprétation langue, ce qui signifie que vous n'avez pas compiler dans zéros et de uns. Vous venez de l'exécuter. Mais ce qui est fondamentalement différent de JavaScript est généralement que vous ne pas l'exécuter sur votre serveur web. Il n'obtient pas exécuté dans le appareil en soi. Au contraire, il est téléchargé par un utilisateur via HTTP dans leur navigateur - Chrome, Safari, Internet Explorer, Firefox, quelle que soit - et c'est le navigateur qui exécute cette notamment langage de programmation. 

Donc, pour être clair, PHP a été jusqu'ici exécuté soit à la ligne de commande dans notre fenêtre en noir et blanc, sur un serveur comme l'appareil, un ordinateur certainement l'appareil, ou il a été exécuté par un serveur Web fonctionnant sur un ordinateur. Mais le thème ici est que PHP jusqu'ici a été exécuté du côté serveur, de sorte que l'utilisateur et le navigateur de l'utilisateur ne voit jamais une ligne de code PHP. 

En fait, si jamais vous ouvrez un navigateur pour votre site Web ou d'une autre et vous réellement voir le code PHP dans votre fenêtre, quelqu'un a foiré. Parce qu'il n'est pas censé être envoyé directement à un navigateur. Il est censé être exécuté et transformé en quelque chose comme HTML. 

Mais JavaScript est essentiellement le contraire. Il est destiné à être exécuté généralement à l'intérieur de la fenêtre du navigateur d'un utilisateur. Et quels types de sites Web utiliser JavaScript puis ces jours? 

Comme littéralement chaque site Web populaire. Chaque site que vous les gars probablement utiliser quotidiennement utiliser JavaScript pour la le plus simple et le même caractéristiques les plus sexy. 

Donc, quelque chose comme Facebook Discuter si vous l'utiliser. Comment cela fonctionne? Eh bien ce jour, toutes les choses que nous avons fait avec HTML et PHP suppose que vous tirez une URL, et vous appuyez sur Entrée, et vous voyez une partie du contenu HTML. Et vous cliquez sur le lien, qui modifie la URL, modifie la page, et recharge un nouveau contenu. Cliquez sur une autre URL ou soumettre un formulaire, vous se emmené vers une autre page et vous voyez un nouveau contenu. 

Mais en utilisant quelque chose comme Facebook Chat, ou Gchat ou Google Maps, rarement ne toute la page rafraîchir tels que vous voyez un écran blanc et puis de nouveau contenu. Au contraire, les pages Web d'aujourd'hui sont dynamiquement se mis à jour à nouveau et encore et encore toutes sortes de derrière les coulisses. Et il s'avère que lorsque vous allez à quelque chose comme Facebook, ou Gchat, ou Gmail, et les mises à jour de page automatiquement sans recharger la tout l'écran, ce qui s'est passé, c'est que votre navigateur a fait sorte de secret requêtes HTTP supplémentaires - pas pour les pages Web en entier, mais seulement pour de petits morceaux de données, comme le message instantané que votre ami vient de vous, ou la mise à jour d'état envoyé que quelqu'un vient de vous, ou le tweet envoyé que quelqu'un vient d'envoyer. C'est juste faire de petites demandes pour des données, et en utilisant ensuite le JavaScript ce langage de programmation, pour modifier ce que la page Web ressemble sans l' serveur aidant, sans que le serveur générer que HTML. 

Donc en bref, JavaScript peut être utilisé, non seulement chercher de nouvelles données de le serveur sans recharger l'ensemble page ou soumettre un formulaire. Il peut également être utilisé pour changer DOM soi-disant - modèle objet de document - qui est juste la manière de fantaisie pour dire l'arbre de HTML que nous avons vu la dernière fois. 

Donc, pour rassurer, Javascript syntaxiquement si semblable à C ainsi. Il n'y a pas la fonction principale. Vous venez de commencer à écrire le code et elle sera exécutée, ou interprété plus correctement. Conditions ressemblera à ceci. Pas différent de C ou PHP pour cette question. Expressions booléennes ou-ed ensemble ressemblera à ceci. Anded ensemble ressembler à ceci. 

Commutateurs ressemblera à ceci. Pour les boucles seront ressembler à ceci. Alors que les boucles seront ressembler à ceci. Faire des boucles while ressemblera à ceci. 

C'est nouveau. Donc JavaScript a pas un foreach construire en soi, mais cette construction pour la variable i dans le tableau, et je dans ce cas devient une valeur d'index. Il est donc un peu différente de celle foreach, si de nouvelles versions de JavaScript sortent tout le temps, de sorte que même ces caractéristiques linguistiques sont en constante évolution. 

Et en passant, ces JavaScript jours peut également être utilisé sur un serveur comme PHP en utilisant un cadre appelé Node.js. Un des CS50 de FO, Kevin, a entraîné une séminaire sur Node.js qui est disponible à cs50.net/seminars. Donc, si vous êtes curieux, sachez que vous peut l'utiliser sur le côté serveur bien, mais c'est une tendance assez récente, mais une puissante à cela. 

C'est un peu différent. C'est un tableau en JavaScript. Et ce qui frappe aussi différents par rapport à C ou PHP? Il ya quelques histoires rapides nous pouvons dire ici. Ce qui manque par rapport à PHP? 

PUBLIC: [inaudible]. 

DAVID Malan: Oui? Désolé, dire encore? 

PUBLIC: Ne pas déclarer le type de variable. 

DAVID Malan: Nous ne sommes pas déclarer le type de variable. Donc en fait tout à fait comme PHP, nous ne sommes pas spécifiant les types de cette variable. Au contraire, nous sommes plus générique var dire pour la variable. Nous n'avons pas de nuisance de PHP de l' signe du dollar, qui, tout fastidieux de le type, ne fait plus clair que quelque chose est une variable. Alors qu'ici, nous sommes en quelque sorte de retour à L'approche de C simplement en l'appelant une variables par le nom que nous voulons de lui donner, comme les numéros. Et aussi comme PHP, nous avons crochets pour la valeurs à l'intérieur de ce tableau. 

Donc variables JavaScript aussi pourrait ressembler à ceci. Notez ici c'est une chaîne appelée s, mais avons-nous pas de même précisé que c'est une chaîne. Voici bien une fonction qui n'est pas exister exactement de la même manière en PHP, mais un peu similaire. Il s'agit d'un objet en JavaScript. Et les objets sont en quelque sorte de l'armée suisse Couteau d'une structure de données en ce qu 'on peuvent les utiliser pour un certain nombre de choses. 

Voici, par exemple, nous déclarant une variable appelée citation. Le type de cette variable est un objet. Vous pouvez penser à cela comme une structure C qui a les clés et les valeurs. Symbole est une clé. FB est une valeur apparemment un symbole boursier. Virgule. Le prix est une autre clé, et sa valeur est apparemment une virgule flottante, ou un nombre plus généralement dans JavaScript de $ 49,26. 

Alors PHP n'a pas - nous n'avons pas vu dans les objets PHP assez comme ça, mais nous n'avons analogique, qui est ce? 

PUBLIC: [inaudible]. 

DAVID Malan: tableaux associatifs. Ainsi, alors que PHP a tableaux associatifs dont la syntaxe est toujours légèrement pour différent - nous avons vu les crochets. Nous avons vu les flèches étranges symboles. JavaScript a des objets, mais ce n'est surtout une différence sémantique et un synonyme différente pour le moment. Toutefois, en aparté, PHP a également des objets de manière à Java et d'autres langues ont des objets dans la programmation orientée objet. Mais nous les utilisons seulement pour les types de données pour le moment. Objets et les tableaux associatifs. 

Celui-ci pourrait faire un peu plus clair. Voici pourquoi un objet est utile. Lorsque vous voulez déclarer un étudiant, comme Zamyla, nous pouvons effectivement encapsuler pour ainsi dire à l'intérieur de ce objet en utilisant des accolades comme avant tout un trousseau de clés et valeurs ici. Nous avons une identité, une maison, et un nom pour Zamyla, suivi d'un point-virgule comme d'habitude à la fin. 

Ici aussi, ce qui est légèrement différente, mais aussi très puissant ces jours-ci. Voici un tableau, et je sais que parce il ya un crochet jusqu'à haut et un crochet en bas. Et c'est un tableau de données que tapez apparemment en JavaScript? C'est un tableau de il semble comme trois objets. Et je sais que c'est un objet que en raison des accolades. Et remarquez qu'il ya ouvert accolade, des trucs, accolade près, virgule, puis un peu plus, une virgule, et puis un peu plus. Voilà donc trois arguments séparés par deux virgules. 

Donc, c'est un tableau de trois les objets. Et chacun de ces objets semble un étudiant ou membre du personnel de certains sorte, chacun avec une pièce d'identité, maison, et le nom. Mais je l'ai appelé ce quelque chose appelé JSON - JavaScript Object Notation. Et il s'agit d'un format de données qui fait est donc très populaire et en vogue ces jours-ci que si vous écrivez un application qui utilise le Facebook API, l'API de Twitter, vraiment presque une API là-bas ces jours, y compris certains des propres de CS50, le données que vous obtenez en retour n'est pas dans ancien format CSV scolaire. 

Parce que le rappel que CSV est super simple. Il est à seulement colonnes séparées par des virgules. Données JSON vous donne plus de métadonnées. Il associe une clé à chaque valeur ainsi ils ne doivent pas simplement supposer que la colonne de zéro est une valeur, colonne on est une autre, la deuxième colonne est une autre. Tout dans un objet JSON ici est une sorte des auto-description, parce que chaque l'un des noms dans ce fichier a littéralement nom en face de lui comme un chaîne entre guillemets. 

Donc, nous allons jeter un oeil à un quelques exemples ici. Permettez-moi d'entrer dans l'appareil. Et laissez-moi aller dans notre vhost répertoire en public. Et laissez-moi aller dans la JavaScript répertoire. Et nous allons aller de l'avant et d'ouvrir dom-0.html, où DOM signifie simplement modèle d'objet de document. C'est la substance de l'arbre à laquelle J'ai parlé plus tôt. 

Et permettez-moi de proposer ce qui suit. Voici une page Web dont l' corps est assez simple. Donc, ici en bas, remarquerez J'ai un formulaire. Nous avons vu ceux d'avant. Il comporte deux entrées, dont l'une a un Identification de nom, dont l'un a un type de soumettre, et le premier son type est texte. Donc, cela semble en fait assez simple. 

Allons ici. Revenons à cette page ici. Allons dans localhost, et aller dans notre répertoire JavaScript, et aller à dom-0, et nous avons ici ce formulaire. C'est donc apparemment tous cette page fait. Il dispose d'un champ de nom avec un bouton Envoyer. Mais je ne vais pas utiliser PHP ici. Je vais faire tout côté client pour ainsi dire en JavaScript comme suit. 

Remarquez que je n'ai en effet donné le nom champ de cette entrée un cadre unique identifiant, qui sera effectivement me faire gagner du temps dans un moment. Et notez que je n'ai présenté une autre balise dans la tête de ma page web, l'  tag. 

C'est donc dans ce sens que JavaScript est un langage de programmation côté client. Dans ce cas, comme CSS, j'ai mis il directement à l'intérieur de mon HTML. Mais remarquez j'ai déclaré une fonction qui ressemble un peu à PHP syntaxiquement, mais il s'agit en fait JavaScript, car encore une fois, c'est côté client dans le navigateur. Et faire une supposition que cela va faire, même si une partie de la syntaxe ici est nouveau. 

PUBLIC: Dites bonjour à quiconque. 

DAVID Malan: Il va dire bonjour à quiconque visite cette page. Alors, comment? 

Donc remarqué, il s'avère en JavaScript il ya une fonction () alerte. C'est une fonction très sorte de triste vraiment tendance juste pour embêter les utilisateurs. Ce n'est pas celui que vous devriez vraiment utiliser généralement, mais c'est un rapide et sale manière de sorte d'impression quelque chose d'une interface utilisateur graphique l'interface, comme un navigateur. Remarquez ici que j'ai un chaîne à guillemets simples. Il s'avère que, contrairement à C, JavaScript peut effectivement vous faire usage unique cite, et franchement c'est juste genre de la convention stylistique entre JavaScript programmeurs à utiliser des guillemets simples. PHP, elles ont en fait légèrement sens différent. Mais pour l'instant, il suffit de savoir que C'est la seule raison. La convention en JavaScript est souvent utiliser des guillemets simples, mais nous pourrions utiliser guillemets dans les deux endroits. 

Donc ce qui est intéressant. Rappelons dernière fois que nous avons eu cette image sur l'écran qui a attiré un arbre où vous aviez le nœud HTML, et la la tête de noeud, et le noeud de corps, et puis un peu de texte. Mais il y avait un noeud spécial à la très haut que j'ai appelé le document. Eh bien, il s'avère en JavaScript, tout fois que vous écrivez un programme en JavaScript dans un navigateur, vous avez accès à une variable globale spéciale. Dans le même esprit pour les superglobals de PHP, celui-ci est appelé à tous les documents minuscules. 

C'est comme une structure, mais cette structure a également des fonctions à l'intérieur de celui-ci. Ainsi, une structure C vient typiquement des données. Mais un objet JavaScript que ce est techniquement aussi a des fonctions, autrement connu comme méthodes, à l'intérieur de celui-ci. Et vous pouvez appeler une fonction à l'intérieur de cet objet littéralement faire son nom, point, puis le nom de la fonction, ou encore la méthode. C'est juste un synonyme, vraiment. 

Et qu'est-ce que cette fonction fait? Vous pouvez sorte de deviner à partir de son nom. Obtenez élément par ID. Donc, cela va chercher la page Web, chercher cet arbre, à la recherche de tout ce noeud, élément Alias, a une ID unique de devis nom unquote. Et puis ce que je vais faire? Je vais obtenir la valeur à l'intérieur de ce nœud dans l'arbre, et je vais à-dire en quelque sorte bonjour à ce nom. 

Alors, prenez une supposition, même si nous n'avons pas encore vu cela, qu'est-ce que le signe plus symboles signifient ici et là sans doute? 

AUDIENCE: Concatenate. 

DAVID MALAN: Concatenate. Droit, et ce ne sont que sorte de décisions de conception personnes ont fait il ya des années. En PHP, vous concaténer choses avec des points. En C, vous sautez à travers plusieurs cerceaux et appeler des fonctions comme StrCopy () ou strcat () ou d'autres fonctions. Mais en JavaScript, vous utilisez des atouts. Donc, c'est juste concaténer trois cordes - bonjour, un nom, puis un point d'exclamation. 

Alors, quand et pourquoi cette fonction appelle cependant? Eh bien, prenez une estimation de la HTML en bas. Pourquoi est-il saluer () a appelé, ou quand? 

Apparemment, du mieux que je peux dire, sur soumettre, lorsque ce formulaire est soumis, Je vais faire tout ce qui est à l'intérieur de ces citations. Et précisément, je vais appeler saluer () et puis retourner faux. 

Eh bien, voyons ce que le net effet est ici en premier. Alors laissez-moi aller de l'avant et tape dans, disons, Loren, Soumettre. Bonjour Loren. Voyons voir si c'était peut-être juste une mise en œuvre de la chance. Nan. Donc, c'est taper quoi que nomme en fait je n'y mets. 

Mais remarquez ce qui ne change pas. L'URL est encore dom-0.html. Il n'y a pas register.php. Il n'ya pas de second fichier. Il n'y a pas d'attribut action. Alors, quelle est cette return false faisant sans doute? Pourquoi suis-je appelant saluer (), puis retournant false probablement? Qu'est-ce qui se passe normalement lorsque vous cliquez sur Envoyer un formulaire que même nous avons vu la semaine dernière? 

AUDIENCE: [inaudible]. 

DAVID MALAN: Il va quelque part, non? Il va vers une URL de destination. Mais je ne veux pas que cela se produise ici. Je veux que ma page Web pour être complètement dynamique comme Gmail, où une fois que vous êtes là-bas, vous y restez. L'URL ne change pas d'une manière qui indique la page entière est rechargement. Au contraire, je veux juste changer quelque chose comme l'impression de quelque chose ici à l'écran. 

Eh bien, permettez-moi de nettoyer ce un petit peu. Permettez-moi de m'ouvrir pas dom-0, mais permettez-moi de m'ouvrir dom-2. Juste pour que vous avez vu quelque syntaxe ici. 

Il s'avère que ce que nous venons DID est l'utilisation de JavaScript brut. Donc, c'est vraiment la langue JavaScript. Certains d'entre vous connaissent peut-être une bibliothèque appelée jQuery. 

Alors jQuery n'est pas la même chose comme JavaScript. C'est juste une bibliothèque qui a vraiment intelligent Guy a écrit et popularisé par exemple que presque tout le monde dans le monde aujourd'hui utilise jQuery pour l'utilisation de JavaScript. Et à première vue, honnêtement, il regarde un peu plus cryptique. Mais vous verrez, surtout si vous allez là pour votre projet final avec le web développement, vous verrez que cette nettoie les choses et vous fait gagner assez quelques lignes de code. 

Donc, nous allons juste jeter un regard sur la façon dont Ce formulaire fonctionne. Avis qu'ai-je supprimer apparemment de mon HTML? Il n'y a pas de présenter gestionnaire pour ainsi dire. Il ya aucun attribut. Parce que vous savez, ce Je n'ai pas vraiment aimé? Je me sentais comme si nous tombions dans les vieilles habitudes là-bas. Tout comme il commençait à se sentir négligée se mêler à la fois avec CSS HTML, parce que vous êtes un peu jeter différentes langues partout dans le place, de même at-il commencé à se sentir comme une mauvaise route pour aller vers le bas où Je suis en train de code JavaScript à l'intérieur de mon HTML plutôt que l'affacturage it out. 

Donc, c'est la leçon à retenir ici. Dans dom-2.html, je suis affacturage it out. Et je fais les choses un peu différemment. Pour l'instant, je vais saluer mes mains à ce que cela fait vraiment sous la hotte. Mais juste pour l'instant supposer que cette première ligne de code dans cette bibliothèque disant jQuery signifie simplement lorsque l' document est prêt, procédez comme suit. 

Parce que les pages Web peuvent prendre un peu de temps à charger. Vous pourriez être sur une lente internet connexion, et il pourrait être en train de tourner et la filature, et finalement il est chargé. Cette ligne de code dit juste attendre la page entière est prêt, le document est prête, avant d'exécuter ce code. 

Et maintenant, avis, c'est probablement le premier le plus utile emporter de jQuery. Cette ligne est très semblable dans l'esprit à cette plus longue ligne ici. Alors que dans le code JavaScript brut, il il existe un objet global de document qui a une fonction appelée getElementById (), les gens qui ont écrit jQuery simplifié que de dire simplement signe du dollar, puis à l'intérieur de parenthèses mis deux citations, puis mettre un dièse suivi par le ID unique que vous souhaitez récupérer. Donc, ce qui équivaut à document.getElementById. 

Pendant ce temps,. Submit signifie simplement sur soumission de la forme que vous êtes référant à gauche, aller avant et exécuter ce. Mais c'est maintenant la curiosité aussi. Ce qui est bizarre sur ce J'ai souligné ici? Non seulement il est genre de syntaxe nouveau, il ya aussi quelque chose qui manque. 

PUBLIC: Il vient d'appeler la fonction? Il ne s'appelle pas alerter? 

DAVID MALAN: Ouais. Eh bien, si alert () est en baisse ici, pour être juste. Mais il n'est pas fait mention d'un nom, comme vous le savez, foo ou quelque chose ici. Et en effet, c'est l'une des caractéristiques de JavaScript qui est tout à fait puissant, mais aussi tout à fait nouveau. Et PHP a fait cela aussi. 

Permettez-moi d'aller de l'avant et de faire quelque chose de réel rapide. Permettez-moi d'aller de l'avant et de mettre ceci ici. Permettez-moi de faire ça. Fonction. Appelons ce gestionnaire (). Une fonction de gestionnaire pour ainsi dire. Quelque chose qui gère une opération. Permettez-moi de nettoyer mon empreinte. Et de mettre cela ici. Et mettre ici. Yep. OK. 

Alors maintenant, j'ai une fonction appelée gestionnaire () que je ne sais pas vraiment ce qu'il fait encore. Il a juste encore ce genre de choses. Oups. Pris trop. Faisons-le. Très bien. Désolé. Très bien. Permettez-moi de le faire. OK. Cela semble bien droit transmettre maintenant. Permettez-moi de le faire. Faire. Et OK. Alors maintenant, nous allons mettre ceci ici. Pas plus de programmation à la volée. OK. 

Alors maintenant, revenons à où l'histoire a commencé. Auparavant, j'ai dit que cette ligne ici signifie que lorsque le document est prêt, aller l'avant et le faire. Qu'est-ce que je veux faire? Eh bien précisément, je veux aller de l'avant et faire ce qui suit. Exécuter cette ligne de code, puis ce que je veux que vous fassiez est d'appeler ce fonction lorsque le formulaire est soumis. 

Maintenant, c'est ce qui est intéressant. Ce n'est pas en soi une fonction. Remarquez que je ne mets pas entre parenthèses ici de la manière normale. Je suis littéralement passer une fonction appelée gestionnaire () à une autre fonction appelé submit () comme argument que si c'est comme une variable. Et c'est l'une des caractéristiques de JavaScript est fonctions se sont vraiment juste des objets. En fait, ils sont vraiment juste variables d'une sorte. Et si le nom de la fonction est gestionnaire (), il n'y a aucune raison pour laquelle je ne peux pas passer en argument ici. Et cela signifie quand la forme avec l'ID de démonstration est soumis, appeler cette fonction. 

Mais maintenant, si je défais tout cela, pourquoi donc ai-je peut-être faire il ya ce moment? Eh bien, c'est une fonction anonyme. Parce que franchement, j'ai compris pourquoi suis-je la peine de perdre du temps en déclarant un fonction appelée gestionnaire () que d'appeler dans un seul et même endroit? Si je n'ai pas besoin de nom, et je ne sais pas besoin de l'appeler plus d'un endroit, disons simplement mettre en œuvre la fonction là où j'en ai besoin. Et si JavaScript et PHP soutiennent ce sont appelés fonctions anonymes Permettez-moi de faire exactement cela ici. 

Mais nous ne faisons que gratter la surface. Allons taquiner avec juste un couple derniers exemples ici. 

Si je vais dans quote.php. Notez que ceci est en fait un PHP fonction, un programme PHP, que j'ai écrit qui attend un paramètre HTTP appelé symbole, et je peux passer en une valeur comme FB. Et si nous regardons effectivement à la source code, ce interroge un site Web gratuit appelé Yahoo Finance, comme p-ensemble sept, et il est de retour à moi quelque chose dans l'apparence format connu est JSON - JavaScript Object Notation. C'est juste un objet. Remarquez les accolades, les citations, le côlon, et les virgules. 

Maintenant quant à lui, c'est plutôt cool. Parce que je peux probablement utiliser une programmation langue pour générer des URL qui ressemblent à ce dynamique, droit? Je peux changer ce à Google et revenir de Google prix de l'action de 1,017.55 $. Donc, nous allons voir si nous ne pouvons pas utiliser maintenant. 

Permettez-moi de passer à ajax-0 ici, qui ressemble à la suivante. C'est juste un site qui a un formulaire avec un bouton. Permettez-moi ici d'aller de l'avant et tape dans YHOO pour le symbole boursier de Yahoo, cliquez sur Obtenir Citation, et remarque maintenant que j'ai obtenu une alerte à 32.86. 

Permettez-moi de réellement aller vers une version amateur de cette page, la version deux, et entrez dans disons Microsoft, MSFT. Obtenez un devis. Et maintenant le constater, pas d'alerte. Remarquez où il est dit prix à déterminer? Il est le plus simple des exemples qui allusion à ce Gchat et Facebook Chat, Gmail, et d'autres comme sites font en fait modification de la page Web. 

Notez ce. Permettez-moi de recharger la page. Permettez-moi de m'ouvrir inspecteur de Chrome. Permettez-moi de passer aux éléments languette vers le bas ici. Maintenant, remarquez si je zoome ici et ouvrir cette place, notez que ceci est mon DOM HTML - mon document modèle objet. C'est mon HTML. Mais maintenant, remarquez, même si ça va d'être un peu difficile de le voir à la fois endroits à la fois, si je tape dans FB ici, regarder en bas de l'écran seulement. 

Il s'agit en fait de changer ma HTML à la volée. Et il fait cela tout simplement en faisant quelque chose comme ça. Si j'ouvre ajax-2, la mise en œuvre avis quelque chose d'aussi sexy que que, même si c'est assez laid, mais aussi sophistiqué que celui fonctionnellement, il a une certaine HTML sur le fond. Mais notez que je l'habitude de marquer. Nous n'avons pas utilisé cette avant, mais ce n'est comme un, mais il ne force pas tout sur une nouvelle ligne. C'est tout simplement une zone rectangulaire sur la même ligne essentiellement. 

Remarquez que je lui ai donné un ID de prix. Et il se trouve à l'aide de la même Bibliothèque JavaScript, J'ai une fonction appelée quote () qui est appelée à chaque fois le formulaire est soumis. Et ce que je fais est la suivante. Je déclarer une variable en JavaScript appelée URL, enregistrement de la valeur quote.php? symbole =. En d'autres termes, je suis moi-même commence à préparer une requête HTTP, et ensuite Je concaténation sur qu'avec un plus quel que soit l'élément avec l'ID de symbole est, qui avis est que champ de texte de droite ici. Ainsi, tout comme nous avions formes dans le passé. 

Et puis il s'avère en jQuery, si vous appel. val (), qui appelle d'un val fonction, une fonction de valeur, qui devient ce que l'utilisateur a tapé: Et puis tout le trafic réseau ce qui se passe est la suivante. $. GetJSON. 

Et en passant, signe de dollar est juste une notation abrégée. C'est vraiment jQuery.getJSON. Obtenez-moi de JSON de cette URL, et quand la demande revient, appelez cette fonction et passer en tant qu'argument quelle que soit venu à partir du serveur. 

En d'autres termes, si je reviens à la navigateur, et je reviens à quote.php, ce que mon navigateur est en train de faire est d'obtenir ce bloc de données. Et quand je vais vers cette page web ici, remarquer si nous allons à la place sur le réseau onglet et l'effacer, puis tapez quelque chose comme GOOG pour Google et obtenir Citation, notez la page n'a pas changé. Mais une requête HTTP a été faite, et ce que revint ici si nous regardons l' réponse est tout un tas de JSON que nous avons accédé finalement avec cette simple ligne ici. 

Données est ce qui a été obtenu à partir du serveur. Le prix est le nom de la clé je me soucie. Donc data.price me donne cela. 

Maintenant quant à lui, et ce est le dernier exemple. Vous pouvez faire encore plus à la page. Un fait, bien deux. Nous pouvons ramener l' marquer, si vous vous rappelez ce. C'est JavaScript. Nous pouvons le faire. Très excitant. Nous allons laisser cela comme un cliffhanger. 

Mais plus excitante, vous pouvez faire des choses comme ça. Si je vais à la géolocalisation-1, il s'avère que Chrome sait que nous sommes à longitude latitude 42.37. -71,10. Donc, il ya encore plus, il à votre disposition. Mais plus que la semaine prochaine. Rendez-vous lundi.