HANNAH BLUMBERG: Salut tout le monde. Nous allons commencer juste un couple de minutes d'avance puisque nous avons un tas de matériel pour passer à travers. Je suis Hannah. Je suis un TF. Maria va rejoindre nous en seulement quelques minutes. Elle enseigne la section droite avant. Je enseigne section de droite après, nous allons donc de le tenir à l'heure et demie. Donc, comme vous le verrez ici, nous avons tout à fait quelques sujets que nous avons besoin de passer à travers, de sorte que nous allons aller un peu vite. Mais si à un moment nous disons quelque chose trop rapidement ou vous ne comprenez pas, se sentir libre d'interrompre avec des questions. Nous voulons être en mesure d'en faire une session d'examen aussi utile à vous tous que possible. Impressionnant. Donc, nous allons sauter à droite avec certains sujets qui nous fait très, très brièvement couvert pour la Quiz 0 dans la session d'examen quizz 0. Ainsi, à partir des listes liées. Il suffit donc de vous assurer que vous avez une certaine connaissances de base sur les listes chaînées et sont à l'aise certaines des opérations de base. Il suffit donc d'examiner, liée listes sont mieux que les tableaux parce qu'ils peuvent se développer dynamiquement. Donc nous avons cette énorme avantage. Nous les avons vus utilisés dans les tables de hachage lorsque nous Je ne sais pas exactement combien de choses que nous allons vouloir à insérer dans notre structure de données. Malheureusement, nous avons des morceaux de la liste chaînée partout dans la mémoire, de sorte que nous ne serons pas nécessairement capable de faire un accès en temps constant à tout élément dans la liste chaînée. Afin de trouver un élément particulier, nous avoir à parcourir toute la voie depuis le début. Donc, gardez à l'esprit que la plupart des opérations de base sont les oméga de 1. Donc insert va juste prendre 1. Supprimer va prendre car nous n avoir à aller le trouver dans la liste. Et la recherche pourrait prendre, au pire, n. Nous ne pouvons pas faire quelque chose comme recherche binaire sur une liste chaînée Puisque nous ne pouvons tout simplement sauter au hasard au milieu. Bien. Impressionnant. Un peu de piles. Ceci, à nouveau, est venu sur le quizz 0, de sorte que vous devrait être super à l'aise avec elle. Mais pour les piles, nous vous demandons à retenir une pile de plateaux. Et ça va être le premier entré, dernier sorti. Donc, nous nous classons les choses dans la pile, et ensuite si nous essayons de prendre quelque chose off-- que nous appelons sautaient l'stack-- nous viennent du haut. Et si nous voulons mettre quelque chose dans la pile, nous appelons cela de pousser. Donc, il va toujours être en grandissant à partir du bas, comme une pile de plateaux. Impressionnant. Nous avons mis en place des piles vus avec les deux listes chaînées et les tableaux. Si vous êtes à la mise en œuvre avec des tableaux, vous voulez faire en sorte de garder la trace de à la fois la taille et la capacité. Donc, la taille va être le courant nombre de choses dans votre pile, alors que la capacité est le nombre total des choses que vous pouvez stocker dans votre pile. Bien. Très similaire, nous avons des files d'attente. Dans ce cas, au lieu de penser une pile de plateaux, pensez à une ligne. Cela va être le premier entré, premier sorti. Donc, si vous la queue pour quelque chose à la boutique, nous espérons que la première personne dans ligne va être aidé en premier. Au lieu de dire poussée et pop comme nous le faisons pour la pile, nous disons simplement enqueue et dequeue. Et encore une fois, si vous êtes mise en œuvre de ce avec un tableau, nous avons besoin de garder une trace non seulement de la taille et la capacité, mais aussi la tête, ce qui va être l'avant de notre file d'attente. Bien. Vous avez des questions sur tout cela? Impressionnant. Déplacement à droite le long. OK, tables de hachage. Voici où il commence à devenir vraiment intéressant. Donc, une table de hachage est une mise en oeuvre d'un tableau associatif. Donc, fondamentalement, ce qui est arrivé est que nous avons tous cette entrée, et nous lui donnons à un hachage fonction qui dit, OK, cela est où dans le table de hachage des il appartient. Ainsi, la fonction la plus simple de hachage que nous avons vu est juste de dire, OK, supposons que nous voulons mettre cordes à notre table de hachage. Et une idée très simple pourrait être de dire, OK, disons simplement Trier par la première lettre du mot. Donc vous pouvez voir ici, nous prenons la banane, nous mettons à travers une fonction de hachage, et il dit, hey, ce devrait aller à l'index 1. Ainsi, nous pouvons penser essentiellement d'un hachage table comme un tas de différents seaux. Et chacun de ces seaux va pour maintenir la tête d'une liste chaînée. Et dans cette liste chaînée est où nous pouvons effectivement mis différents éléments de données. Donc la plongée un peu plus dans une fonction de hachage, voici l'exemple que je viens décrit où nous venons de dire, OK, prendre la première lettre de la parole et nous sommes aller faire le tri dans les seaux. Donc, vraisemblablement, il y aura 26 seaux, une pour chaque lettre de l'alphabet. Pourquoi est-ce pas une grande fonction de hachage? Ce qui rend cette non-idéal? Oui. AUDIENCE: Vous allez d'avoir des collisions. HANNAH BLUMBERG: Oui, exactement. Vous allez avoir des collisions. Voilà donc une chose. Et nous allons parler de la façon dont nous pouvons fixer les collisions dans une seconde. Un autre problème avec cette notamment fonction de hachage est que notre différente seaux vont être d'assez radicalement différentes tailles. Nous savons qu'il ya un tas plus de mots qui commencent par A à X, alors nous allons avoir de très seaux asymétriques dans notre table de hachage. Bien. Donc oui, revenons à le point de collisions. Que faisons-nous si il ya une collision? Nous avons un couple de différentes options. Donc un, donc supposons que nous essayons de mettre Berry dans notre table de hachage. Et nous voyons, oh, nous voulons de le mettre dans l'index 1, mais la banane vit déjà là. Qu'allons nous faire? Nous avons deux options principales. Le numéro un est que nous pouvons dire, OK, il n'y a pas de place dans l'index 1, mais gardons juste en regardant à travers jusqu'à ce que nous pouvons trouver un autre endroit ouvert. Donc, nous allons dire, OK, disons-le dans la tache 3. Voilà une option. Qui est appelé sondage linéaire. Et une deuxième option est dit, OK, bien, disons simplement faire de chacun de ces seaux être têtes de listes chaînées. Et il est OK si il ya plus d'une chose dans un seau. Nous allons juste annexer sur le devant. Donc, ici vous pouvez voir, OK, lorsque nous avons inséré des baies, nous juste pris la banane, sorte de poussé un peu plus et jeta une baie là. Et cela est également tout à fait bien. Ceci est appelé chaînage séparé. Vous pouvez penser à cela comme un peu comme une gamme de têtes de listes chaînées. Des questions sur hachage tables, fonctions de hachage? Impressionnant. Les arbres et les essais. Ainsi, un arbre est toute sorte de la structure de données dans lequel il ya une sorte de la hiérarchie ou une sorte de classement à vos différents objets. Et cela va devenir super clair quand nous voyons un exemple. Et nous avons vu essais, le long avec des tables de hachage, dans pset5-- qui, encore une fois, tout à fait juste jeu pour cette quiz-- comme une autre des données structures que nous pouvons stocker des choses différentes. Dans le cas d'un dictionnaire, nous avons stocké un tas de mots. Donc, nous allons jeter un oeil à quelques arbres. Ainsi, ceci est un exemple d'un arbre. Il a une sorte de structure, que structure hiérarchique, où vous pouvez voir que ce 1 nœud au sommet a une sorte de rang 2 et 3 ci-dessus, qui sont au-dessus de 4, 5, et 6 et 7, qui sont au-dessus 8 et 9. Voilà donc tout ce que nous entendons par un arbre, de sorte que vous peut juste genre de cette image dans votre tête. Maintenant, nous avons un couple de arbres plus spécialisés. Donc, un exemple est un arbre binaire. Et un arbre binaire est, encore une fois, d'aller juste pour être une structure de données avec une sorte de hiérarchie, mais chacun des noeuds peut avoir au plus deux enfants. Voilà où le mot binaire vient. Ainsi, ceci est un exemple d'un arbre binaire. Voilà donc une catégorie plus petite des arbres. Maintenant, nous allons encore plus spécifique et parler binaire recherche binaire trees-- arbres, plutôt. Alors, voici l'idée est fait non seulement chaque nœud avoir au plus deux enfants, mais tous les enfants à la gauche vont être plus petits et tous les enfants à la droit vont être plus grand. Donc remarquer en seulement notre arbre binaire, il est aucune relation entre les numéros. Mais dans notre recherche binaire arbre, nous voyons, OK, voici 44. Et chaque numéro à la gauche de 44 est plus petit et tout à droite est plus gros. Et qui détient à chaque niveau de l'arbre. Donc, ici, est plus petite que ce 22 et cela est plus grand que 22. Et voilà arbre binaire de recherche. Pourquoi pensons-nous on appelle ça un arbre binaire de recherche? Quel algorithme ne vous rappelle? AUDIENCE: la recherche binaire. HANNAH BLUMBERG: recherche binaire. Parce que si vous êtes à la recherche d'un nombre particulier dans cet arbre, à chaque point, vous pouvez simplement frapper la moitié hors de l'arbre, ce qui est excellent. Et pour que cela va nous donner quelque chose qui ressemble beaucoup recherche binaire. Des questions? Tout droit, cool. Tout droit, tente. Le favori de tout le monde. Donc, ce qui est l'exemple nous avons vu un tas en classe. Et encore une fois, ceci est juste un autre façon que nous pouvons stocker des données. Dans le cas d'un dictionnaire, de nouveau, ce va juste être des chaînes. Donc, nous allons voir ce que cela fait ressemble à un niveau légèrement inférieur. Donc, nous allons jeter un coup d'oeil à un noeud dans un trie. Et nous voyons, OK, il va y d'être une valeur booléenne et un noeud, un pointeur vers un noeud. Et nous voyons que le Booléenne est appelé is_word. Donc, essentiellement, que ce va correspondre à ces petits triangles qui dit, si vous avez obtenu ici, vous avez trouvé un mot complet. Nous savons que "Turing" plus ici est un mot complet, tandis que seulement T-U-R est pas un mot parce que nous ne voyons pas ce petit delta. Et ce petit delta, à nouveau, correspond à ce is_word, ce is_word booléenne. Et puis nous avons un tableau d'enfants. Donc, à chaque niveau, vous avoir un noeud particulier, et que les points de nœud à un tableau de l'alphabet entier. Donc vous pouvez voir, encore une fois, dans ce picture-- je suis va continuer à sauter en arrière et forth-- que ce tableau au sommet a un tas de différents noeuds venant hors de lui. Il a 26 ou 27 si vous voulez d'inclure un caractère supplémentaire. Et cela nous donne un moyen de stocker nos données d'une manière qui peut être regardé sur que vous pouvez regarder super rapide. Quel est le délai de consultation pour un trie? AUDIENCE: [inaudible]. HANNAH BLUMBERG: Ouais. En théorie, il est temps constant. Ça ne va pas être de la taille de le mot que vous voulez rechercher. Même si l'on ajoute un tas plus de mots à notre trie, ça ne va pas nous prendre plus longtemps pour déterminer si un mot est donnée dans le trie. Voilà donc vraiment agréable. AUDIENCE: Avez-vous tout simplement initialiser ce tableau? Vous avez manqué un point ou deux. Pouvez-vous seulement parler que, pour une seconde? HANNAH BLUMBERG: Bien sûr, absolument. Bonne question. La question était, nous avoir un tableau qui est allez avoir comme noeud étoiles plutôt que de simplement noeud, non? Bien. Alors, voici ce que nous disons est notre gamme est juste va être pointeurs vers d'autres réseaux. Donc, il est essentially-- ce genre de se sent comme une liste liée de cette manière où chacun de ces enfants il suffit de pointer sur le noeud suivant. Et la façon dont nous effectivement déterminer, hey, OK, nous avons réitéré à travers un ensemble de mot, ce mot est dans le dictionnaire, nous vérifions tout ce is_word. Grande question. Oui. AUDIENCE: OK. Alors quel était le runtime pour le trie? HANNAH BLUMBERG: Bien sûr. Donc l'exécution pour un trie pour recherche va être temps constant. Donc, il va juste être le nombre de lettres dans le mot. Il est indépendant de la taille du dictionnaire ou la taille de la structure de données. Alors, voici un exemple un peu plus simple. Dans ce cas, vous pouvez voir que le mot chauve-souris est dans le dictionnaire et vous avez zoom, mais vous ne pas avoir quelque chose comme zoo. Comment pourrions-nous faire zoo? Comment pouvons-nous ajouter à notre zoo dictionnaire, à notre trie? Oui. AUDIENCE: Faites is_word vrai pour le [inaudible]. HANNAH BLUMBERG: Bon. Nous aimerions donc dire Z-O-O, puis nous avions vouloir vérifier au large ainsi que la case. Formidable. Comparons très brièvement tente par rapport tables de hachage. Essais sont vraiment très bien parce que, comme nous l'avons dit, ils fournissent lookup-temps constant. Mais l'énorme désavantage est qu'ils sont faramineux. Vous pouvez obtenir le sens, même en le regardant, qu'il va prendre une énorme quantité de mémoire. Donc, ils vont être beaucoup plus grand que les tables de hachage, mais ils vont donner nous beaucoup plus vite temps de recherche. Voilà donc de votre genre compromis, ce que vous vous souciez, que ce soit la vitesse ou de la mémoire. Vous avez des questions sur tout cela, l'ensemble des structures de données C. Beau. D'ACCORD. Nous allons passer à un peu peu de développement web avec Maria. MARIA ZLATKOVA: Lovely. D'ACCORD. HANNAH BLUMBERG: Vous pouvez utiliser mon ordinateur portable. MARIA ZLATKOVA: Nice. OK cool. Comme nous passons maintenant à l'internet développement, nous avons parlé un peu à propos de la modification des autorisations des fichiers et répertoires afin qu'ils puissent être accessibles à d'autres utilisateurs, dans le monde, et afin que nous puissions voir comment Fondamentalement, nous pouvons les transmettre lorsque nous développons des choses comme des sites Web que nous avons surtout été faisons. Donc, nous avons vu de la commande chmod, qui est le mode de changement, essentiellement. Voilà une commande Linux et il change les autorisations d'accès des objets du système de fichiers. Et un objet de système de fichiers est un répertoire, un fichier, tout ce que vous pouvez changer les permissions de. Donc, pour voir les permissions de fichiers, nous tapez la commande ls, liste, -l. Et quand nous tapons, nous généralement voir certaines autorisations ce regard un peu comme ce en face d'un nom de répertoire. Donc d réfère au répertoire. Et puis nous avons trois triades que, fondamentalement, reportez-vous aux autorisations de soit un utilisateur, un groupe, ou dans le monde. Les types d'autorisations que nous pouvons avoir pour ces trois groupes de personnes sont soit r pour lecture seule, w pour écrire, et x pour exécuter. Et nous pouvons avoir ceux pour le groupe et dans le monde ainsi. La chose la plus délicate est que, parfois, lorsque nous tapons la commande chmod, il faut saisir un certain nombre qui se composait de trois bits. Donc, nous pourrions faire comme 777 et que, fondamentalement, renvoyée à la valeur ajoutée de chacun de ces triades parce r se réfère à 4, w feriez se réfèrent à 2, et x se référer à 1, ainsi lorsqu'on les additionne, chacun des nombres descendrait à un nombre cumulé pour une valeur cumulée comprise entre 0 et 7. Donc, nous pourrions aussi avoir 0 pour aucune autorisation à tous. Et ce serait essentiellement nous donner les autorisations pour l'utilisateur, soit le groupe, ou dans le monde. Toutes les questions sur ce si loin? AUDIENCE: Vous avez dit lire était de 4? MARIA ZLATKOVA: Oui. AUDIENCE: [inaudible]. HANNAH BLUMBERG: Yup. Public: Et puis en ajoutant tous ceux d'autres semblent indiquer votre numéro. MARIA ZLATKOVA: Ouais. Oui. Ce sont de grandes questions. Charmant. Ensuite, nous avons sauté dans HTML et un peu plus sur le développement web. Donc HTML signifie simplement Langage Signalétique Hyper Text. Et qui est le balisage langue qui est une norme qu'il est utilisé pour créer des pages web. Il a appelé un langage de balisage parce qu'il est pas réellement compilée. Il ne dit pas comment un peu de code devrait être exécuté ou quelque chose comme ça. Il délimite juste et décrit comment un web page doit être mis en place avec chacun de ses éléments et comment ils doivent regarder vers l'utilisateur. Certains des balises HTML que nous est allé plus sont les suivantes. Tous nos documents HTML commencé avec le DOCTYPE html. Ensuite, nous avons toujours la balise html. Nous avons une tête et un corps. Et il est important que le HTML a ce genre de structure imbriquée car il est très clair. Et puis il devient très clair quand nous besoin d'ouvrir et de fermer réellement les tags. Et nous avons toujours besoin de fermer balises que nous avons ouvert. Et ici, nous avons quelques-uns des types des choses à venir que nous voulons avoir. Donc, nous avons, par exemple, le titre de CS50. Et puis nous avons fait peut lier une feuille de style qui définit la façon dont nous le style de notre site Web. Voilà CSS. Nous allons aller au-dessus de la deux prochaines diapositives ainsi. Dans le corps, nous avons mis en certaines classes et les ID. Et comme un rappel, encore une fois, ID sont uniques et les classes peuvent être attribués à plusieurs éléments. Et cela signifie juste que nous pouvons utiliser les classes et les ID dans les autres structures-- donc, pour par exemple, dans les fichiers CSS ou le style sheets-- de se référer à des éléments spécifiques et fondamentalement disons que nous voulons pour le style ou concevoir un élément d'une certaine façon particulière. Et nous les appelons par leurs identifiants et des classes. Et nous pouvons également faire référence à des choses différentes par mots-clés ainsi, mais les ID et classes nous donnent quelques-uns polyvalence et ce spécifiquement nous vous référer à. Alors juste un exemple. Nous pouvons, à nouveau, au sein un fichier CSS où nous vouloir définir certaines style-- sorte couleurs, les polices, et des trucs comme that-- nous pouvons définir le style d'un corps. Donc, ce serait le définir pour toute la balise body. Mais on peut aussi définir un style pour un #title. Et encore, le hashtag se réfère à notre ID et le point se réfère à notre classe. Et puis pour les .info, nous peut également définir certains attributs. Et encore une fois, quand nous reviendrons, nous avons eu notre classe appelée infos et notre titre de ID. Et nous pouvons voir que nous nous référons à eux par #title et .info. Public: Diriez-vous mot-dièse [? adopte moi? ?] MARIA ZLATKOVA: Désolé? Public: Diriez-vous mot-dièse [? adopte moi? ?] MARIA ZLATKOVA: hashtag signifie ID, donc #title se réfère à tous les éléments qui avoir cette ID appelé titre. Et puis le point se réfère à une classe. Donc .info se réfère à cet élément parce qu'il a l'info de classe. Ouaip. Public: Pourquoi vous faire les distinguer dans le HTML? Pourquoi dites-vous certaines choses sont ID et certaines choses sont de classe? MARIA ZLATKOVA: qui est juste à vous-- HANNAH BLUMBERG: répéter la question. MARIA ZLATKOVA: Oh, désolé. Pourquoi avons-nous distinguons certains éléments que les ID et d'autres éléments comme les classes? Voilà juste parce qu'il est vraiment souvent un choix de conception. Il vous donne beaucoup de polyvalence en étant en mesure de dire que je veux que ce point précis d'avoir cette ID parce qu'ils veulent pour faire beaucoup de choses avec elle, et je ne vouloir définir un style, certain style ou quel que soit la couleur pour cet article. Et la façon de le faire est juste en lui donnant une ID. Et puis, si je veux avoir un couple de différents articles présentant, au lieu de cours et la mise en their-- lieu de le faire par tag car la balise serait mettre la cellule pour l'ensemble tag pour chaque fois que cette étiquette est utilisée, vous pouvez définir une classe à plusieurs éléments. Et puis juste accéder à cette classe et dire Je veux le style de cette classe de cette façon. Et encore une fois, la classe peut avoir plusieurs éléments différents et l'ID doit être unique. Grandes questions. D'autres questions? OK, impressionnant. Encore une fois, voici comment ces sélecteurs sont référencés en CSS, avec hashtag, avec un point, ou sans rien pour attribuer le style de certains tag, comme le corps. Et ici, nous avons le grand syntaxe de la façon dont cela est fait. Pour répéter certaines des meilleures pratiques pour HTML et CSS, nous devons, encore une fois, tout près les balises HTML que nous ouvrons. Et ce que nous vous recommandons faire pour vos projets finaux, ainsi que pour CS50 Finances, est de faire assurer que l'ensemble de votre HTML valide. Et cela est fait avec le W3 Validator. Et puis ce que nous avons fait et ce que nous vous recommandons de faire est la séparation style, donc CSS à partir des balises HTML. Donc, tout ce qui se rapporte à la façon dont votre page va regarder visuellement et comment il va être modifié devrait aller dans un document CSS. Et puis votre balisage dire comment les choses sont par rapport à l'autre est HTML, et qui devrait aller à l'intérieur de vos documents HTML. Des questions? Hum. Public: Qu'est-ce qui se passe exactement avec la validation de la page lorsque nous la validation de la HTML qui [inaudible] créé? MARIA ZLATKOVA: Donc vous pensez what--. Alors qu'est-ce qui se passe exactement sur de validation de page et pourquoi devons-nous faire? Fondamentalement, nous devons faire ce que car un grand nombre de fois, votre navigateur, si vous ne fermez pas une balise ou quelque chose comme ça, votre navigateur va encore rendre une page et pourrait encore travailler, mais il est la meilleure pratique pour vous assurer que vous avez, à nouveau, fermé toutes vos balises, que tous vos éléments sont la façon dont ils devraient l'être, et fondamentalement qu'il est par la conventions qui sont prédéfinis. Il est, encore une fois, juste une chose que vous devriez être apprendre à être faites, plutôt que d'avoir Code sloppier et des trucs comme ça. Oui. Oh, désolé. Je pensais que vous soulevez votre main. AUDIENCE: Non, je suis juste [inaudible]. MARIA ZLATKOVA: OK. AUDIENCE: Je vous remercie. MARIA ZLATKOVA: Bien sûr, je vous remercie. Encore une fois, aller sur la façon dont les informations sont transférées et les modèles de communication pour transférer des informations. TCP / IP. TCP signifie simplement Transmission Control Protocol et IP se réfère à protocole Internet. Et que se réfère juste la façon dont les données est livré. Si nous avons quelques données doit donc livrés à vous-- vous faites une demande pour un certain serveur. Par exemple, lorsque nous essayez d'accéder à cs50.net, nous faisons une demande de le serveur CS50 et nous voyons ce que nous voulons obtenir ce genre d'information. Et puis sont basés sur ce protocole pour savoir comment cette information est fournie, le serveur fournit des informations de nouveau à nous, le client. Et puis, nous sommes en mesure de voir les informations de la page et ensuite l'utiliser. Alors Hypertext Transfer Protocol est juste un autre protocole ou un ensemble des conventions qui définit comment le navigateur Web et le serveur Web devrait communiquer. Et mettre tout cela en même temps, HTTP, de nouveau, définit à quel point cette hypertexte défini par le HTML que nous avons travaillé il, comment il devrait être livré à vous et comment ces données qui est livré à vous arrive à vous. Et voilà pourquoi, si vous les gars me souviens d'une classe, nous avons eu beaucoup de demandes et nous avons eu beaucoup de syntaxe pour ces demandes que nous sommes passer en revue en ce moment. Encore une fois, lorsque nous envoyons une demande à un serveur, nous devons définir un certain nombre de choses. Nous devons donc trouver le type de la demande que nous mettons en place. Et encore une fois, nous avons, par exemple, GET est un type de méthode que nous avons dans notre demande. Et puis HTTP / 1.1 est juste le protocole que nous utilisons actuellement. La plupart du temps, ça va le protocole que nous utilisons. Donc, si vous avez une question comme ça sur votre quiz. Voilà les conventions que nous avons jusqu'ici. Backslash se réfère à ce genre des choses que nous demandons. Ensuite, notre hôte est, par exemple, en ce cas, nous essayons d'aller à google.com. Donc ceci est la valeur d'un hôte. Ceci est un type de demande qui pourrait être envoyé. Et puis un type de réponse qui pourrait envoyer, à nouveau, sur la base de ce protocole, est nouveau, HTTP / 1.1. Voilà donc encore une fois la version HTTP. 200 OK est juste le code de statut. Et que OK est juste une phrase basé sur ce code d'état. Et puis le Content-Type se réfère au type qui est retourné à vous qui est pour cette page Web que vous recevez et que votre navigateur peut rendre par la suite. Et qui est text / html. Public: Qu'est-ce que 1.1 veut dire? MARIA ZLATKOVA: Voilà juste le Version de-- oh, qu'est-ce que 1.1 veut dire? Cela est tout simplement la version, le HTTP version d'un protocole que nous utilisons. Grande question. D'autres questions? Public: Pourriez-vous résumer Content-Type réel rapide? MARIA ZLATKOVA: Alors que est que le serveur. le type de ce qui est information-- type de contenu était les questions. Donc, ce qui était le type de informations que vous obtenez en retour à partir du serveur, le type de données que le navigateur peut alors rendu que vous utilisez. Public: Est-ce que ce que cette protocole vous dit de le faire? MARIA ZLATKOVA: Désolé? Public: Est-ce que le protocole dit? MARIA ZLATKOVA: Le protocol-- AUDIENCE: la --quel Content-Type est ou what-- MARIA ZLATKOVA: Le protocole est basé on-- quel est le protocole que vous dites? Cela est juste la manière que ces informations a été livré à vous en fonction de ce genre de protocole a obtenu cette information livré de nouveau à vous. Est-ce logique sorte de? HANNAH BLUMBERG: Vous peut penser protocole Je pense que a-- professeur Malan décrit dans la classe comme un peu comme il est comme a-- l'équivalent de prise de contact humain. Dire, comme, hey, je suis une demande et je savoir comment gérer HTTP de la version 1.1. Et puis le serveur dit, Oh, OK, I-- et les deux existent. Je sais aussi comment faire face à HTTP / 1.1. Et je vais donner vous sauvegardez une partie du contenu. Dans ce cas, il va être de type text / html. Donc, il est un peu juste un moyen d'entre eux pour communicating-- MARIA ZLATKOVA: Il est juste confirmant que vous êtes à la fois suivant la même protocole et que les deux le client et le Server-- si votre navigateur et le Server-- sorte de savoir ce que vous êtes parler et ont la convention pour le passage dans les données. Auditoire: Alors, le Content-Type part-- le texte Content-Type / html-- qui est une partie distincte du même message? Ou est-ce une partie de, disons, 200? 200 ne leur dire que ou est-- MARIA ZLATKOVA: 200 dit tout est allé OK. Et puis le type de contenu est une sorte de partie distincte du même message, et en disant la chose que je Retourné a ce type de text / html. Il est juste de donner plus d'informations. Avoir quelque chose à ajouter? D'ACCORD. Toutes les autres questions à ce sujet? Impressionnant. De sorte que certains autres états HTTP nous pourrions obtenir en plus des 200 OK, ceux que nous avons vu peut-être peut-être beaucoup sont 403 et 404. Donc 404, si vous essayiez de accès quelque chose qui ne existe pas. Ainsi, par exemple, dans votre Psets CS50 Finance, si vous aviez été rendrez quote.html et vous avez avez pas ce fichier, mais vous aviez quote.php, que se traduirait par un 404 Not Found parce que le fichier peut ne pas exister. Pour un 403 interdit, que se réfère aux autorisations. Donc, si certains fichiers ne sont pas lisibles par le monde, vous pourriez obtenir un 403 retourné. D'autres que vous pourriez get-- 301, Déplacé de manière permanente; 302, a trouvé; 304, modifié; 400 Bad Request; et Server Error puis interne pour 500 et 503, Service Unavailable. Oui. AUDIENCE: Allons-nous attendre à mémoriser tous ces statuts? MARIA ZLATKOVA: Je dois sur votre feuille de triche. [RIRE] AUDIENCE: Sommes-nous nous attendions à savoir ce qui déclenche chacun? MARIA ZLATKOVA: Sont-ils? HANNAH BLUMBERG: Pour ceux que nous avons exécuter into-- donc la question était-- MARIA ZLATKOVA: Sont-ils censés savoir ce que chacun de ces statuts codes pourrait être déclenchée par? Donc, pour ceux que nous avons utilisés et a couru dans, je dirais que oui. Donc, nous avons certainement vu 200 OK et donné des conférences dans psets. Nous avons vu 403, 404. Pour les autres? HANNAH BLUMBERG: Je voudrais dire 500 semble un jeu équitable. MARIA ZLATKOVA: 500, oui. HANNAH BLUMBERG: Ouais. Juste avoir un sens général de ce qui les provoque. Et aussi tout simplement par ces noms, vous pouvez sorte de comme faire une supposition éclairée que à ce qui fait leur causer. Par exemple, se déplacer en permanence, probablement le fichier a été déplacé de façon permanente. AUDIENCE: Mais sur une précédente examen, il y avait une sorte comment voulez-vous nous répondre à cela? HANNAH BLUMBERG: Ce valait zéro points. La question sur la 418 sur la théière est techniquement un état HTTP, mais ça valait zéro points. Évidemment, vous n'êtes pas devrait les connaître. Public: Est-ce un vrai? HANNAH BLUMBERG: Il est un véritable un, mais il ne veut rien dire. C'est juste une blague. Les gens sont drôles Internet. MARIA ZLATKOVA: Grandes questions, les gars. D'autres questions? Public: Quelle est l'erreur de serveur interne? MARIA ZLATKOVA: interne erreur de serveur juste signifie que vous avez été incapable de communiquer avec le serveur pour une raison quelconque. Donc, il est pas nécessairement quelque chose qui a à voir avec le client ou quelque chose comme ça. Je ne sais pas d'exemple spécifique que nous avons dépassé pour expliquer, mais ouais. HANNAH BLUMBERG: Bien sûr. Ainsi, par exemple, comme nous allons dites que vous travaillez sur mashup et un serveur de Google est descendu pour certains raison, une panne de courant, disons. Ce serait un serveur interne erreur ou une sorte de-- vous aimez ne serait pas obtenir une réponse. MARIA ZLATKOVA: Ouais. Il est juste quand vous êtes incapable de communiquer avec le serveur pour une raison quelconque, car de celui-ci de descendre ou une autre raison. Donc sauter dans PHP. PHP, contrairement à HTML, est un langage de programmation. Et nous avons commencé à l'utiliser car il est très utile pour le développement web. Nous avons utilisé d'abord dans CS50 Finances. Et il contribue essentiellement nous apporter ensemble ce balisage, la conception, et comment nous utilisons réellement de l'information pour afficher des choses sur une page web. Donc PHP lui-même signifie PHP Hypertext Preprocessor, il est donc un backnorym récursive par lui-même. Et l'ouverture des tags pour PHP, nous la gauche et les flèches droite avec les points d'interrogation et php. Donc, nous avons déjà vu un tas de celui-ci. Maintenant, nous allons juste aller sur quelques-unes des choses de base à ce sujet. Donc, avec PHP, la variable noms commencent avec le signe dollar. Nous ne spécifions pas, encore une fois, tapez plus une variable. Tout comme nous avons fait avec C, nous ne devons pas le faire. Nous pouvons faire un tas de différents des trucs avec des variables. Nous pouvons les mettre ensemble en les concaténant avec la notation par points, qui nous ne pouvions pas faire dans C à nouveau. Encore une fois, nous avons un peu plus de polyvalence avec PHP en termes de variables. Encore une fois, nous ne disposons pas d'une fonction principale. Et PHP est interprété par opposition à compilée, Alors, comment nous avons fait pour les fichiers C, nous ne devons pas le faire pour PHP. Mais plutôt, la manière dont la langue est géré par lui-même, il est interprété. Et puis faiblement typé signifie simplement que nous ne pas avoir à spécifier une variable type et les types de variables sont compris à l'exécution. AUDIENCE: Mais ce que vous faisiez dire par concaténation dot? MARIA ZLATKOVA: Bien sûr. Quand nous voulons mettre les choses together-- Donc, si nous avons eu quelques variable si la valeur de 3 et nous avions un autre variable qui avait de la valeur de la chaîne, nous pourrions mettre les variables ensemble en mettant un point entre eux et les concaténer. Ou nous pourrions créer un variable appelée nom et mettre ensemble par concaténation de deux chaînes. Donc, si nous avions une chaîne en chambre double devis et nous mettons un point après, et puis nous avons eu une autre chaîne, qui créerait tout une chaîne. AUDIENCE: OK. MARIA LETTONIE: Était-ce clair? AUDIENCE: Ouais. MARIA ZLATKOVA: OK. Oui. PUBLIC: Quand vous dites interprété plutôt que compilé, parlez-vous pas que vous faites besoin d'être aussi précis quand il vient à PHP par rapport à C? MARIA ZLATKOVA: Quand nous disons interprété par opposition à compilé, qu'entendons-nous? Cela signifie donc que nous ne devons pas exécution de fichiers exécutables PHP. Il signifie qu'il fonctionne comme il va. Cela a-t-il du sens? Un peu plus. HANNAH BLUMBERG: Donc vous peut penser d'un interprète comme un autre programme qui est responsable pour aller ligne par ligne par PHP et exécuter réellement, par opposition à la compilation de tout cela en binaire. Il ne fait quoi que ce soit signifie pas sur la façon spécifique, nous devons être. Nous avons encore besoin d'être précis, et ne pas oublier votre point-virgule, et assurez- vous avez votre signe du dollar, et des choses comme ça. Bonne question. MARIA ZLATKOVA: Ouais. Donc, ligne par ligne, comme opposition à des fichiers C, nous devons faire toute la finale avant que nous puissions réellement l'exécuter. Voilà la principale différence. Mais encore une fois, nous ne pouvons pas vraiment être moins spécifique. Donc tableaux PHP représentent en fait une carte commandé. Donc, les valeurs des tableaux associés à des touches. Les deux façons de déclarer un tableau, sur la base de cette syntaxe, nous pouvons être plus explicite en disant que nous avons un tableau et nous avons ce qui correspond à key1 cette valeur1, valeur2 key2 qui mappe. Ou nous pouvons simplement créer un tableau qui contient lui-même les valeurs et ensuite les touches sont compris dans un sens. Toutes les questions à ce sujet? Public: Quelles seraient les clés être dans le deuxième exemple? 0, 1, 2, 3? MARIA ZLATKOVA: Par exemple, il est juste les touches dans ce ne sont pas nécessairement faire une différence. Ils définir à quel point vous pouvez utiliser les valeurs à l'intérieur. Donc, si nous avions un foreach boucle en PHP qui serait nous permettent de passer par toutes les valeurs, nous pouvons passer par toutes les valeurs, même si nous avait ou non définie une clé spécifique au sein du site de la syntaxe précédente. Donc, même avec ce genre du tableau, nous pourrions encore avoir une boucle foreach qui passe par chaque des valeurs de la clé dans le réseau. Ainsi, la syntaxe d'un foreach boucle, nous commençons par un tableau. Cette variable $ arr est notre véritable tableau que nous avons défini dans la diapositive précédente en tant que valeur qui va littéralement à travers chacune des valeurs, indépendamment du fait que nous avions une clé ou non. Et puis, nous pouvons faire quelque chose avec la valeur intérieur de la boucle foreach. Encore une fois, si nous avions un tableau comme cela ici created-- ainsi nous avons la clé de foo et la valeur de bar, la clé de Baz et la valeur de qux-- nous pouvons avoir une boucle foreach que passe par tableau comme valeur de clé et puis faire quelque chose avec la clé et / ou la valeur. Mais nous ne faisons pas toujours nécessairement avoir un foreach boucles passe par tableau comme carte clé de la valeur. Nous pouvons passer par le réseau de boucle foreach en tant que valeur. HANNAH BLUMBERG: Et je pense que to-- était votre question, ce qui est l'indice implicite? AUDIENCE: Kinda. MARIA ZLATKOVA: Oh. HANNAH BLUMBERG: Ouais, ouais. Donc, fondamentalement, si vous ne spécifiez pas une clé, il va être 01. MARIA ZLATKOVA: Ouais. Tout comme avec C, il est zéro indexées si vous ne spécifiez pas de clé. AUDIENCE: Désolé. Pourriez-vous essayez de parler un peu plus fort? Je vais avoir un peu de difficulté à entendre tout. MARIA ZLATKOVA: Je suis désolé. Ouais, bien sûr. Alors voulez-vous de moi d'aller sur ce nouveau? Ou est this-- Auditoire: Alors, sur le slide-- précédent si vous pouvez simplement revenir pour une seconde. MARIA ZLATKOVA: Bien sûr, désolé. Auditoire: Alors, la deuxième tableau ici ne semblent avoir une valeur à la clé, sorte de [? causalité. ?] MARIA ZLATKOVA: Droit, droit. Auditoire: Alors, comment ça marche quand vous dites qu'il est tout ou rien. Pour moi, cela ressemble à un [? foo?] déjà. MARIA ZLATKOVA: Ouais, ouais. Encore une fois, ceci est un carte ordonné dans ce sens qu'il y sont comprises, par exemple, les indices ici peut être comprise comme 0, 1, 2, 3. Encore une fois, voilà ceux ayant index est l'équivalent de notre d'avoir les clés mappés sur les valeurs. Donc, si notre clé était 0-- désolé. HANNAH BLUMBERG: Non, Il ya la craie ici. Il est effectivement très belle. MARIA ZLATKOVA: Très bien. D'ACCORD. Encore une fois, 0 $ arr serait la clé pour la valeur 1. 0 serait la clé pour la valeur 1. AUDIENCE: Je suis désolé. Il est invisible. HANNAH BLUMBERG: Très bien, tant pis. Chalk était une mauvaise idée. Je reprend cela. Vous pouvez penser à des touches que 0 correspond à la valeur 1. MARIA ZLATKOVA: Ouais. Donc, cela est 0, cela vaut 1, 2, 3. Ceux-ci peuvent être vos clés. Vous pouvez penser à eux as-- ouais. Ainsi, au lieu d'avoir clés explicites, ils sont sorte d'comprise comme étant les indices commençant à 0. La craie n'a pas aidé. Oui. Public: Pour la boucle foreach, si nous voulions voir la valeur que, Il serait tout simplement index automatiquement à 0? MARIA ZLATKOVA: Ouais. Ce serait passer par chacune des valeurs. AUDIENCE: [inaudible] que 0 ou serait-ce simplement faire 0? MARIA ZLATKOVA: Vous auriez à-dire comme signe de dollar et ensuite un nom variable, valeur. AUDIENCE: [inaudible]. MARIA ZLATKOVA: Désolé? AUDIENCE: Désolé, je suis juste essayer de se rappeler. Comment feriez-vous que si vous pouvez le faire automatiquement l'indexation est juste de 0? MARIA ZLATKOVA: Alors, comment voulez-vous faire si vous ne disposez pas de noms spécifiques clés? AUDIENCE: Ouais. MARIA ZLATKOVA: vous voulez bien define-- juste dire vous-même comme un nom. Donc, dans votre psets, vous les gars pourrait souvenir foreach $ row sous forme de lignes $, nous-mêmes créé cette $ row disant nous voulons passer par le rang $ rangées. Même si nous ne disposons pas des cette $ explicite lignes définies, nous pouvions aller dire ce qui peut être la clé de notre, et juste passer par chacune des valeurs. Auditoire: Alors, est la valeur d'une nouvelle variable nous créons pour stocker [inaudible]? MARIA ZLATKOVA: il est donc pas intrinsèquement une nouvelle variable. Il est une variable qui indique la à l'intérieur de la matrice de chacun d'eux. HANNAH BLUMBERG: Il est un nouveau nom de la variable. MARIA ZLATKOVA: Ouais, il est un nouveau nom de la variable, mais ça ne inherently-- ouais. Il est juste une nouvelle variable que vous pouvez faire. Alors, comment avons-nous fait $ row que $ lignes, rangées était un nouveau nom de la variable que nous pourrait créer dans notre boucle foreach. Il n'a pas à préexister avant. Public: Pourriez-vous passer par la logique pour chacun, en utilisant l'exemple il? MARIA ZLATKOVA: Hum. Oh, désolé. Voici l'exemple. Bien sur. Ainsi, pour chaque sorte array-- cela signifie aller à ce tableau comme la clé qui va value-- à passer par ce tableau et le premier aller chercher foo, la foo clavier et la barre de valeur. Et puis sur le deuxième itération de la boucle, ça va passer et prendre le baz clé et la valeur qux. Et puis vous pouvez faire quelque chose avec l'un d'eux ou les deux d'entre eux. Auditoire: Alors, l'idée derrière ayant un point clé pour la valeur, ce que vous retrouvez-vous accès? MARIA ZLATKOVA: Quelle est l'idée d'avoir un pointage clé de la valeur? Il est juste une autre convention, un autre façon de passer par le réseau et être en mesure d'accéder à l'une ou l'autre clé ou la valeur ou les deux et de les utiliser. Public: Quel est le rôle de la ordonner que le foreach fonctionne en? Donc, si nous étions à ajouter des éléments au tableau plus tard, aurait ceux qui seront les premiers appelé dans le tableau foreach, ou serait-il plus tard? MARIA ZLATKOVA: Alors, quelle est l'ordre que le foreach boucle passe par un tableau dans? Elle passe par le premier élément au dernier élément, pour le dernier élément ajouté. Si vous ajoutez des éléments plus tard, ils le feraient accessed-- être les premiers éléments seraient être consultée comme le premier éléments de la matrice, et puis vous iriez à travers chacun des les éléments comme une sorte de ordered-- pas ordonné, mais la façon dont ils ont été mis dans le tableau. Auditoire: Alors, de nouveaux éléments sont ajoutés plus tard? Donc ils added-- ils seront la derniers dans le [? itération. ?] MARIA ZLATKOVA: Nouveaux éléments can-- Fondamentalement, lorsque de nouveaux éléments sont ajoutés, ils sont ajoutés à la fin du tableau? AUDIENCE: Ouais. MARIA ZLATKOVA: Je crois que oui. Oui. Et puis, avec votre boucle foreach, après que vous avez ajouté de nouveaux éléments et vous allez à travers eux, les nouveaux éléments seraient accessed-- être le nouvel élément, si elle est ajouté dernière, elle sera accessible dernier. AUDIENCE: Pouvez-vous donner juste un exemple de quelque chose qui serait [inaudible] avec quelque chose avec la valeur comme [inaudible] ou de la valeur, comme la façon dont vous souhaitez format? MARIA ZLATKOVA: Bien sûr. Puis-je donner un exemple de ce que nous ferions avec la valeur? Donc ce que vous avez peut-être familier avec est que nous sommes passés à travers un réseau et fondamentalement imprimée chacun des éléments, par exemple, dans le cadre d'un liste ou quelque chose qui a ordonné. Est-ce logique ou voulons-nous to-- AUDIENCE: Peut-on imprimer sur ces valeurs? MARIA ZLATKOVA: Oui, nous pourrions imprimer puis essentiellement $ Valeur parce qu'à cette valeur spécifique, nous serait l'impression de la valeur à l'intérieur de celui-ci. Donc, si nous étions à notre première itération de celui-ci et nous avons imprimé valeur de $, nous imprimerons bar. Public: Y at-il également pour les boucles en PHP ou seulement boucles foreach? MARIA ZLATKOVA: Il ya également pour les boucles en PHP. Et leur logique est surtout le même que ce que vous avez été habitué. Auditoire: Alors, sa valeur est nulle. MARIA ZLATKOVA: Il est comme le même. Oui. AUDIENCE: Je vais juste poser. Ainsi, lorsque vous déclarez un tableau, vous ne devez pas de dire quelle taille il va être, ce qui signifie que vous pouvez juste ajouter et enlever des éléments [inaudible]. MARIA ZLATKOVA: Yup. Ouaip. Exactement. Lorsque nous déclarons un tableau, nous ne pas besoin de dire quelle taille il est, de sorte que nous pouvons simplement ajouter des éléments sur elle plus tard aussi. Plus de questions? Donc apportant PHP et HTML ensemble, ce que nous avons bien seen--, par exemple, dans cet exemple, nous avons un formulaire HTML qui a un champ de saisie. Et le champ de saisie est juste le nom et puis il a un bouton Soumettre. Et quand vous appuyez sur la Proposez bouton, dans notre fichier hello.php, parce que la méthode est pour la forme obtenir, nous pouvons accéder à tout ce qui est au nom par cette variable globale qui se est-- la syntaxe car il est $ _GET. Et puis nous pouvons accéder quel que soit le entrée de l'utilisateur à l'intérieur de cette forme de nom en spécifiant le nom de ce champ. Toutes les autres questions ou tout questions sur cet exemple précis? AUDIENCE: Où est le PHP? MARIA ZLATKOVA: Ici. Alors ceci est notre balise d'ouverture pour le PHP. AUDIENCE: Oh, droite. MARIA ZLATKOVA: Oui. HANNAH BLUMBERG:? Le = est un raccourci pour ce que PHP et juste écho. AUDIENCE: Oh. MARIA ZLATKOVA: Ouais, désolé. Je l'aurais bien fait comprendre. HANNAH BLUMBERG: Imprimer. MARIA ZLATKOVA: Il est juste la fonction qui nous permet d'imprimer quelque chose. Grande question. Donc going-- oui. Public: Est-ce qu'il y aura assez un peu de codage manuel de PHP et HTML Quiz sur 1? MARIA ZLATKOVA: Il peut être un bonne quantité d'interprétation PHP et HTML, pas nécessairement comme une énorme quantité de codage, si vous pourriez avoir à écrire un boucle foreach, cependant, une boucle for. Tous les boucles que nous couvrir ici est un jeu équitable. Et qui est la plupart du temps il. HANNAH BLUMBERG: je serais prêt. De la même manière que nous vous avons demandé de écrire un tas de fonctions C sur quizz 0, Je serais prêt à faire la même en PHP et JavaScript. MARIA ZLATKOVA: Ouais. HANNAH BLUMBERG: Je dirais un little-- comme nous ne sommes pas va vous faire écrire une énorme HTML la page juste parce que ce un peu fastidieux, mais vous pourriez avoir des parties. Voilà jeu totalement équitable. Comme petite page HTML, tout à fait juste. AUDIENCE: OK. Que diriez-vous en JavaScript ainsi? HANNAH BLUMBERG: Ouais. Fair Game de JavaScript. MARIA ZLATKOVA: Ouais. Voilà jeu complètement équitable. HANNAH BLUMBERG: Nous obtiendrons comme à celle de 10 minutes. MARIA ZLATKOVA: SQL, encore une fois, Structured Query Language. Il permet essentiellement de gérer des données dans une base de données relationnelle système. Cela signifie juste fondamentalement que nous avons quelque part pour stocker certaines données que nous pourrions vouloir utiliser dans un site Web ou sous une autre forme. Et puis nous avons des requêtes pour obtenir informations de notre base de données, ou pour insérer des informations en eux. Un grand nombre de UPDATE ones-- commune, INSERT, SELECT et DELETE. Donc, mise à jour, cela est la syntaxe la mise à jour des données dans une base. Mise à jour de ce tableau appelé table en disant SET, nous pouvons placer quelques valeurs dans tous les rangées à l'égalité de quelque chose d'autre. Ainsi, nous pouvons également spécifier certains spécifiques entrées que nous voulons modifier et qui peut être en utilisant WHERE. Et nous pouvons préciser que nous voulons seulement modifier quelques lignes où la maison, si nous avions une table d'étudiants et tous les élèves avaient maison, donc nous ne serions modifier certaines valeurs où une maison est égal Currier, par example. Pour les commandes INSERT, nous pouvons insérer certaines valeurs dans une table. Donc INSERT INTO table, puis les valeurs, puis entre parenthèses, nous spécifions quelles valeurs vous voulez insérer. Donc INSERT INTO table, col1 et col2, la valeur est val1 et val2. Donc, ce insère essentiellement une nouvelle ligne dans un tableau contenant les valeurs 1 et 2 dans les colonnes 1 et 2. Et puis nous allons passer en revue un exemple rapide de la façon dont cela ressemble comme dans un peu notre base de données. Mais cette dernière question que je pense que nous allons passer en revue, SELECT, elle nous permet juste pour sélectionner les données à partir d'une table pour éventuellement l'utiliser par la suite. Et la façon dont nous le faisons est que nous juste le stocker dans une variable. Et puis, nous pouvons peut-être l'utiliser à nouveau. Donc étoiles SELECT signifie tout sélectionner. Voilà juste un raccourci pour sélectionner tous. FROM table WHERE, nous sommes à la recherche pour certaines conditions spécifiques, Alors, où colonne égale quelque chose, par exemple. Si nous voulions juste sélectionner tout le tableau, cela sélectionne simplement toutes les colonnes et toutes les lignes d'une table. Et puis supprimez FROM table Où col égal quelque chose, cela supprime quelques-unes Ligne de notre table où nous avons certaines conditions spécifiques. Dans ce cas, les conditions sont colonne égale quelque chose. Alors juste un petit exemple de ce. Si nous avons cette table ici et nous l'insérer dans une table, ces valeurs, cela insérer une nouvelle ligne. Et si nous avions incrémentation automatique, ce serait simplement incrémenter notre ID entre 0 et 1 à 2. Si nous avons choisi de tous les élèves, il retourne juste tous les domaines et toutes les lignes. Où l'année est supérieure ou égale à 2016, ce serait juste retour Hannah et moi-même. Et puis, si nous avons juste choisi id année et l'année des étudiants où la maison est Cabot House, qui serait, à nouveau, retourner Hannah et moi-même. Ensuite, si nous avons supprimé des étudiants où nom est égal à Rob, ce serait supprimer toute la ligne. Et puis, si nous fixons le nom, étudiants UPDATE Nom de l'ensemble est égal à Daven OÙ maison est égale Cabot House, qui va aller à les lignes et mettre à jour le nom. Et puis quelques types de données SQL sont CHAR, VARCHAR, INT, et le flotteur. Ce sont un jeu équitable. Je voudrais aller encore et assurez-vous que vous savez et de les avoir sur votre feuille de triche, ce que chacun de ces caractères ont été utilisés, ce que vous les avez utilisés sur vos psets, et assurez-vous que vous êtes familier et l'aise d'avoir à choisir à partir de différents types de données dans votre pset. Oui. Public: Qu'est-ce qui a été stockée la table? Oui, où est stocké ce tableau? MARIA ZLATKOVA: Eh bien, en ce moment, il est pas stocké. Quoi qu'il en soit, où est stocké ce tableau? Mais il peut être stocké dans une base de données SQL. Public: Et où est la base de données SQL? Dans l'ordinateur, en ligne quelque part, le serveur? MARIA ZLATKOVA: Il peut être un nombre de choses différentes. HANNAH BLUMBERG: Nous avons interfacé avec Tables SQL plupart avec phpMyAdmin. Donc, nous pourrions demander à un serveur de les stocker pour nous. Nous pourrions les stocker sur notre propre ordinateur. MARIA ZLATKOVA: Cela dépend de comment vous voulez le faire vous-même. Mais nous avons été stockons eux, comme Hannah mentionné, sur phpMyAdmin, qui est en ligne. Et puis la façon dont nous utilisons PHP et SQL, nous stockent dans une variable ce que nous avons interrogés pour. Donc, si nous Sélectionner tout dans l'histoire où user_id égale l'ID de session, ce serait sélectionner toutes les lignes pour la personne spécifique qui est connecté de l'histoire table et les trier en rangées. Une chose est cool de savoir que la fonction de requête de CS50 protège contre les balises d'injection SQL. Cela signifie juste que ça fait en sorte l'entrée qui est entré est correct et que la personne qui l'entrée est l'entrée ne cherche pas à l'entrée d'autres malveillants Code soit déposer nos tables ou tout supprimer à l'intérieur de notre base de données. Un aperçu rapide de la Modèle Model View Controller, il est juste une façon d'organiser et la réflexion sur le code. Il est encore, un paradigme de conception. Qu'est-ce que cela signifie est que nous can-- et il est une bonne pratique de séparer les différentes parties de notre code et ce qu'ils contrôler dans ces trois paradigmes. Donc, notre point de vue est le plus souvent notre modèles, notre mise en page, la façon que nous avons mis la manière dont notre code ressemble. Cela est surtout nos fichiers CSS et la manière que nous avons défini la conception de notre code, fondamentalement. Notre contrôleur est plutôt ce que nous avons fait avec les fichiers PHP. Donc encore une fois, en collaboration avec le informations que nous avons et définissant la façon que information est utilisée, et ensuite passer cette information soit sur la vue ou le modèle. Et le modèle, la façon dont nous avons utilisiez un a été notre base de données, Alors, où est notre informations stocké de sorte qu'il a quelque part à vivre, et l'un des code qui se rapporte à la façon que nous obtenons cette information ou de la manière que nous mettons à jour cette information. Ainsi, dans le modèle MVC, HTTP les demandes sont envoyées vers un serveur Web. Ensuite, l'interprète de contrôleur la demande de l'utilisateur et valide alors l'entrée de l'utilisateur. Il est optionnel que nous avons le contrôleur communiquer avec un modèle, donc quelque chose comme notre base de données ou une autre fonctionnalité qui relaie l'information. Et puis finalement, le contrôleur transmet les informations sur la vue de sorte qu'il peut être rendu et qu'elle peut devenir visible à toute personne accédant à la page Web. Des questions? Impressionnant. Encore une fois, le modèle, sa fonction, encore une fois, est un stockage persistant de l'information, gérer et organiser les données. Et ce que nous avons vu jusqu'à est loin de la base de données MySQL et tous les fichiers de données qui peuvent utiliser. Voir, présentation de l'information à l'utilisateur, l'interface utilisateur, ou une interface utilisateur. Et l'exemple de ceci est HTML. Et puis nous pourrions avoir PHP minime. Donc, une boucle qui parcourt sur des données qui sont imprimées est partie de la vue, comme par opposition à l'automate. Et puis beaucoup de nos fichiers PHP tomber dans la catégorie du contrôleur. Il gère tout demandes des utilisateurs et obtient des informations à partir du modèle. Sauter dans le Document Object Model, ce juste se réfère à la façon dont HTML les documents sont organisés. Et ils sont organisés dans un arbre qui a une structure de hiérarchie. Donc, si nous avons accès à [inaudible] représentation du document, nous pouvons travailler avec le document, comme nous manipulons des objets essentiellement. Et d'en faire une peu plus clair, quand nous avons beaucoup de notre différentes étiquettes répondent à différents itinéraires dans notre arbre. Ensuite, pour cet exemple, nous avoir le nœud de document de départ. Nous avons, ensuite, notre noeud HTML qui se divise en tête et le corps. Head a un titre, puis titre contient bonjour, monde. Et notre corps contient juste bonjour, monde ainsi. Donc, des questions sur l'un des choses que nous couverts jusqu'ici? Et si non, sera Hannah prendre le relais avec JavaScript. Impressionnant. HANNAH BLUMBERG: OK, cool. Si quelque chose arrive avec PHP ou HTML, ou tout de l'étoffe Maria couvert, nous pouvons toujours faire une pause. Nous faisons mieux sur maintes fois, si impressionnant. Et juste pour revenir très rapidement à cela, si vous regardez tous les l'examen de la dernière année, ce vient en place aux navires: voici du code HTML, font de ce schéma. Ou voici ce schéma, faire un peu HTML, donc certainement une pratique qui. Et puis voilà un il garanti question que vous pouvez obtenir le droit. Bien. Donc, nous allons parler de JavaScript et comment il est un peu différente des langues telles que PHP et C, les deux langues que nous avons vu auparavant. Donc, le numéro un, il est faiblement typé. Voilà comme PHP, mais contrairement à C. Il est un langage interprété. Encore une fois, cela ressemble PHP, à la différence de ce C et va nous permettre de use-- il fonctionne vraiment bien avec les pages Web. Il va nous permettre de manipuler le contenu et à quoi il ressemble et ce qu'il fait. Nous allons voir un peu d'Ajax. Il nous permet de communiquer de manière asynchrone avec différents serveurs et obtenir des informations. Et ceci est la chose qui a vraiment JavaScript sépare de PHP et C est qu'il est du côté client. Les deux PHP et C sont typiquement côté serveur. Pour la plupart, et presque entièrement ce nous avons vu, au moins dans cette classe, JavaScript agit sur côté client, ce qui signifie que le navigateur est en fait responsable de l'exécuter. Et cela signifie que nous ne faisons pas besoin d'interagir avec le serveur. Donc, cela signifie qu'il peut être beaucoup plus rapide parce qu'il est en fait juste il est Chrome, il est Safari, il est Firefox, tout ce que vous utiliser effectivement l'exécution de votre JavaScript. Public: Qu'est-ce que signifie asynchrone? HANNAH BLUMBERG: Ah, ce ne signifie asynchrone? Grande question. Asynchrone désigne: De plus, la teneur dans laquelle nous utilisons, il est, OK, nous sont la création d'une page Web et nous avons besoin d'obtenir des informations. Donc, avec l'exemple de mashup, certaines informations que nous pourrions vouloir est les titres des articles. Maintenant, nous could-- une option est de le faire de manière synchrone et cela signifie que let de arrêter, aller chercher l'article, obtenir l'article en arrière, puis Render, mais ce serait vraiment lent. Ce serait une mauvaise expérience utilisateur parce que vous voulez juste être assis il attendre quelque chose à répondre. Nous allons signifie asynchrone continuer à aller sur notre entreprise, rendu de la page, et nous allons envoyer une demande qui est une sorte de va passer en arrière-plan. Je pense que nous utilisons l'exemple conférence d'appeler et de dire Rob, hey, pouvez-vous regarder cette place pour moi et revenir à moi, plutôt que de simplement me en attente sur le téléphone. Donc, il se produit de manière asynchrone des moyens dans le fond loin de nous en parallèle. Grande question. autre chose? Formidable. Nous allons sauter beaucoup plus dans requêtes asynchrones avec Ajax. Public: Est-ce que JavaScript-- où vient tomber avec le modèle-vue-contrôleur? HANNAH BLUMBERG: Bonne question. Où se JavaScript automne avec le modèle-vue-contrôleur? Hm. Je suppose que cela peut fall-- si nous ne faisons pas habituellement tiens à écraser en ce que paradigme, mais je suppose que je dirais, OK, donc JavaScript effectivement va permettre nous recueillons des données, interpréter les données, faire réellement les choses sérieuses avec les données. De cette façon, il est très contrôle-like. Mais il va aussi nous permettre de afficher des choses et des choses d'impression. De cette façon, il est très semblable à vue. Oui. Donc, il est un peu comme dans PHP où il peut être à la fois de type. Bonne question. autre chose? Tout droit, impressionnant. Déplacement à droite le long. Voyons un exemple de la façon dont nous pouvons utiliser JavaScript dans l'un de nos programmes de Web. Donc, je vais considérer cette index.html avec un tas de HTML. Et la chose que je vous voulez se concentrer sur est cette balise script. Et cela dit, OK, je veux courir une certaine JavaScript et voici où il vit. Il vit dans hello.js. Et beaucoup comme CSS, nous pourrions mettre JavaScript dans le code HTML. Pourquoi pourrait-on vouloir séparer dehors? Oui. Audience: Plus facile à réécrire? HANNAH BLUMBERG: Ouais. Il est plus facile à utiliser partout différentes pages Web. Il garde les choses plus propre. Il est une bonne pratique. Impressionnant. Bonne réponse. Si bon, si cela va pour être notre index.html. Et puis ici est notre minuscule fichier JavaScript. Et tout ce qu'il dit est alerte Bonjour tout le monde. Donc ce qui arrive est quand cette page renders-- donc si vous allez à tout site web ce est-- tout ce qui va se passer est qu'il va dire, OK, je suis va exécuter ce code JavaScript. Et ce code JavaScript dit juste Bonjour alerte monde. Donc, je vais obtenir ce sympathique petit pop-up. Bien? Voilà un peu comme notre première JavaScript programme, notre Bonjour tout le monde. Regardons un peu plus sur ce que la syntaxe du langage JavaScript ressemble. Et précisément, nous allons comparer à C et PHP, que nous avons vu auparavant. En JavaScript, nous allons avoir var utilisateur, le nom de la variable, puis sa valeur réelle. Et nous ne spécifions pas un type, tout simplement comme en PHP, mais très contrairement à C. Ainsi, par exemple, si nous voulions pour mémoriser la valeur 50, en C, nous aurions à dire, hey, C, je veux un entier, Je vais l'appeler i, et sa valeur est 50. En PHP, il est un peu plus facile. Nous disons, hey, je veux une variable appelé i et sa valeur est 50. Très similaire, en JavaScript, nous dis hey, je veux une variable appelée i, sa valeur est 50. Chaque fois que je l'utilise ultérieure i, je ne dois écrire var. Il est juste que je partir de ce point. De la même manière, en C, où une fois que nous disons int i, nous utilisons simplement i. Bien? D'accord. Passant à boucles, Heureusement, ces presque regarde exactly-- Je pense qu'ils sont exactement la même chose que ce que boucles vont ressembler dans quelque chose comme C où votre boucle for va avoir trois parts-- une initialisation, une condition, et une mise à jour. Une boucle while, il ressemble exactement la même. Nous donnons juste une condition. Et une boucle Do While, encore, exactement les mêmes. Nous donnons une condition. Disons que je voulais pour itérer over-- Je voulais faire quelque chose de cinq fois. En C, nous pourrions écrire init i est égal à 0. i est inférieur à cinq, i ++. La seule différence, en JavaScript, au lieu de dire int i est égal à 0, nous disons var i est égal à 0. Beau. Voilà la seule différence. Vous avez des questions sur tout cela? Oui. Auditoire: Alors, en PHP, il est le même chose, sauf, mais comme une variable? Ou était-ce un exemple var? HANNAH BLUMBERG: Ouais. Donc, en PHP, il va d'être un signe de dollar. Donc ça va $ i égaux 0, $ i est inférieure à 5, $ i ++. Grande question. Maintenant parlons les déclarations de fonction. En C, quand nous avons déclaré un fonction, nous lui avons donné un nom et nous lui avons donné quelques paramètres. Et au début, nous avons écrit le type. En JavaScript, tout ce que nous avoir à faire est d'écrire la fonction de mot-clé qui dit, hey, JavaScript, Je suis sur le point de définir une fonction. Dans ce cas, il a le nom somme. Et il prend deux arguments, x et y. Notez que nous ne nous soucions pas sur les types de x et y. Et tout comme C, nous avons ce mot-clé retour, afin que nous puissions faire quelque chose comme retour x et y. Et maintenant, une fois que nous avons écrit cette première fonction, on peut utiliser somme nulle. Et cela est tout à fait bien. Une chose vraiment cool JavaScript qui est très différente de C est que les fonctions peuvent être traités comme des valeurs. Donc, nous pouvons faire quelque chose comme ici où je suppose que je couvre cette up-- Je couvrais la somme var part-- et nous venons de le dire fonction xy est égal return x + y. Voilà ce que l'on appellerait une fonction anonyme. Il est une fonction sans nom. Considérant que cette fonction dit somme, bla, bla, bla, ce serait juste dire fonction. Mais maintenant, même si je dois cette fonction anonyme, cette fonction est vraiment juste une valeur. Nous pouvons le traiter comme une valeur. Donc, nous pouvons enregistrer dans une variable de la même façon, nous pourrions stocker 50 dans une variable. Donc nous pouvons dire, OK, je veux un variable, il est appelé somme, et il est de cette fonction. Donc, ces deux choses sont en réalité va faire exactement la même chose, mais la syntaxe est un peu différent et une sorte de note d'amusement. Oui. Auditoire: Alors, vous pourriez appeler un fonction qui était anonyme en disant, somme supports 2, 5? HANNAH BLUMBERG: Ouais. Vous pouvez appeler cette anonyme fonction de la même façon. Vous feriez somme (2, 5) ;. Ce serait tout à fait bien. Si je ne fais var somme égale fonction, si je viens de supprimer this-- Je sais qu'il est sur ma main, mais je prétends supprimé puis this-- cette fonction est une sorte de juste disparu. Vous ne pouvez jamais utiliser à nouveau parce que vous ne disposez pas d'un nom pour lui. Il est difficile de se référer à quelque chose vous ne savez pas comment l'appeler. Bonne question. Oui. AUDIENCE: Pouvez-vous référencer somme d'autres lieux avec la valeur de x + y? HANNAH BLUMBERG: Pouvez-vous somme de référence dans d'autres endroits avec la valeur x + y? Je ne suis pas entièrement sûr de ce que vous entendez. Auditoire: Alors, votre passé semi-anonyme est la fonction somme est égale à cette fonction anonyme, de sorte que la somme est maintenant une variable que vous can-- HANNAH BLUMBERG: Droit. Donc somme est la variable, mais il est actually-- si la somme est une variable dont valeur est la fonction. Il est donc une fonction, qui est une sorte de une chose bizarre pour envelopper autour de votre tête puisque nous avons joué avec C et vous ne pouvez pas le faire en C. Mais maintenant, nous pouvons appeler le résumé même façon que nous pourrions appeler somme ici. AUDIENCE: OK. HANNAH BLUMBERG: Ouais. Bonne question. Oui. Auditoire: Alors, nous ne l'utilisons prototypes en PHP ou JavaScript? HANNAH BLUMBERG: Non, nous ne pas avoir besoin d'utiliser des prototypes, en particulier en JavaScript. Donc, une mauvaise pratique chose que je suis allez dire que vous ne devriez pas faire est que vous ne devez écrire var i = 50. Vous pouvez tout simplement commencer à faire i = 50. Et serait juste faire i une variable globale. Il est très mauvaise pratique ne dis jamais explicitement var i, mais il est quelque chose que vous pouvez faire. L'interprète est pas va te crier dessus. JavaScript est assez similaire, tu peux faire ce que tu veux. Oh, désolé. Il ya deux. Dans les pantalon orange. Aller de l'avant. AUDIENCE: Non, vous allez d'abord. AUDIENCE: Non, je disais juste Je ne dois ma main. D'ACCORD. Donc, si vous deviez appeler cette première fois, maintenant résumer, nous appelons cela de la même façon, X, Y, comme à chaque fois? HANNAH BLUMBERG: Ouais. Donc, ces deux essentiellement faire la même chose. Public: Et quel est l'avantage de l'utilisation de l'un ou l'autre? HANNAH BLUMBERG: Aucun avantage de l'utilisation de l'un ou l'autre. Je voulais juste vous montrer deux différents éléments de la syntaxe. Un grand nombre de fois où anonyme fonctions ont un objectif est si l'argument à l'autre fonction doit être une fonction. Et nous verrons que, dans juste une seconde avec l'Ajax. Donc, si cela n'a pas de sens, le stocker dans le dos de votre tête. Voilà où un anonyme fonction peut être utile car il est pas vraiment la peine lui donnant un nom, puisque nous sommes juste aller à l'utiliser une fois. Oui. Audience: Si X et Y modification ultérieure sur, résumera changer ainsi? HANNAH BLUMBERG: Si X et Y changement plus tard, résumera changer ainsi? Donc, cela est fait, je penser quelque chose qui est, à nouveau, il se sent juste très différent de C. Cette valeur est pas un. Il est pas 5. Il est juste la fonction elle-même. Donc dès que vous lui donnez des paramètres, alors vous aurez en fait de calculer une valeur. MARIA ZLATKOVA: Et puis vous pouvez appeler la fonction et l'utiliser pour obtenir une certaine valeur. HANNAH BLUMBERG: Droit. Exactement. Oui. AUDIENCE: Donc, si vous venez de stocker dans la variable, comme var x est égal à la somme de deux values-- HANNAH BLUMBERG: Ouais. Ainsi, vous pouvez juste faire var sum est égal à la somme des deux valeurs. Oui. D'autres questions? Oui. AUDIENCE: Mais ne serait-ce que confondre somme et la somme? Comme si vous appelez votre variable somme, appelleriez-vous la fonction somme? HANNAH BLUMBERG: MM. Mm. Si vous avez fait quelque chose comme, somme égale à la somme de 2, 5? AUDIENCE: Ouais. HANNAH BLUMBERG: Je crois que écraserait la valeur de somme. Donc, une autre intéressante chose à propos de JavaScript est ce que une seule variable peut prendre sur un tas de différents types. Mauvaise pratique. Vous ne devriez pas faire quelque chose comme ce que vous venez de dire. Mais en C, si i est mis égale à un nombre entier, nous savons qu'il est jamais va devenir une chaîne. Cela ne veut pas le cas en JavaScript. Ouais, bonne question. autre chose? D'accord. Faire tout juste à temps. Garder aller. D'accord. Si nous regardons un tableau en JavaScript, voici un exemple rapide d'un tableau de chaînes. Et les tableaux peuvent se développer dynamiquement. Ils ne possèdent pas de taille fixe de la même façon ce qu'ils font en C. Nous pouvons accéder à la éléments avec seulement les crochets. Cela ressemble beaucoup PHP et beaucoup comme C, où nous pouvons dire, dans ce cas, si je voulais le mot JavaScript, je le ferais ne arr crochets avec un 0, 1, 2. Et puis si vous vous souvenez en C lorsque nous voulu pour obtenir la longueur d'un tableau, il était vraiment ennuyeux. Mais en JavaScript, super facile. Tout ce que nous faisons, .length. Lui donne les longueurs. C'est tout. AUDIENCE: qui est simple. HANNAH BLUMBERG: Ouais, en fait votre vie beaucoup plus facile. OK, object-- pas là. Objets en JavaScript sensation un peu comme dans structs C et des tableaux associatifs en PHP. Donc, ce que nous avons vu une beaucoup de JSON est qui synonyme de JavaScript Object Notation. Et il est essentiellement un moyen de structurer nos données. Voyons un exemple, probablement le plus facile. Alors, voici un exemple d'un objet qui stocke la classe, CS50. Et quand je dis classe, je veux dire bien sûr, pas like-- ouais, le cours, CS50. Et vous verrez que tout dans l'objet va être contenue accolades. Et nous commençons à associer les noms de champs ou les touches avec les différentes valeurs. Ainsi, vous pouvez commencer à voir comment ce genre de se sent comme un tableau associatif en PHP. Donc, nous allons associer le terrain ou le nom de la clé, bien sûr, avec la chaîne, CS50. Nous allons avoir un instructeur. Nous allons avoir TF. Nous allons avoir des psets nombre et nous allons avoir enregistré. Et une chose à noter est fraîche tous ces choses ont différents types, et voilà tout à fait bien. Il est très bien pour un objet, en fait, il est probablement prévu pour un objet d'avoir une combinaison de chaînes et le nombre et les booléens et les tableaux et tout ce que vous pourriez voulez avoir l'intérieur de votre objet. Et noter que ces vont être les noms ou les touches, et ensuite nous régler égalité avec un peu côlon. Public: Que signifie exactement JSON signifie? HANNAH BLUMBERG: Qu'est exactement JSON ne signifie? JSON se trouve juste pour JavaScript Object Notation. Il est juste un moyen de mise en forme. Oui. Il est un moyen de mise en forme de nos données. En C, il est structures. En PHP, il est des tableaux associatifs. En JavaScript, nous avons des objets. Auditoire: Alors CS50 est un objet? HANNAH BLUMBERG: CS50 est l'objet dans ce cas. Maintenant, comment pouvons-nous réellement l'accès ces champs ou modifier ces champs. Par exemple, supposons que nous avons décidé que vous vouliez un de moins pset ce semestre. Au lieu de neuf, nous sommes juste d'avoir huit. Comment pourrions-nous changer cela? Oh, mauvaise façon. Il ya deux façons que nous pouvons faire cela. Le numéro un est avec le point notation et numéro deux est avec la notation de crochet. Ainsi, par exemple, si je voulu changer ou d'accès le domaine des psets dans notre objet CS50, ce que je voudrais faire est de CS50.psets, si le nom du point d'objet le nom du champ ou de la clé. Très similaire, il est exactement équivalent à faire CS50, puis dans des crochets, des psets. Bien? Oui. Auditoire: Alors, est JSON JavaScript techniquement encore, même si dans les psets nous séparer sur [inaudible]? HANNAH BLUMBERG: Bien sûr. Donc la question est, sont JavaScript et JSON équivalent? Donc, JSON est la notation, essentiellement la façon dont nous écrivons un objet à partir de JavaScript. Donc, ils ne sont pas exactement les mêmes. Je dirais JavaScript, il sont des objets en JavaScript. JSON prend ces objets et les imprime et les affiche ou les stocke dans une belle façon. Donc, JSON est pas une programmation la langue de la façon dont JavaScript est. Il est juste pour la notation nos objets en JavaScript. Oui. Auditoire: Alors, qu'est-ce [Inaudible] compléter? HANNAH BLUMBERG: Bien sûr. Donc, cela ne fait rien. Ceci est juste un moyen d'accéder. Donc, disons que nous voulions changer le nombre de séries de problèmes neuf à huit. Ce que nous faisons est de faire quelque chose comme CS50.psets = 8 ;. Ouais, bonne question. Ceci est juste pour vous montrer la syntaxe. N'a pas réellement faire quelque chose d'utile. Des questions? Déplacement à droite le long. Alors regardons un exemple rapide de la façon dont JavaScript fonctionne parce que je vous ai dit qu'il fait toutes ces choses cool et nous permet de modifier les pages Web. Disons effectivement le voir en action. Alors, prenez, par exemple, ce fichier HTML. Et la chose que je veux que vous concentrez sur ce cette balise particulière, qui est un bouton, avec id search_button. Il est juste sur la page. Alors maintenant, nous allons voir ce que nous pouvons réellement faire. Eh bien, supposons que lorsque vous cliquez sur ce bouton, nous voulons faire une alert-- vous avez cliqué sur le bouton. Voyons comment nous pouvons le faire. Donc ce window.onload-- est pas quelque chose que vous avez vu en classe, donc ne sera pas besoin de le savoir pour le quiz. Mais cela dit, fondamentalement, OK, appel cette fonction lorsque les charges de fenêtres. Voilà donc tout type de code de configuration. Ne vous inquiétez pas tellement à ce sujet. Ce que je veux de vous concentrer sur est ici. Nous disons var searchButton égale document.getElementById search_button. Donc, comme vous pouvez le deviner, ce qu'il fait est-il dit, OK, allez trouver l'élément avec ID search_button. Et maintenant que nous avons élément réel et je suis va stocker dans un searchButton variable. Et maintenant, nous pouvons réellement utiliser cet élément et le modifier, ou accéder à ses valeurs, des choses comme ça. Nous pouvons réellement commencer à engager avec la page Web. Donc ici, je dire, OK, maintenant que je dois ce bouton, quand il est cliqué, appeler cette fonction anonyme. Donc, cela est où anonyme fonctions deviennent utiles. Et qu'est-ce que la fonction faire? Eh bien, il appelle tout cela fonction d'alerte et il dit, vous avez cliqué sur le bouton Rechercher. Alors qu'est-ce qui va se passer si je vais à chaque fois cette HTML vit et je cliquez sur le bouton, Je vais prendre un peu de fantaisie alerte qui dit que vous avez cliqué sur le bouton. Donc, les choses se concentrer sur ici-- document.getElementById obtient un HTML particulier élément avec l'ID donné. Et maintenant, nous pouvons mettre en ce qui devrait se produire lorsque cet élément particulier est cliqué. PUBLIC: Nous devons mettre tout cela en? HANNAH BLUMBERG: Désolé? AUDIENCE: Devons-nous coder physiquement tout cela? HANNAH BLUMBERG: Devons-nous coder physiquement tout cela? Oui. Est pas ce genre de gênant? Cela fait beaucoup de code. AUDIENCE: Vous pouvez importer quelque chose. HANNAH BLUMBERG: Droit. Nous pourrions utiliser quelque chose. Et dans particular-- oh, il est me disant que je dois enseigner section. En particulier, nous allons utiliser la bibliothèque jQuery, parce que était vraiment longue et vraiment ennuyeux et je veux être en mesure de le simplifier et de le rendre plus court et plus facile à écrire. Donc, jQuery est une bibliothèque JavaScript. Donc JavaScript est la programmation la langue; jQuery est une bibliothèque. Et il fait un tas de choses plus faciles. Il permet de changer et d'aller partout un document HTML beaucoup plus facile. Il rend les événements de manipulation plus facile. Il rend l'animation plus facile et cela rend plus facile l'Ajax. Alors débutons deux ces choses dès maintenant. Excuse moi. Avant que nous faisons, une syntaxe de base. Ceci est ce que la plupart des appels à la bibliothèque jQuery ressemble. Nous utilisons ce dollar sign-- aucun signe de connexion à PHP, inconvenient-- juste le nom d'un sélecteur, point, puis une action. Voyons donc un peu des exemples concrets de ce que. Donc, cela est en fait le même Code de la diapositive de l'événement. Donc, cette longue, devient chose laide cela, chose beaucoup plus gentille petite. Essayons donc de le décomposer. Ce dit, OK, jQuery-- ce dollar sign-- jQuery, me trouver la fenêtre. Voilà donc le sélecteur. Quand il charge, appeler cette fonction. Voilà donc tout à l'intérieur. D'ACCORD. Jusqu'ici, tout va bien? D'accord. Maintenant, jQuery, me trouver le chose avec ID search_button. Et ce que l'on clique dessus, appeler cette fonction. Et puis cette fonction de exactement le même. Il suffit de faire un peu d'alerte, vous avez cliqué sur le bouton Rechercher. Donc, il est vraiment agréable. Il condense réellement et simplifie notre code. Comment ai-je sais que il est ID search_button et non pas comme search_button de classe? AUDIENCE: hashtag? HANNAH BLUMBERG: Ouais. Ce symbole de hachage, il est juste comme CSS. Alors rappelez-vous, avec CSS, lorsque nous voulu choisir quelque chose par ID, nous avons utilisé le signe dièse. Et quand nous avons voulu sélectionner quelque chose par classe, nous utilisons le point. Formidable. Donner un sens? Donc, jQuery est censé juste rendre notre vie plus facile. Oui. Auditoire: Alors, je suis un peu confus quant à la façon dont la fonction anonyme fonctionne. Avez-vous le nom de cette anonymouse fonction, fonctionner? Comment est-il appelé? HANNAH BLUMBERG: Bien sûr. Donc la fonction est juste un mot clé qui dit, je suis sur le point de définir une fonction. AUDIENCE: Oh, OK. HANNAH BLUMBERG: OK? Et puis nous passons comme un l'argument to-- prenons ce One-- interne à la fonction de clic. Donc oui, de sorte que la fonction, cette fonction anonyme, devient un argument réel. Alors rappelez-vous en JavaScript, nous peut traiter fonctions en tant que valeurs. AUDIENCE: Oh, OK. HANNAH BLUMBERG: Ouais. I like that "oh." Agréable. D'autres questions? Temps? MARIA ZLATKOVA: Bon. Bien. HANNAH BLUMBERG: Awesome. Certains jQuery utile rapide. Je ne vais pas aller à travers tout cela. Ces diapositives seront jusqu'à en ligne un peu plus tard, de sorte que vous pouvez vérifier il un peu plus tard. Mais fondamentalement, le général tendance se maintient, où nous disons, OK, bon, jQuery, voici mon sélecteur et ensuite ici est une action. Et vous pouvez faire des choses comme l'accès la valeur d'un formulaire, accéder à certaines HTML, contrôle ce qui se passe lorsque l'utilisateur soumet un formulaire, des choses comme ça. Oui. Auditoire: Alors, dans le examen, nous allons avoir besoin de de connaître beaucoup de la documentation jQuery. Donc, étant donné que nous Copiez / collez le jQuery la documentation à notre feuille de triche, Où est la ligne tracée? Comme combien avons-nous besoin de savoir? HANNAH BLUMBERG: Bonne question. La question est essentiellement étant donné que vous ne peut pas accéder à la documentation jQuery lors de l'essai, Combien devriez-vous connaître? Nous ne nous attendons pas que vous veniez avec une fonction aléatoire que nous vous attendre à Google. Les choses qui sont un jeu équitable sont je le ferais dire juste genre de la syntaxe générale, être en mesure de sélectionner par ID et par class-- si juste comme CSS. Et puis les fonctions réelles themself, nous allons probablement vous dire. Oui. Auditoire: Alors, lorsque vous sélectionnez par classe signifierait dot. HANNAH BLUMBERG: Oui, exactement. Bien. Lorsque vous sélectionnez par classe, ça va à point au lieu du signe dièse. Oui. Public: Seriez-vous aller sur la différence entre la sélection par ID et par classe? HANNAH BLUMBERG: Bien sûr. La différence entre la sélection ID et la sélection par classe. Alors que Maria a déclaré un peu plus tôt, il y ne peut être un élément HTML avec un ID donné, alors que la classe, elle nous permet de regrouper un tas de différents éléments, donc les choses qui sont liées, mais pas exactement la même. Cela répond à la question? Impressionnant. Oui. Public: Que faire si vous avez plusieurs des choses qui sont dans la même classe? HANNAH BLUMBERG: Qu'arrive-t- si vous avez plusieurs choses qui sont de la même classe? Ainsi, par exemple, si nous sommes simplement en utilisant JavaScript pur, nous ferions quelque chose comme document.getElementsByClass. Et puis ce que cela fait effectivement est retourne un tableau d'éléments. Et vous devez soit parcourir eux ou trouver celui que vous voulez. Il ne va pas de donner vous un seul élément. Il va vous donner un réseau d'éléments. Grande question. autre chose? Impressionnant. Donc je pense que si vous êtes familier avec toute jQuery que vous avez vu dans le pset, vous devriez être bon d'aller. Question? Oh non. Je dois vraiment enseigner. Détendez-vous. Ça va être beau. Je vais y arriver. Parlons de l'Ajax. Alors Ajax va être a-- bien, nous allons commencer avec ce qu'il représente. Il est un acronyme. Il signifie Asynchronous JavaScript et XML. Et XML est essentiellement va être [Inaudible] avec un type de nos données. Mais nous ne sommes pas réellement utilisé XML. Au lieu de cela, nous utilisons simplement JSON. Donc, fondamentalement, il est certains data-- asynchrone, JavaScript, et les données, dans ce cas, JSON. Et notre but, comme nous l'avons mentionné un peu plus tôt, est d'être en mesure de faire une demande, cette demande a faire sa chose dans le fond, mais continuent faisons tout nous avons l'intention de faire. Et puis, quand cette information est prêt, puis nous incorporons. Voyons donc ce que cela ressemble réellement. Et cela, vous devriez être un peu familier de pset8, celui que vous venez tourné dans. Alors, voici une jQuery valide fonction qui nous pourrions veulent savoir about-- ce signe de dollar. Donc, il dit la fonction jQuery, .getJson. Et ce que cette fonction fait est-il prend une URL et certains parameters-- donc je pense que dans le cas de pset8, il était comme, l'URL est articles.php et la paramètres ETE GO = un code postal. Et il dit, OK, faire une demande à cette URL avec les paramètres donnés. Et cela se produit juste. Quand il se termine, il est soit va réussir ou il va à l'échec. Donc, cela est l'équivalent de l'appel Rob et lui demander de faire quelque chose. Et puis quand il rappelle, il est soit allez dire que je suis fait ou je échoué. Donc, dans le cas où vous êtes fait, vous dites, OK, je suis fait. Et puis vous appelez cette fonction. Dans ce cas, ça va être un fonction qui prend quelques informations. Celui que nous occupons habituellement environ est des données, les données que nous avons effectivement rentrés comme un résultat de l'appel .getJSON. Et vous pouvez faire quelque chose avec elle. Donc, dans le cas de pset8, nous avons affiché comme une liste. Fail va être une fonction qui est appelée, si la demande échoue pour quelque raison que ce soit. Et dans le cas de pset8, nous venons CONSOLE.LOG il. Vous avez des questions à ce sujet? Oui. AUDIENCE: Pouvons-nous utiliser simplement la fonction thêta la place de la fonction, textStatus, jqHXR. HANNAH BLUMBERG: Bien sûr. Donc oui, je pense que dans le jeu de processeurs, nous venons de voir les données de la fonction. Donc, il est tout simplement the-- oui, OK. Voilà ce que nous avons vu dans le pset. Voilà tout à fait bien. Ce ne sont que si vous vouliez de sortir plus d'informations, ce sont les choses qui vous pourriez obtenir de .getJSON. Bonne question. autre chose? Oui. Auditoire: Alors .getJSON est Ajax? HANNAH BLUMBERG: OK. Donc ceci est le genre de partie difficile. Il est une fonction qui permet jQuery que vous fassiez des appels asynchrones. Et ces appels asynchrones, qui est ce que nous avons référons à l'Ajax. Oui. Cela m'a pris un temps très long à séparer quand je étais étudiant. AUDIENCE: Pouvez-vous répéter? HANNAH BLUMBERG: Ouais. Puis-je le dire? Cette fonction .getJSON, elle est une fonction jQuery. Et il va faire un appel asynchrone. Et ces appels asynchrones, nous avons été référant à ceux que l'Ajax. D'autres questions? Nous avons seulement quelques minutes. Et Maria va conclure avec la sécurité et puis nous allons à peu près fait. MARIA ZLATKOVA: Awesome, OK. Donc, ce est-- il suffit de prendre un couple de secondes à regarder par-dessus cela. Et ce ne sont pas quelque chose de grand. Et quelqu'un peut me dire pourquoi? Qu'est-ce qui se passe dans foo et peut pouvait potentiellement aboutir à quelque chose de mauvais, et ce qui est ce qu'on appelle? Oui. Audience: Si l'argument qui est est passé dans plus de 12 caractères, elle pourrait déborder. MARIA ZLATKOVA: Droit. Parfait. Quel est son nom? Vous venez de mentionner qu'elle. AUDIENCE: débordement de tampon. MARIA ZLATKOVA: Yup, débordement de tampon. Donc ceci est quelque chose que nous qualifier de débordement de tampon. Et nous voyons que l'intérieur de foo, nous avons défini notre buffer, c, avec une taille de 12. Toutefois, dans le principal, nous ne faisons pas vérifier en aucune façon à tous si la argv1-- de sorte que était le deuxième argument. Nous ne vérifions pas si le la taille de celui-ci est approprié. Donc, si nous avions une utilisateur particulier malveillants qui a mis en quelque argument qui a été plus de 12, et ensuite potentiellement au-delà des limites de ce que l'argument, eu un peu de code exécutable qu'il essayait de faire quelque chose de mal Avec ça; puis ceci, ce qui se passerait, l'emporterait sur le retour adresse de la fonction foo, provoquant la fonction quand retour à exécuter ce code. Et puis de mauvaises choses peuvent se produire. Cela fait-il sens pour tout le monde? Et comment pouvons-nous protéger contre cela? Aucune suggestion? En fait, à l'intérieur de potentiellement foo, comment pouvons-nous assurez-vous que cela ne peut arriver? Audience: Si la taille 12 est dépassée, vous allouer de la mémoire supplémentaire? MARIA ZLATKOVA: Suggestion est, allouer la mémoire supplémentaire de la taille dépassée. En fait, nous pouvons faire quelque chose d'un beaucoup plus simple que cela aussi. Nous pouvons simplement obtenir la longueur de chaîne de l'argument qui est entré, vérifier si elle est inférieure supérieure ou égale à 12-- qui est ce que nous voulons être parce que nous ne voulons pas à dépasser les limites de notre tampon. Et puis, si elle ne le fait pas, nous peut travailler avec l'argument. Et puis, si elle le fait, nous voulons effectivement Yello potentiellement à l'utilisateur. Mais cela est la façon dont nous le ferions. Oui. Public: Pourriez-vous expliquer memcpy réel rapide? MARIA ZLATKOVA: Oh, désolé. Oui. Memcpy prend les est-- désolé, OK. Memcpy prend tout ce qui est en bar, quoi est passé sur foo comme argument de ligne de commande. Donc ça va prendre argv1. Argv1 est appelé bar ici. Donc, il va prendre la barre et il va copier dans c. AUDIENCE: OK. MARIA ZLATKOVA: Et ça va copy-- le troisième argument se réfère simplement à combien ça va copier dans c. AUDIENCE: Ah. Donc la copie de celui-ci tous alors. MARIA ZLATKOVA: Ouais, il est la copie de tout cela. Oui. Tout d'abord, nous nous assurons que la barre est pas égale à NULL, car il est un pointeur. Alors nous obtenons la longueur de chaîne de la barre. Nous nous assurons qu'il est inférieur ou égal à 12. Et puis parce que nous avons fait en sorte, nous pouvons réellement memcpy et être sûr que ce est OK. Des questions? Formidable. Je voudrais poser deux questions vraies ou fausses. Quelqu'un peut me dire tout de suite si elles sont vraies ou fausses? Oui, il est faux. Exactement. Tous les deux sont faux. Donc, en utilisant un seul mot de passe est jamais vraiment une bonne idée parce que si quelqu'un sait votre mot de passe, ils peuvent tout simplement accéder à tous vos autres comptes. Et puis les icônes ne font rien pour assurer la sécurité. Nous devrions regardent généralement pour HTTPS au lieu de HTTP et l'URL. Et certains autres types de attaques que nous avons mentionnés, que David a mentionné dans des conférences, des attaques par injection SQL. Nous avons déjà vu que si nous l'don't-- CS50 fonction de requête fait en sorte que SQL des attaques par injection peuvent ne pas se produire. Mais si nous ne utilisons CS50, entre guillemets "dans la requête" nous aurions à faire en sorte que la entrée de l'utilisateur ne sont pas en fait quelque SQL requête qui va provoquer tout nos tables soient abandonnées ou quelque chose de mal arriver avec notre base de données. Détournement de session est un autre type d'attaque qui se produit quand une mauvaise personne utilise la session de quelque victime ID d'accéder aux informations de connexion. Donc, un exemple très triviale qui est comme si nous avons un ordinateur public, alors la mauvaise personne se connecte puis ils ont des cookies qui sont enregistrés. Et les cookies ne changent pas pour la session. Ensuite, nous avons la victime aller puis vous connecter au site. Les cookies ne changent pas pour un certain session. Et puis la victime se connecte à le site Web et puis quitte. Et puis, la personne qui remonte peut ensuite utiliser toujours leur ID de session accéder à leurs informations. Voilà donc un exemple de comment cela pourrait se produire. Et puis, je ne voudrais pas trop vous inquiéter sur le code ou quelque chose de spécifique comme celui qui pourrait provoquer ce, mais avoir une sorte de idée de ce que les variables sont impliquées dans ce. Et puis manipuler tête données est un autre type d'attaque qui a David a parlé. Et il se réfère juste ce qui peut arriver quand la réponse, le HTTP réponse à l'intérieur de notre tête est pas aseptisé correctement. Et l'un des fields-- par exemple, si quelqu'un écrase l'un des en-tête valeurs contiennent rien de plus que ce qu'ils devraient contain-- et effectivement contenir, par exemple, un 200 OK code d'état, puis ils pourraient faire malveillants choses quand ils ne sont pas censés. Mais je ne voudrais pas trop vous inquiéter beaucoup sur le code spécifique qui pourrait provoquer ce, juste une sorte de compréhension les choses de haut niveau comme ça. Je pense que tout cela est que nous avons à couvrir. Incroyable. Quelqu'un at-il des questions sur toute des choses que nous avons couvert? Oui. Auditoire: Alors, une seule sorte de question plus logistique. Le contenu est principalement axé sur les choses après quizz 1? MARIA ZLATKOVA: Donc, question est, est le contenu porté principalement sur des choses après quizz 1? Donc, l'accent est mis sur après Quiz 1, à l'exception que nous devons nous concentrer sur les choses en pset5 et beaucoup de structures de données que nous avons couvert. Et nous ne pouvons pas dire que nous ne peut ignorer quelque chose avant que parce qu'il construit sur elle ainsi. Donc se concentrer sur ce que, plus le matériel de pset5 comme notamment liés listes, piles, files d'attente, et tout que Hannah est allé. HANNAH BLUMBERG: Droit. Ouais, nous sommes allés sur toute la C trucs au tout début, très rapidement. Mais assurez-vous de revoir cela. Revenez en arrière et regarder le quiz 0 avis. Un couple de notes plus logistiques, juste alors que nous avons votre attention. Nous allons avoir des heures de bureau à la fois le lundi et le mardi soir. Ils vont être en MD 119. Cela est d'autant sur le site, de sorte si vous ne pas, pas de soucis entendez. MARIA ZLATKOVA ouverture: 8:30 à 11h00. HANNAH BLUMBERG: Ouais, de 8h30 à 11h00. Nous serons là. Nous serons là pour répondre aux questions. Il est assez froid et amusant. Les gars, vous pouvez poser toutes les questions que vous avez sur quizz 1. Et quizz 1 est sur Mercredi, alors bonne chance. Si vous avez des questions, peut-être Venez discuter avec nous ici en tête-à-un. Bien. Merci beaucoup. MARIA ZLATKOVA: Merci beaucoup, les gars. AUDIENCE: Yay. [APPLAUDISSEMENTS]