R.J. AQUINO: Vamos a empezar. Así que esta es la prueba 1. Aquí hay alguna información de alto nivel. La página Acerca de la prueba es en este URL, ya no CS50.net, aunque eso seguirá funcionando. Es CS50.harvard.edu/quizzes/2013/1. Es el gran Sobre la página, que le dice dónde y cuándo, es decir, el próximo miércoles en un montón de habitaciones. Y el próximo miércoles, I significar dos días a partir de ahora. Toda esta información está ahí. Pero es acumulativo. 

Así todo, desde la primera mitad del año es potencialmente en el cuestionario, porque no se puede hacer realmente avanzada cosas en C sin si las condiciones y para los bucles y similares. Pero habrá un énfasis en la material cubierto desde Cuestionario 0, empezando con las estructuras y Archivo I / O. Es típicamente más desafiante que Cuestionario 0. La puntuación media es normalmente inferior. Estudia mucho. 

Mientras que usted está estudiando, asegúrese de utilizar CS50/discuss para enviar sus preguntas y leer las preguntas de otras personas. Así que si usted no tiene alguna pregunta, entrar y leer preguntas de sus amigos. Probablemente son buenas preguntas. Y tomar los exámenes de práctica. Hemos estado dando pruebas de siete u ocho años. Todos están en línea. Preguntas futuros son similares a viejas preguntas. Así es como las hacemos. 

El cuestionario no existe todavía. Ninguno de nosotros ha visto. Pero va a ser similar concursos anteriores. Para esta sesión de revisión, esto no es una lista exhaustiva de temas. Usted no puede asistir a esta y luego perfectamente preparado para el examen. De lo contrario, no sería que gran parte de un concurso. Y esto tampoco es necesariamente todo lo que necesita saber acerca de cualquier determinado tema. Es la intención de quedar expuesto a las cosas hemos cubierto, te recuerdan lo que cubierta, y la forma en que lo cubrimos. Pero usted tendrá que ir más allá y más profundo cuando se estudia a una doble comprobación que usted sabe todo acerca de cualquier propuesta tema y que haya rellenado todas las esquinas que eran cubierto en clase. 

Las notas del examen te dicen que ir a la notas escribano, videos de conferencias de relojes. Esa es una buena manera de asegurarse de que ha cubierto todas sus bases. Así que para empezar, cuando hice estas diapositivas, traté de poner donde encontré información. Así que para archivo de E / S, por ejemplo, Semana 7, Del lunes la conferencia, y el publicado Sección 6 y de problemas todos tienen información acerca de File I / O. He hecho esto para cada tema. Así que esas diapositivas de título puede ser útil para usted. 

Así que aquí tenemos File I / O. Recuerde, en Problemas 5, se utilizó fopen, fclose, fwrite, fread y fseek. Habiendo recuperado 30ish archivos JPEG y haber cambiado el tamaño y metido con mapas de bits, debe ser bastante familiar con estas funciones y cómo funcionan. Si ya no está familiarizado, Definitivamente revisarlos. Y asegúrese de que entiende lo que los diferentes argumentos son, cuando se utilizan. 

Pero los errores relacionados con archivos comunes se le puede pedir sobre - bueno, si te has olvidado de comprobar si fopen efectivamente trabajadas antes de ir a modificar un archivo. Eso podría ser malo. Si te has olvidado de un archivo fclose que ha fopened, eso es similar a una pérdida de memoria. Eso es muy malo. Y olvidar para comprobar si has alcanzado el final del archivo antes de empezar a escribir a la misma. 

Así que si usted dice, hey, estoy en el final del archivo. Dame 5 bytes más. Bueno, eso probablemente no va a trabajar de la manera que usted espera. Eso es realmente para File I / O, porque hicimos tanto de ella con fijó el problema. Así que si usted entendió lo que estaba pasando en problemas 5, recuerde los bitmats y los archivos JPEG, entonces usted está probablemente todos fijado para File I / O. Si eso es un poco difusa, sin duda revisar ese problema establecer y el material asociado. 

Las estructuras fueron el tema que estaban en el línea entre el 0 y el Cuestionario Cuestionario 1. No bastante hacer el corte para la Prueba 0. Así que sin duda estarán en Cuestionario 1, semana 7, el lunes. ¿Qué es una estructura? Aquí se muestra una estructura. Es como un nuevo tipo. Es como un contenedor para múltiples campos. 

En este caso, hemos declarado una estructura estudiante que tiene dos campos - una cadena que estamos llamando el nombre y un int que estamos llamando a la edad. Así que cuando me pase alrededor alumnos o yo modificar los estudiantes, voy a ser capaz de tener acceso a su nombre y su edad. Echemos un vistazo a algo de código para eso. Aquí vemos que he declarado un estudiante s, al igual que Declaro cualquier variable - int x, int y, et cetera. 

Así es estudiante s. Él comienza con nada en sus campos. Así que vamos a establecer. Establezca los campos de una estructura con puntos. Así que lo que he dicho aquí que s.name = RJ. Y s.age = 21. También puede actualizar los campos la misma forma en que actualiza el valor de una variable. Así que quiero cambiar mi nombre de RJ con no hay periodos de R.J. significado el forma correcta. Sería s.name = RJ, la misma como lo dijimos en un principio. Y entonces usted puede tener acceso a ellos. 

Así que les hemos preparado. Nosotros les hemos puesto al día. También puede acceder a ellos en la misma manera. Así que aquí, estoy imprimiendo R.J. Tiene 21 años. Y estoy acceso a esos valores con s.name y s.age. Así que eso es el acceso a las estructuras con la notación de puntos. Sí, la pregunta? 

AUDIENCIA: ¿Hay alguna razón en el diapositiva anterior que usted no puso estudiante en la línea superior, como typedef struct estudiante y luego estudiante al final? 

R.J. AQUINO: Así que la pregunta era, en esta diapositiva, hemos visto típicamente typedef struct nodo y luego el campos de la estructura y entonces el nodo palabra. Y ¿cómo es que aquí no lo dije, typedef struct estudiante y luego la campos de la estructura y luego los estudiantes? La razón es que yo no necesito acceder a ella en el interior de la estructura. Así que está bien dejarlo sin nombre. Yo sólo puedo dejarlo como una estructura anónima. 

La razón por la que lo hacemos por listas enlazadas y cosas es porque dentro de lo que necesita para hacer referencia a una estrella nodos struct. Así que la estructura tiene que tener un nombre, para que pueda acceder a ella más tarde. Es un detalle menor. Pero vas a ver típicamente typedef struct llaves si no es necesario el nombre y typedef struct algún nombre seguido de llaves si se quiere Necesitará el nombre. Así que esa es una buena pregunta. 

Y en ese punto, tenemos la tendencia a modificar estructuras y pasar alrededor de las estructuras de referencia, no por valor. Así que sólo tendremos que pasar alrededor de punteros a estructuras en lugar de pasar todo el Las estructuras ellos mismos. Así que está muy a menudo va a ser utilizando, en este caso, el estudiante o * struct nodo * o nodo * en lugar a los estudiantes o nodos. Así que aquí, lo he dicho, está bien, la variable ptr va a ser la dirección del s. Va a ser el puntero al estudiante R.J. 

Para que podamos llegar a esos campos la misma medida que cualquier cosa. En primer lugar, ID de referencia del puntero para obtener la estructura. Eso es * ptr y luego un punto y luego edad. Así que para tener acceso al campo, y he actualizado que ahora a 22, porque, seamos por ejemplo, que era mi cumpleaños. Hay una sintaxis abreviada usando la flecha aquí. Edad Flecha Así ptr es sólo el mismo que * ptr.age. Ahora, eso es algo que tendrá que memorizar y recordar. 

La usaste mucho en pset6, el conjunto de procesadores ortografía. Pero esto es en realidad lo que está pasando de debajo del capó. Se dereferencing el puntero y luego acceder a ella. Consulta? 

AUDIENCIA: [inaudible]. 

R.J. AQUINO: ¿Entonces por qué estamos usando punteros como estructuras en lugar de la Las estructuras ellos mismos? La razón sería si estás pasando una estructura a una función, es probable que que desee pasar en torno a sólo el 4 o así bytes que representan el puntero, como oposición a la potencialmente 30 o 40 bytes que son la estructura. Así que pasa algo a una función es más fácil cuando la cosa es menor en corto. Consulta? 

AUDIENCIA: Es posible que haya mencionado esto en el principio, pero hay otras diapositivas arriba en [inaudible]? 

R.J. AQUINO: Estas diapositivas serán después de la sesión de revisión. Vamos a publicar en el sitio web. Así que seguir adelante y pasar ligeramente más rápido, vamos a hablar acerca de los datos estructuras. Hay un montón. Hemos cubierto un montón de ellos. Esto es lo que debe entender acerca de la estructura de datos. 

Usted realmente debe entender en un alto ¿Qué nivel de cada estructura es. ¿Puede explicar en Inglés a su amigo que no ha tenido CS50 cómo estamos organizando nuestros datos y por qué lo había estar usando algo de esta manera? Eso es cosa de una sola. Cosa de dos, entender la aplicación. Así que entender cómo usar estas cosas en C. Y vamos a ir sobre esto. 

Y entonces lo tres se conocen la tiempos de funcionamiento y las limitaciones de la diversas estructuras que estés utilizando. Así que entender por qué se utilizaría un la tabla de hash en lugar de una matriz. Entender qué tan rápido, en promedio, acceso a una tabla hash es. Entender lo que las operaciones son rápidas en lista enlazada, pero lento en matrices y viceversa. Así que para entender eso, usted tendrá que entender la notación Big-O sólo para saber cómo hablar de estos tipo de cosas. Y vamos a hablar de eso. 

Así que lo primero, listas enlazadas. Aquí está una foto de alto nivel de una lista enlazada. Se demuestra esto en clase. Normalmente tenemos 10 personas de pie en el escenario. Pero tenemos una serie de nodos donde cada nodo tiene un valor y un puntero a su valor siguiente. Así que para llegar de un nodo a otro, que solo decir, me da el siguiente nodo. Usted tiene ese nodo. Dame el siguiente nodo. Usted tiene ese nodo. Dame el nodo siguiente y así sucesivamente hasta que no hay izquierda nodo. 

Así que seguir hablando de en un alto nivel. Es muy fácil de insertar cosas en una lista enlazada. Si no se preocupan por el orden, que sólo puede caer justo al principio. Esa es la constante de tiempo. Pero es difícil encontrar un valor. Si usted está tratando de preguntar, Son las siete de mi lista? Tienes que ir a través de cada valor individual. ¿Es esto siete? ¿Es esto siete? ¿Es esto siete? ¿Es esto siete? Una y otra vez. Y es O (n). Así que la hora de estudiar para el examen, Comparar esto con matrices. 

¿Está bien? Se apagaron las luces tenues. Aceptar. ¿Cuándo es mejor una lista enlazada? Cuando es un arreglo mejor? Así que echemos un vistazo a algo de código. Aquí es un nodo potencial. Es una estructura. Tiene un int n, que será nuestro valor. Y tiene un nodo struct * siguiente, que es nuestra puntero al siguiente nodo. Así que aquí, podemos ver que nos pasó haber puesto un int en nuestro nodo. Pero si esto fuera una lista enlazada de caracteres estrellas o una lista enlazada de carrozas, que totalmente podría hacer eso también. 

Recuerde que en pset6, probablemente tuvo una lista enlazada de estrellas CHAR o sólo arrays static char. Vamos a ver aquí en una operación. Así que queremos insertar un nuevo n en nuestra lista enlazada. Empezamos con un puntero cabeza que es un puntero a este nodo que tiene el valor de n y un lado de un puntero que puntos a este nodo es un valor de n y una siguiente de nulo, porque que es el último nodo. Así que, en aras del tiempo, lo haré poner todo el código en la pantalla. Y vamos a caminar a través de él unas pocas líneas a la vez. 

Así que aquí está el código. Espero que sea legible. Lo primero que hacemos es que malloc un nuevo nodo. Así que tiene un puntero a un nuevo nodo que no tienen absolutamente nada establecido en ella todavía. Verificamos para asegurarse de que el nuevo nodo no es nulo. De lo contrario, hay que darse por vencido. Así que después de haber comprobado que, ahora establecer los valores en el nodo. Por eso, pusimos el nuevo n en nuestro campo n. Y ponemos el siguiente puntero para apuntar a la cabeza original, por lo que podemos ahora han introducido este nodo a nuestra lista. 

Por último, tenemos el punto de jefe global a nuestro nuevo nodo, por lo que si tuviéramos que comenzar en la cabeza, estaríamos en este nuevo primer nodo en lugar de el antiguo primer nodo. Y cuando sale de esta función, el nuevo nodo de variable de ya no existe, porque era local a la función. Así que este es el estado del mundo. Nuestro jefe global apunta a nuestro nuevo primer nodo, lo que apunta a nuestra primer nodo original, donde los puntos al nodo después de eso. 

Esa fue la inserción. Espero que haya sido relativamente fácil de seguir. En caso de duda, hacer un dibujo. Así que me parece que hablar de listas enlazadas y mirando código es muy útil no. Mientras mira una foto de un vinculado lista me permite pensar, oh, tan Tengo este nodo aquí. Pero si actualizo ese puntero, termina desconectado. Y me he olvidado de donde el nodo va. Y el código sale. Y tiene varios nodos que están desconectados. Y no termina con la lista que desee. 

Así que si usted dibuja la imagen y lo hace paso a paso, con suerte, podrá ver el orden correcto de las cosas en términos de la actualización de los indicadores para asegurarse que la lista se une. Insertar es relativamente sencillo. Un uno más complicado sería inserción en una lista ordenada. Una función más complicado es eliminar y encontrar, por lo que mira a través de una lista de ver si hay algo allí. Tal vez has hecho esto pset6 cuando tiene en su tabla hash y dijiste: así, es la palabra manzana en mi lista enlazada? 

Así que es posible que ya haya hecho esto. Pero sin duda, refrescar la memoria y tratar de volver a implementar hallazgo y reimplementar borrar de una lista enlazada. Diversión nota al margen, no vinculados doblemente también listas, donde se tiene punteros que apuntan tanto hacia adelante como hacia atrás, de modo que usted puede ir a la siguiente nodo y para el nodo anterior. Y hubo una pregunta sobre el año pasado cuestionario de ese tipo, hablando listas sobre ligada doblemente. 

Ahora, eso es una estructura que eres relativamente familiarizados, ya que la mayoría de ustedes probablemente ellos utilizado en pset6. Aquí hay uno que es un poco menos familiar. Como nota al margen, creo que la prueba 1 es principalmente más duro que el Cuestionario 0, porque las cosas que estás haciendo, no han hecho lo mismo. Para ponerlo de otra forma, para la Prueba 0, hubiera escrito una gran cantidad de C. Y le preguntó sobre C. 

Para la prueba 1, vamos a preguntarle acerca de PHP y JavaScript, que se no haber escrito la mayor cantidad de. Vamos a preguntarle acerca de C-código que usted no ha escrito la mayor cantidad de, esta cosas avanzadas C. Así que definitivamente, la práctica de la que la materia hablado en la conferencia que no necesariamente hacer en el conjunto de problemas. 

Hablando de eso, usted no ha escrito una pila en un problema establecido. Pero fue en la conferencia. Aquí está la imagen de alto nivel de Pilas que mostramos todos los años. Es la pila de bandejas en el comedor Mather. A un alto nivel, las pilas son un último in, first out estructura de datos. Eso significa que usted va para poner las cosas en - 1, 3, 7, 12, 14, 0 negativo. La única cosa que no podía tener dijo - negativo 3, 0. Usted pone todas estas cosas pulg Y la última que se introdujo en el primer uno que va a salir. 

Así que hay dos operaciones - insertar y extraer. Toda la puesta en que yo era haciendo un gesto como éste son de empuje. Y luego cuando llego a agarrar algo o alcanzar en la parte superior para agarrar algo, eso es pop. Así que vamos a poner en práctica las pilas. Y nosotros les mostramos en la conferencia utilizando matrices. Pero podrías hacerlas utilizar listas enlazadas. Una pila es un conceptual de datos estructura, no como un uno específico de la implementación. 

Entonces, ¿qué sería eso? Se vería algo así como esto. Usted tendría un tamaño entero. Y usted tiene una matriz de valores que estamos llamando bandejas, porque eso es lo que era la imagen de nosotros - INT bandejas - y algo más de la capacidad máxima. Así que lo empujaría parece? Bueno, si tenemos un s pila, luego de empujar algo en s, obtendríamos el tamaño de s. Y eso sería la siguiente lugar abierto de nuestra matriz. Así que si tenemos tres cosas en nuestra pila, a continuación, las bandejas 3 sería el siguiente lugar abierto, ya que 0, 1, y 2 ya están llenos. 

Así que ponemos el valor en s.trays [s.size], el tercer lugar. Y luego incrementamos s.size decir, bueno, tuvimos tres cosas antes. Ahora, tenemos cuatro. Así que la próxima vez que presione, eres va a poner algo en 4. O la próxima vez que usted hace estallar, usted va mirar a las 3 en lugar de 4 o lo que sea. Y luego vamos a volver a la verdadera digamos, bueno, lo hemos conseguido. Esto funcionó. Como regla general, si una función que es debe retornar true o falsa siempre devuelve true, es posible que han hecho algo mal. Así funciona esto? 

Bueno, funciona muy bien para 1, y 2, y 3, y 4, y cinco. Pero digamos que llego a mi capacidad. Entonces me he encontrado con un problema, porque si el tamaño es el mismo que la capacidad, estoy ahora tratando de poner algo en un matriz en la que no tengo espacio. Así que un corto de verificación para solucionar este problema. Si s.size CAPACIDAD ==, devolverá false. De lo contrario, vamos y hacemos lo que hicimos. ¿Qué más se puede pedir acerca de las pilas? ¿Qué más debe estudiar? ¿Qué más debe practicar? 

Pues bien, la aplicación de pop. Ya lo hicimos empujón. Voy a arreglar eso. Una aplicación no matriz, donde se utiliza una lista enlazada, tal vez. Una aplicación no int. Hicimos ints aquí. Pero podría haber sido carrozas. Yo podría haber sido cadenas. Podría haber sido estrellas carac. Mira concursos anteriores para los tipos de preguntas que le hemos pedido sobre las pilas. 

Voy a decir que hemos cubierto montones alrededor lo mismo que nosotros les hemos cubierto en año pasado. Así que las preguntas del cuestionario deben ser una buena indicación. Avanzando aún más rápido, las colas. Son como las pilas. Pero son primero en entrar, primero en salir. Si usted es británico, cola de la palabra probablemente hecho un montón de sentido para usted. De lo contrario, es posible que tenga oído hablar de él como una línea. Funcionan como la línea en la tienda de Apple. La primera persona a presentarse a las 3:00 por la mañana es el primer persona para comprar su iPad. 

Así que tenemos dos operaciones - enqueue y quitar de la cola. Enqueue pone a alguien en la línea. Quitar de la cola tira de la primera persona fuera de la línea. Una vez más, podemos implementar esto con una matriz. Entonces, ¿cuál es la estructura que mostró en la conferencia? Era éste. Una vez más, los números. Una vez más, el tamaño y este nuevo frente cosa. ¿Por qué existe algo que se llama frente? Es el índice del siguiente elemento para quitar de la cola. Es sólo mantener internamente un registro de el primer hombre en aparecer, por lo que puede sacarlo cuando lo necesitamos. 

Definitivamente mirar las notas de clase y tratar de para implementar y poner en cola dequeue la hora de estudiar para el examen. Aspectos importantes en las que pensar. Envolver en torno a si la parte delantera, más la tamaño termina más grande que la capacidad. Una vez más, si su estructura está llena, usted va a tener un problema. Hash tablas que has visto antes. La mayoría de ustedes probablemente implementado estos en pset6. Es una estructura que se propone para el O (1) inserción constante de tiempo y O (1) búsqueda constante de tiempo. 

En CS50, implementamos esto como una serie de listas enlazadas. El componente clave de una tabla hash es la función hash. Por lo que convierte su entrada, digamos, una palabra del diccionario, en un número, que va a ser nuestro índice. Y vamos a utilizar ese índice en nuestra matriz. Así que aquí está una imagen poco lindo desde study.50.net. Nos tiramos todas las palabras en nuestra función hash. Y la función de dispersión nos dice dónde poner estas palabras. 

Esto es todo lo grande en la tierra donde sólo hay una palabra para cada ranura. Pero a medida que usted recuerda de pset6, hay son más palabras que las franjas horarias. Entonces, ¿qué sucede cuando se obtener una colisión? En lugar de almacenar un valor en, digamos, tabla hash 3, que almacenar una lista enlazada. Y así, en lugar de tener el melón aquí, usted tendría una lista enlazada, donde el primer nodo es el melón. Y el siguiente nodo es el gato. Y el tercer nodo es de colisión, vamos a decir, porque todas estas palabras comienzan con C. 

Así que la mayoría de ustedes lo hicieron esto para pset6. Si no hiciste una tabla hash en pset6 y que ha intentado algo así como un trie, sin duda revisar las tablas hash. Si lo hiciste en pset6, definitivamente revisar las tablas hash. Y si lo hiciste a pset6 y no lo hizo trabajar del todo bien y usted tenía un montón de problemas con él, sin duda revisar las tablas hash. Así que la lección de verdad es, sin duda revisar las tablas hash. 

La inmensa minoría de los que trató cabo trata sobre pset6. Imagen de alto nivel. Es algo como esto, donde cada nodo tiene un conjunto de niños, donde cada niño corresponde a una letra. Y cada nodo también dice, bueno, yo soy una palabra. Así que en este ejemplo, la palabra Maxwell, si se sigue la M a la A a la X-W-E-L-L y luego seguir una más. Además, disfrutarás de este símbolo, delta, que significamos en el sentido de que es una palabra. Así que Maxwell es una palabra. Estos deltas son en todo significante qué cosas son las palabras y lo que las cosas no son. 

Así que en pset6, los datos que almacena junto con cualquiera de nuestros nodos era "Yo soy un palabra. "Y lo bueno de tries se demuestran la inserción y las operaciones de búsqueda en tiempo O (longitud de una palabra). Así que para conseguir a través de Maxwell, es M-A-X-W-E-L-L. Así que siete u ocho años - No puedo contar - pasos para llegar a la final y comprobar las cosas. Así aplicación rápida aquí. Rob pasó por una vinculada enumerar en su postmortem. A fin de comprobar que fuera. Lo siento. Fue a través de un trie en su postmortem. A fin de comprobar que fuera. 

Pero, básicamente, que cada nodo tiene 27 punteros a los siguientes nodos y uno Boolean estoy yo una palabra. Echa un vistazo a postmortem de Rob como la forma en esto realmente se lleva a cabo. Nuestra estructura final, nuestros árboles y árboles binarios de búsqueda. Así que mirando estos, estos fueron cubiertos más recientemente la semana 8, el lunes. Un árbol es similar a un trie, salvo que no necesariamente tienen 27 nodos en cada punto. Y usted no tiene estos datos en cada paso que significa si el - el camino no importa. Mientras que un trie, el camino de arriba a inferior, Maxwell, era importante para nosotros. 

Sin embargo, cada nodo tiene múltiples los niños, tal vez. Tenemos un poco más de vocabulario. La raíz del árbol que está en la parte superior. Y decimos que el situado más abajo nodos que no tienen los niños son las hojas. Así como un trie, un árbol es una estructura de nodos. Un tipo común de árbol que vamos hablar es de un árbol binario, en donde cada nodo no tiene hijos o un niño o dos niños. Así que la imagen aquí no es un árbol binario, porque nodo 3 tiene tres hijos. 

Pero si tuviéramos que hacer caso omiso de ellos, el resto de que es un árbol binario, ya que demuestra la propiedad de que cada nodo tiene cero, uno o dos hijos. Entonces, ¿cómo podríamos expresar esto en código? Podríamos tener un nodo en el que cada nodo tiene un número entero dentro de ella, así como un puntero al árbol de la izquierda y un puntero al árbol en el derecho, por lo que los dos niños. ¿Cómo es esto útil? Bueno, si hacemos reglas sobre dónde estamos poner nodos, podemos hacer la búsqueda más rápida. 

Así que hay un concepto de una búsqueda binaria árbol, donde todos los nodos en la subárbol izquierdo tiene un valor menor que el nodo que estamos viendo. Y todos los nodos en el subárbol derecho tener un valor mayor que el nodo raíz. Ahora, que se parece a un montón de palabras. Voy a ponerlo en el interior de la doble citas y mostrar una imagen. Así que aquí es un ejemplo de un árbol de búsqueda binaria. Vemos que empezamos con 10. Todo a la izquierda de 10 es menor que ella. Y todo a la derecha es más grande que él. 

Pero más que eso, cada nodo el árbol expresa esta propiedad. Por lo tanto el nodo 7 tiene un 3 a la a la izquierda y 9 a la derecha. Así que todos los que son más pequeños que 10. Sin embargo, mirando sólo a los que, el 7 tiene 3 a su izquierda y 9 a la derecha. Y del mismo modo a la derecha, 15 tiene 14 a su izquierda y 50 a la derecha. Así que los tres nodos de allá, 15, 14, y 50, son también un árbol binario válido o un árbol de búsqueda binaria válida. Y todos son mayores de 10. Así que se les permita ser a la derecha allí. ¿Hay alguna pregunta? 

AUDIENCIA: ¿Cómo hacer frente al usted tiene dos sietes? 

R.J. AQUINO: Si. ¿Cómo lidiar con dos valores que son los mismos? Algunos árboles binarios de búsqueda dicen que ignorar los duplicados, porque el objetivo es sólo para decir, he visto estas cosas hasta ahora. Algunos árboles de búsqueda binarios se podría decir tener un recuento dentro del nodo. Otros podrían decir que todo lo que la izquierda es menor que o igual a. Y todo a la derecha es mayor que. 

Sólo depende de lo que el problema es que se está resolviendo. Así que en un diccionario, por ejemplo, usted no se preocupan por los duplicados. Se podría tirarlas. Pero algún otro problema que podría cuidar. 

AUDIENCIA: ¿Es posible tener un 1 a la izquierda de 15, el cual es menor que 10? 

R.J. AQUINO: No. Si el 14 aquí eran un 1, ello no ser un árbol binario de búsqueda válido, porque todo a la derecha del 10 tiene que ser más grande que él. Y vamos a ver por qué. Si en la tierra de la búsqueda mi objetivo es encontrar 14, comienzo en la raíz. Así que me veo. Aceptar. Vamos a empezar en la raíz. Mira 10. 

Bueno, 14, nuestro objetivo, es más grande que 10. Así que debe ser a la derecha. Esto es muy similar a todo el teléfono Lo del libro que hicimos, el binario buscar allí. Pero en lugar de la búsqueda binaria en una matriz, estamos binario búsqueda en este árbol. Así que todavía estamos buscando a 14. Bueno, 14 es menor que 15. Así que si está en nuestro árbol, debe estar en esta zona de aquí. Debe estar a la derecha del 10 y a la izquierda de 15. 

Y así, comprobamos este nodo. Y yay, hemos encontrado 14. Yo no voy a caminar a través de él. Pero aquí está el código. De hecho, es relativamente sencillo, porque esto es recursivo. ¿Qué podríamos pedirte que hagas en un concurso? Podríamos pedirle que escriba este código. Podríamos pedirle que mire este código y modificar el código y explicar lo que está haciendo. Sí. Consulta? 

AUDIENCIA: ¿Son estas diapositivas van a ser puesto a disposición como estaban la última vez? 

R.J. AQUINO: Si. Así que estas diapositivas definitivamente ser publicado. 

AUDIENCIA: En realidad se publiquen en este momento en la página web. David acaba de hacer eso. 

R.J. AQUINO: Los toboganes son en este momento en la página web. Probablemente voy a remendar un par de los typos me señalaron y arreglarlos. Pero hay una corriente versión en el sitio. Otros cosas que podríamos pedirte que hagas - escribir inserción. Escribir una versión iterativa del función recursiva que sólo te mostró o hablar de estas cosas, como en párrafos, en palabras, en frases. La comparación de los tiempos de ejecución y explicar lo que se desea utilizar un binario árbol de búsqueda en lugar de una la tabla de hash, por ejemplo. 

Así entender estas estructuras a un nivel muy profundo. Entender cómo escribir, cómo utilizarlos, cómo hablar de ellos. Y usted estará todo listo. Consulta? 

AUDIENCIA: Cuando se está escribiendo el árbol binario de búsqueda, ¿cómo determinar qué valor que sea como la raíz? 

R.J. AQUINO: Así que la pregunta era: ¿qué valor Cómo se hace como la raíz? Dependiendo de su código, puede tener una raíz global. Así que usted puede haber tenido probablemente en pset6 una tabla hash global. O se puede desmayar la raíz como argumento. Así que esta función de búsqueda aquí toma un argumento un nodo *. Y así lo nodo que resultan ser mirando es el que usted está tratando como su raíz cuando se pasa pulg Y estoy listo. Esos son mis diapositivas. La siguiente persona puede venir de intercambio en un ordenador portátil y micrófono. 

ROB BOWDEN: Creo que podría tener interpretado esa pregunta de manera diferente. Pero yo interpretado como, si usted tiene los números 1, 2, y 3, ¿cómo saber para hacer 2 la raíz en lugar de 1 o 3? Si hacemos 2 la raíz, entonces es muy bien 1 y 3 a la izquierda y derecha. Pero si 1 es la raíz, entonces es 1 a la superior, 2 derecha, 3 a la derecha. Así que por defecto, usted no sabe qué hacer con la raíz. Y para cualquier algoritmo que estamos esperando darle, sólo el primero que inserción sería la raíz. ¿O te gustaría darle un árbol binario que que ya existe que tiene una raíz. Pero otros algoritmos tales que existe la raíz se actualizará, por lo que si usted terminar en la situación en la que es 1, 2, 3, se actualizaría automáticamente a hacer 2 la nueva raíz, por lo que Es todavía muy bien equilibrado. 

ANGELA LI: Cool. Hey, chicos. Soy Angela. Y voy a terminar nuestro C y luego ir a algunos de nuestra web tecnologías - HTTP, HTML y CSS. Así que lo primero es búfer ataques de desbordamiento. Así que echemos un vistazo a este código. Es bastante simple. Hay una función foo. Y no se devuelve nada. Pero se necesita un puntero a una cadena llamada bar. 

Y se va a declarar este tampón, que es un carácter gama que cuenta con 12 ranuras. Y utiliza memcpy, que es sólo un función que copia de una dirección en otro. Así que esto es tratar de copiar en nuestra tampón de lo bar está señalando. Así que cualquier idea de lo que está mal con este código? 

AUDIENCIA: Si la barra es más larga que C, que se sobreponen. 

ANGELA LI: Sí, exactamente. No tenemos ninguna garantía de que la barra va a ser inferior a 12. Acabamos de hacer un número arbitrario 12. Y nos dijimos, esperemos que nuestra entrada del usuario es menor de 12 caracteres de largo. Así que en un mundo ideal, si nuestra entrada es siempre como se espera, a continuación, nos pondremos en contacto algo así como: hola. Eso es menos de 12 caracteres. Esto se lee en char c. Y entonces hacemos algo con él. En realidad no importa. 

Pero una persona con malas intenciones puede hacer algo de la misma familia, en el que nos dará todo lo bar está señalando, que va a apuntar a este enorme variedad de tan sólo de una. Y esta es la forma que más de 12. Así que va a ir hasta el final aquí abajo para que el rendimiento dirección que solía ser. Así que digamos que esta función se llama foo. Quizás foo fue llamado por algún otro función, que fue llamado por el principal. Así que cuando foo está en ejecución, es necesario saber dónde volver. 

Si foo fue llamado por alguna función llamada baz, tiene que saber que es tiene que volver a baz. Y eso es lo que la dirección del remitente aquí nos está diciendo. Pero si sobreescribirlo con otro dirección, en este caso, se trata de un representación de la dirección en el principio de este búfer, entonces lo que realmente va a suceder es que en lugar de regresar de nuevo a baz, que llama a nuestra función, es sólo va a ir a la parte delantera de este código. 

Y si esto estaba allí porque un amigo hacker malicioso vino y inyectado esto, entonces tal vez esta cantidad de A es no es realmente Atléticos. Y en realidad es sólo el código que se rompe su computadora o algo así. Así que para estar a la defensiva acerca de este tipo de cosa, tiene que asumir que nunca la entrada del usuario es un cierto cantidad de caracteres. Por ejemplo, cuando usted estaba haciendo corrector ortográfico, que le dijeron que las palabras eran sólo va a ser de 40 caracteres largo máximo. Y eso era bueno. 

Pero si no, entonces usted tendría que asegúrese de sólo lectura en el 45 caracteres a la vez. De lo contrario, es posible sobrescribir su buffer. ¿Tiene preguntas sobre eso. Sí. 

AUDIENCIA: ¿Podrías hablar un poco más sobre esto? 

ANGELA LI: Lo siento. Sí. 

AUDIENCIA: El micrófono es sólo para vídeo. Voy a tratar de proyecto. Hola, chicos. Sup? Así que vamos a repasar algunas cosas en el Biblioteca CS50, que usted ha estado usando todo el semestre, en su mayoría para obtener la entrada del usuario. Como ustedes saben, se incluye el CS50 biblioteca con sólo hacer CS50.h, que contiene todos los prototipos de la funciones que se pueden utilizar, como GetString y GetInt, y GetFloat, etcétera. Y hay esta una línea en el CS50 biblioteca que define una cadena, la cual ustedes todos sabemos a estas alturas es sólo un char *. 

Pero echemos un vistazo a cómo funciona GetString. Esta es una versión muy abreviada. Puede tirar de los archivos de biblioteca CS50 de, creo, manuals.CS50.net. Y se puede leer a través de la función real. Pero esto cubre algunos de las partes importantes. Para ello hemos creado un poco de búfer con una cierta capacidad. Y lo que hacemos es obtener un carácter a la vez de la norma n. Ahí es donde las entradas del usuario texto en la consola. 

Así que vamos a leer en un carácter, siempre y cuando no sea un nuevo línea y no es el final de archivo, que es el final de la entrada estándar. Y por cada carácter que leemos en, si ese personaje termina añadiendo para el número de caracteres que hemos leído y eso es más que nuestra capacidad, entonces lo que hacemos es simplemente redimensionar nuestra buffer de modo que es el doble de tiempo. Así que de nuevo, esto protege contra tampón ataques de desbordamiento, ya que usted lee en un carácter a la vez. Y si en algún momento usted lee en demasiadas muchos, que acaba de ampliar su buffer. Se multiplican por dos. Y entonces usted tiene más espacio. 

De lo contrario, sólo tiene que añadir un personaje para amortiguar. Y después de haber leído en todo el caracteres, se encogerá el tampón volver al tamaño normal, añadir un terminador nulo, y luego regresar. Ahora, echemos un vistazo a GetInt. Pueden ustedes leer esto? Puedo acercar un poco. No sé cómo funcionan las computadoras. No importa. No puedo acercar correctamente. 

Esto es realmente difícil. Lo siento. Vamos a mirar esto. Así que lo que hace es GetInt primero lee en una cadena de GetString, que hemos implementado antes. Y la parte más importante a tener en cuenta aquí es si este intercambio que termina la lectura es como en realidad no una cadena, entonces nos volvemos a INT_MAX representar el fracaso. ¿Por qué nos volvemos INT_MAX lugar de negativa 1 o 1? ¿Alguna idea? 

AUDIENCIA: [inaudible] 1 negativo a uno. 

ANGELA LI: Sí, exactamente. Así que usted es mucho más probable que sólo quieren a la entrada 1 o negativo 1 cuando se le solicite para un n-ésimo y cualquiera que sea Maxes n-ésimo. Es enorme. Usted probablemente no va a utilizarlo. Así que esto es como una decisión de diseño para asegurarse de que no accidentalmente devolverá un error o no regresa 1, lo que podría ser analizado como respuesta correcta. Así que si una línea no existe, volvemos INT-MAX. De lo contrario, se utiliza sscanf, que es como scanf. Pero se lee en una cadena. 

Y tenemos esta formateada cadena, que es% i% c. Y tratar de coincidir con la que lo que el usuario nos dio. Queremos que el número de cosas coincidentes que es 1, lo que significa que sólo realmente quiere para que coincida con un número entero rodeado de tal blanco espacio, tal vez no. En este caso, si se pone en algo como bar, no coincide en absoluto, porque es necesario que haya un entero desde el principio. Así que nunca se volvió sscan 0. Así que usted no devuelve eso. 

Alternativamente, si se pone en algo como 1, 2, 3, A, B, C, que partidos tanto el número entero sino también el personaje después de ella. Así sscanf devolverá 2, que tampoco es ideal. Usted no quiere que 1, 2, 3, A, B, C para ser un int válida. Así que también no funciona. Pero dicen que pones en algo así como 50. Eso coincide con el% i, lo que significa conseguirá leer en n. Y ahora, n contendrá el número 50. Y entonces usted puede devolverlo. 

De lo contrario, usted golpea Reintentar. Y entonces, sólo se va otra vez hasta se obtiene una entrada adecuada al usuario. ¿Tiene preguntas sobre eso? 

AUDIENCIA: Así que si usted fuera a imprimir el valor de la GetInt en [inaudible] sería sólo el número entero y máximo? 

ANGELA LI: Sí. Así que si usted utiliza GetInt, usted debe asumir que usted no quiere max nth a ser una entrada válida, porque te vas asumir que eso era malo. 

AUDIENCIA: Si no tuviéramos char c y alguien puso en 1, 2, 3, Sam, ¿verdad seguirá funcionando durante 1, 2, 3? 

ANGELA LI: Creo que funcionaría. Pero usted no quiere 123Sam a ser una entrada válida por un usuario. Eso no es realmente un int. Por lo tanto, no me parece justo analizarlo como un int. Aceptar. En ese caso, vamos a pasar en el Internet. Así que HTTP no es un idioma. HTTP es el conjunto de normas para la forma de enviar cosas a los clientes, ése es usted, a los servidores. Esa es la gente en la web. 

Así que HTTP es sinónimo de hipertexto Protocolo de transferencia. Es el corazón y el alma de toda la web. La parte de hipertexto solo se refiere a HTML. La transferencia es clientes como se va a enviar solicitudes de servidores, que dan respuestas. Y el protocolo es justo, ¿cómo que usted espera de un servidor se comporte? Y ¿cómo se supone que se comporten de tal manera que se puede agilizar este proceso de comunicación? 

Así que las peticiones HTTP se parecen mucho a esto. GET es el tipo de solicitud. Ustedes han visto las solicitudes GET y las peticiones POST. Ese segundo que existe, / yo, eso es sólo el URI o la dirección URL de donde se quiero ir dentro del huésped. Así que esta solicitud se pide la página, como www.facebook.com / me. Y es una solicitud GET. Y entonces este HTTP/1.1, que es sólo la versión de HTTP que está utilizando. Es casi siempre 1.1. 

Y luego hay un montón de otras cosas también. Usted puede ver estos si abrir la consola cuando se está navegar por la web. Las respuestas parecen algo de la misma familia. La parte superior es, de nuevo, la tipo de HTTP que está utilizando seguido de un código de estado. Así OK 200 es todo funcionó. Este es tu sitio. Su contenido va a seguir. Y entonces se le dirá qué tipo del contenido y otras cosas también. 

Los códigos de estado, hay unos pocos más importantes que usted debe saber. 200 OK es como de oro de todo. Todo funciona. 403 Forbidden. Esto lo que has visto si se le olvidó chmod algo correctamente. Esto significa que usted no tiene los permisos adecuados a acceder a ese en el servidor. Es como, no, usted no puede verlo. 404 significa que algo no existe. No se ha encontrado. Usted probablemente ha visto mucho de eso. 

500 Error interno del servidor suele ser como si algo salió mal en el lado del servidor. Así que cuando usted estaba implementando pset7, si tuviera errores de PHP, usted podría en realidad ir a la página y ver un manojo entero de PHP error material. Pero eso no significa que normalmente sucede, porque los sitios web realmente no quieren decirle por qué su sitio está roto. Ellos probablemente sólo devuelven un 500 Internal Server Error. 

Y luego está 418 Soy una tetera. Hay toda una historia sobre por qué eso es una cosa. Pero usted puede leer acerca de que en su propio tiempo. Hay un montón de otros códigos de estado también. Pero estos son los que usted debe saber. Así que vamos a hablar de HTML. HTML, recuerde, no es un lenguaje de programación. Es un lenguaje de marcas. Eso significa que describe el contenido. Te dice lo que parece un documento HTML similar o no es lo que parece pero la forma en que está estructurado. 

Por lo tanto, define una estructura y semántica de páginas web. Es como si, este es un párrafo. Esta es una lista ordenada. Esto es como una sección de mi página. Aquí está el título. Lo hace cosas por el estilo. No estilos a nada de eso, porque eso es lo que haces en la CSS. Y parece que una serie etiquetas de anidado. Así que para usar un ejemplo de un muy básico Página HTML, usted tiene el DOCTYPE declaración allí. 

Esta declaración DOCTYPE es diciendo que estamos usando HTML5. Entonces usted tiene la gran etiqueta HTML. Contiene una cabeza y un cuerpo. Dentro de la cabeza, usted tiene el título. Eso es lo que sucede en el título barra de su navegador. Contamos con una etiqueta de vínculo que une en una hoja de estilos externa. Y luego tenemos un script que extrae de un JavaScript externo. 

Y luego, dentro de nuestro cuerpo es en realidad lo que se muestra en la página. Tenemos un párrafo y luego un imagen dentro de ese párrafo. Esta es una foto de los gatitos. Observe que la imagen etiqueta se cierra. Así que en lugar de abrir con una imagen y luego hacer otra / imagen, sólo hay esta pequeña barra aquí, que lo cierra. Y la etiqueta de imagen también tiene esta clave atributo de valor llamado alt. Ese es el texto alternativo que sucede cuando se pasa sobre ella. 

La mayoría de los elementos HTML tienen algún valor clave cosas que usted puede dar a él, diversos personalización. Sí. 

AUDIENCIA: [inaudible]. 

ANGELA LI: Bueno, por lo que es una atributo de la etiqueta. Así que si usted estaba usando jQuery, podría hacer select image.getAttribute. Y entonces usted puede buscar obtener el atributo alt. Y se le dará gatitos. Si te acuerdas de formularios en HTML, entrada elementos tendrán atributos de nombre. Y eso es lo que PHP utiliza para enviar solicitudes cuando se envía un formulario. 

AUDIENCIA: ¿Mencionaste algo cómo si utiliza Kittens.jpg o algo que tiene los desaparecidos archivar carpetas u otros archivos? 

ANGELA LI: Sí. Así que esto es lo que se llama un familiar camino, porque yo no voy a dar que la ruta completa. Esto es como cuando en C si lo hace fopen algún archivo, si hi.txt fopen, que hi.txt se espera que sea en el mismo directorio, a menos que se dé una mayor complejo camino. 

AUDIENCIA: Así podría especificar qué carpeta [inaudible]? 

ANGELA LI: Sí. Y usted puede buscar la manera de hacer eso. Pero si quería conseguir Kittens.jpg cabo del directorio padre, que iba a hacer .. / Kittens.jpg. Sí. Lo siento. Sí. Oh hombre, se me olvidó la pregunta. ¿Cuál era la pregunta? Ah, la pregunta era, es decir, Kittens.jpg espera que esté en el mismo directorio? Y en este caso, lo es. Pero también se puede dar un cierto camino de tal manera que no tiene que ser. Bueno? 

CSS. Así CSS, como HTML, no es un lenguaje de programación. CSS es sólo una serie de reglas de estilo. Es sinónimo de Cascading Style Sheets. Y usted lo utiliza en conjunción con HTML a las páginas de estilo. Así que hay tres maneras puede incluirlo. Una manera de hacerlo es en la cabeza porción de código HTML, usted puede apenas abrir una etiqueta de estilo y luego se adhieren un poco de CSS gobierna allí. Es bastante bien. Sí. 

AUDIENCIA: ¿Podría poner los etiquetas de estilo en el medio, vamos a por ejemplo, el cuerpo y / cuerpo. Y entonces sería un estilo sólo en el cuerpo. 

ANGELA LI: Usted podría. Se va a trabajar. Pero usted no debe, porque el estilo es clase de los metadatos que debe ir en la cabeza de su documento. Administración debería realmente sólo contienen lo que en realidad va a mostrará en la página. 

AUDIENCIA: ¿Así que te pones estilo en la cabeza con el estilo de la toda la página web, ¿no? 

ANGELA LI: Sí. Así que poner el estilo aquí, estas reglas CSS se aplicará a toda la página en función de sus selectores. Así que la mejor manera de hacerlo es en cambio de tener una etiqueta de estilo en la cabeza, tienes este enlace a un estilo externo laminar que te mostré en el ejemplo anterior. Lo que esto hace es que intenta y encuentra el archivo style.css y luego la toma y los usos que a medida que el estilos de la página. Y tu style.css haría basta con ver como este. Sólo sería un montón de CSS. 

Y, por último, hay otra forma de puede incluir CSS, lo que realmente no debe hacer nunca. Es un estilo inline llamada. Y por lo que cualquier elemento HTML también puede tomar un atributo de estilo. Y entonces en ese atributo de estilo, le puedes dar reglas CSS. Así que en este caso, sea cual sea div soy define aquí, que va a tener un fondo negro y un color de texto blanco. Pero usted no debe hacer esto, porque lo que esto se pone a su estilo dentro de su HTML. 

Y sé que hemos estado hablando acerca de HTML es la estructura y CSS es el estilo. Si usted hace esto, se mezcla juntos. Y no es muy limpio. Así que no hagas eso. Utilizando un ejemplo de CSS, hasta allí, sólo tienes que seleccionar el cuerpo del HTML documental. Y somos así, todo está va a ser Comic Sans. Asimismo, no recomiendo eso. Pero se puede hacer eso. 

La segunda regla aquí, va para seleccionar el elemento en la página principal con ID. Así que cualquier elemento HTML, dije ID = Principal, me voy a dar de que un Margen de 20 píxeles y alinear todo, todo el texto, al centro. Lo último que selecciona por clase CSS. Por lo que cualquier elemento de la página que di una clase de sección, voy a hacer que sea un color de fondo de color azul claro. Sip. Eso es todo lo que tengo. Consulta? 

AUDIENCIA: ¿Qué significa el hashtag antes principal hacer? 

ANGELA LI: La pregunta es, ¿qué significa el hashtag antes do principal? En este caso, el hash en CSS significa seleccionar por ID. Así que si yo tenía algún elemento HTML, como DIVID = principal, selecciona la regla este CSS la cosa con principal ID. Y de manera similar, el período en el frente de sección es Selección por tipo CSS o seleccione por clase HTML. 

AUDIENCIA: ¿Por qué hay una cuenta antes de 6 en color de fondo? 

ANGELA LI: Sí. Entonces la pregunta es, ¿por qué hay un hash antes de la 6? Esto es diferente que la de hash. Esto significa que usted está dando un color hexadecimal. Así colores hexadecimales, esto sólo representa un color. Y te acuerdas de triples RGB cuando que hizo el conjunto de procesadores forense? Esto es similar. Los dos primeros dígitos representan la cantidad de rojo está en el color. El segundo dos representan la cantidad de verde. Y el tercero representa la cantidad de azul. Y el hash es que esto va para representar un color. 

Así que cualquier cosa a partir de 0, 0, 0, 0, 0, 0 hasta la F, F, F, F, F, F es válida. Es un poco de color válido que puede mostrar por su navegador. Consulta? 

AUDIENCIA: ¿Cuál es la diferencia entre utilizando por ID y por clase? 

ANGELA LI: La pregunta es ¿cuál es la diferencia entre los utilizando por ID y clase? Usted sólo puede tener un elemento en un Documento HTML que tiene un ID dado. Así que sólo una cosa en mi página se le permite tener mayor identificación. Así que lo utilice para esto es la cabecera. Esta es la navegación. Este es el pie de página. Las clases son diferentes, porque se puede aplicar las clases a la mayor cantidad de elementos HTML como quieras. 

Así, por ejemplo, lo hice sección de clase, porque es probable que haya más de un sección en mi página. Sólo está permitido tener la mayor cantidad elementos de la página con el mismo clase, pero sólo uno con una cierta identidad. 

AUDIENCIA: Así que el punto representa la clase? 

ANGELA LI: Sí. Un punto representa una clase. Genial. Eso es todo lo que tengo, chicos. Gracias. 

[Aplausos] 

ZAMYLA CHAN: Hola a todos. Estoy Zamyla. Voy a estar cubriendo PHP, MVC, y SQL hoy. Una gran parte del material que voy a estar cubierta va a ser más o menos nada más sacarlo de pset7. Está bien. Entonces, ¿qué es PHP? PHP significa PHP Hypertext Preprocessor. Así que, en sí mismo, es un recursiva nombre, que está muy bien. PHP es un lenguaje de script del lado del servidor, y proporciona el backend y los fundamentos lógicos de nuestra página web. 

Así Angela habló mucho sobre el código HTML y CSS que hará que la estructura de la página web. Pero lo que si usted quiere cambiar eso el contenido de forma dinámica o si varía basado en el usuario o ciertas condiciones? Ahí es donde entra en juego PHP Ahora, por lo general, PHP puede tardar unos menos líneas para poner en práctica la misma cosa en C. Esto es debido a que PHP maneja la memoria gestión para el programador, en lugar de que nosotros tengamos que malloc libre, cosas así. 

Pero ya que PHP es una interpretación idioma, por lo general, puede ejecutar un poco más lento que C, la cual es un lenguaje compilado. Debido a que estamos moviendo la programación idiomas, echemos un vistazo a cómo el sintaxis será diferente. Vamos a ser muy cuidadosos de no confundirse con esto. Así que con la sintaxis de PHP, si usted es Incorporación de tus PHP dentro de un HTML presentar o dentro de un archivo PHP. sí, que que adjuntar el código en el abierto PHP y las etiquetas PHP cerrados como siguiente, al igual que en la pantalla. 

Las variables en PHP. Cada una sola variable se iniciará con el signo $ seguido del nombre de su variable. Ahora, las variables en PHP se escriben libremente, lo que significa que no es necesario para indicar cuál es el tipo de datos es cuando usted está declararlo. Sin embargo, esto no significa que se no tienen ningún tipo en absoluto. Así que si me declaro una variable y acaba de establecer es igual a 1, y luego declaro otra variable, establezca su valor en "1" y luego otro 1,0, bueno, dependiendo del tipo de la igualdad operadores que utilizo, si yo quiero comparar en todos los tipos, entonces que van a ser iguales. Pero si yo quiero estar seguro de que el tipos son iguales, PHP puede todavía hacer que, a pesar de que no indicamos de qué tipo es cuando primero hacer el archivo. 

Ahora bien, en PHP, aunque somos conmutación de de programación idiomas de C, todavía tenemos nuestra de confianza si la condición, al igual que este. Todavía tenemos nuestros ciclos while, simplemente como este, donde usted pone en su condiciones y luego la cuerpo del bucle. Y luego también tenemos nuestro bucle for, que por lo general se parece a esto. Así que si yo quería para iterar sobre todos nueve conjuntos de procesadores y presentar y llamar a un función submitPset, entonces puedo hacer eso aquí, que ustedes todos han hecho por este punto. Felicidades, por cierto. 

Para la cámara, la gente Dicho esto, gracias. Ahora, si usted no quiere sólo tiene que utilizar este bucle, entonces PHP en realidad también ha llamado cosas bucles foreach. Así que si yo tenía un arreglo de enteros, 0 a 8, almacenada en los conjuntos de procesadores de matriz, entonces yo podría tener un bucle foreach que itera sobre todos los números en conjuntos de procesadores. Y entonces yo podría llamar a la misma funcionar en ocho ocasiones, al igual que lo hacía antes. Así que esto para cada bucle es bueno, porque usted no tiene que si usted no sabe la longitud exacta de la matriz que se haber, a continuación, utilizando este bucle foreach se hará cargo de eso por ti. 

Así que hice conjuntos de procesadores como una matriz. Echemos un vistazo a eso. Las matrices en PHP son normalmente los mismos que los que hemos tenido en C, donde puede declarar una matriz. Y aquí, puedo declarar una matriz vacía y luego construir dinámicamente utilizando índices como enteros. Así el índice 0, voy a guardar un número entero nombrado 1. En el índice 1 de mi lista, me voy para almacenar el valor 2. Y en el tercer índice pero el segundo número, que voy a almacenar el número 12. 

Ahora, esto está muy bien en ese funciona funciona bien. Pero dicen que a mí me importa lo que depara cada índice. Para mí, el índice de 0 significa que la forma en muchos gatos que tienen. Y el índice de 1 significa que la forma en muchos búhos yo tenemos. Y el siguiente significa el número de perros. Bueno, entonces es para especificar que, en lugar de tener que recordar 0 se refiere a gatos y 1 a los búhos, que pueden utilizar matrices asociativas, lo que significa que en lugar de enteros como mis índices, Puedo realmente usar cadenas. 

Así que esto es bastante útil. Y has básicamente acaba de reemplazar los números enteros con cuerdas. Y ahí lo tienen un matriz asociativa. Sí. 

AUDIENCIA: ¿Hay una razón por la que hay un guión para el segundo parte, porque mi lista tiene la matriz. 

ZAMYLA CHAN: La pregunta era, es Hay una razón por la cual hay una Destacar entre mi y la lista? No. Eso es lo que estoy nombrando mi variable. 

AUDIENCIA: En la primera line, es una palabra. 

ZAMYLA CHAN: Mis disculpas. Voy a arreglar eso. Sí. Ellos deben ser el mismo nombre de variable. Buena atrapada. Aceptar. Así que vamos a pasar a la cadena concatenación. Si quería tener dos cadenas, entonces puedo concatenar con el operador punto. Así que si tengo Milo como primer nombre y plátano como un apellido, a continuación, concatenar con el operador punto y luego poner un espacio entre hará una cadena que contiene Milo Banana, que luego puedo repetir o, más bien, imprimir. 

Hablando de eco, vamos a hablar sobre algunos útiles - ¡Uy. Lo siento. Algunas funciones de PHP útiles. Así que tenemos la - dificultades técnicas. Un segundo. Envié. Problemas de PowerPoint. Y estamos de vuelta con las funciones de PHP. Y estamos de vuelta con las funciones de PHP. 

Así que tenemos la función de exigir, en caso si se pasa un archivo, esto es que se acaba de un ejemplo de un archivo que Podría pasar pulg Luego de que se incluya el código PHP a partir de ese archivo que indico. Y va a evaluar esa pulg Luego también tenemos eco, que es un paralelo a printf. Exit es un paralelo de romper, que sale del bloque de código que usted está adentro Y a continuación, los controles vacíos si un dado variable es como nulo o cero o lo se equipara con ser vacía. Sí. 

AUDIENCIA: Para la concatenación de cadenas punto operador de uno, en PHP, es que el mismo que en JavaScript, donde se trata de utilizar el punto para la concatenación significa plus? Así que por el nombre completo, usted podría tener dólar firmar primero y luego + + durar? 

ZAMYLA CHAN: Si. Así que la pregunta era si en PHP que puede utilizar la misma concatenación de cadenas como en JavaScript con las cosas positivas. Y José a entrar en eso más adelante. Creo que tiene un tobogán en eso. En realidad, es diferente. Así que en JavaScript, es necesario utilizar el signo más para concatenar cadenas. Y en PHP, usted tiene que utilizar el operador punto. Así que son diferentes. 

Aceptar. Así que ahora que hemos cubierto todo este PHP, donde lo hace realmente ser útil? Bueno, que viene muy bien cuando nos puede combinar con nuestro HTML. Así que nuestro PHP nos dará el poder para alterar el contenido HTML de una página antes de su carga. Así sobre la base de diferentes condiciones, por lo general el usuario específico que es conectado, podemos visualizar información diferente. Linda, ¿tuvo usted alguna pregunta? 

AUDIENCIA: ¿Puede concatenar También un número entero? 

ZAMYLA CHAN: Sí, se puede. Así que la pregunta era si se puede concatenar números enteros o otra variable.s ahora, pasamos a MVC, que es un paradigma que hemos utilizado en pset7 y un montón de diseñadores web utilizan para organizar el código en los archivos en su sitio web. M significa Modelo. Y, básicamente, los archivos de modelo se ocuparán con las interacciones con la base de datos. Ver los archivos, que se relacionan con la estética de la página web. Y las asas Controlador solicitudes de los usuarios, lo analiza de datos, hace otra lógica. 

En pset7, combinamos el modelo y el controlador. Y sólo los llamamos controladores y ponerlos en el directorio público. Y los archivos de vista, que los utilizan como plantillas en el directorio de plantillas. Así que este diagrama aquí también representa Ese mismo tipo de división con el modelo y el controlador de color morado aquí a la izquierda y la vista de la derecha. Así que este es un esquema que algunos de ustedes pueden haber visto en horario de oficina o diagramas que nos dibujo como usted fueron el cálculo de su conjunto de procesadores. 

Así que aquí, en un controlador determinado, un modelo controlador, tenemos funciones que se refieren a la consulta del SQL base de datos, la ejecución de la lógica de PHP. Tal vez usted mirar hacia arriba un stock en Yahoo! Finanzas. O tal vez, simplemente le revise para ver si un usuario había presentado un formar ya antes de tener visitado su página. Y luego le hacen Un formulario aquí. Después se había presentado esa forma por el usuario, la acción que era especificada en la etiqueta HTML del formulario indicaría la página que devuelve los datos a. 

Así que toda esa información sería enviado de vuelta a su controlador. Entonces usted probablemente hacer un poco más lógica en que y tal vez ejecutar unos pocos más consultas en la base de datos SQL y entonces, finalmente, llegar a un bien sistema lleno de información que lo haría pasar en alguna otra plantilla que muestran esa información. Ahora, ¿cómo podemos empaquetamos que la información arriba? Bueno, tenemos una función llamada Render que se encontraba en el archivo functions.php en pset7, donde se pasa en el nombre de un archivo, el nombre de una plantilla. 

Y luego también se pasa en una matriz asociativa. Y para que array asociativo representa las diferentes informaciones que desea pasar pulg Ahora, ¿qué va a ser constante en estos ejemplos es que las llaves o, más bien, las teclas de la asociativo matrices, esos son lo que va a ser espera que sea constante por la plantilla, porque sabe que necesita algo que se llama mensaje o llamada nombre. Y entonces las cosas a la derecha, el valores reales, por lo que en este caso, ¿quién es un buen chico y Milo, los que van a ser los valores que están cambiando que el controlador cambia cada vez o basado en una cierta condición y pasará que pulg 

Así que aquí en plantillas, vemos que están utilizando HTML caracteres especiales, que, básicamente, sólo significa que queremos para obtener la cadena de pares que la usuario pone adentro Y queremos sustituir mensaje ahí. Así que cuando vemos en realidad el archivo, la específica información se pasa pulg Tenga en cuenta que la clave de cómo hacer obras es que las claves de la asociativo matrices, esas variables convertido nombres aquí. Y así los valores de esa clave en el array asociativo se convierte en el valor de la variable. 

Ahora, vamos a pasar a SQL. Representa Estructurado Lenguaje de consulta. Y por lo que esta es sólo una programación lenguaje diseñado para la gestión de bases de datos. Y fue muy útil para nosotros en nuestra página web de finanzas pset7. En esencia, es sólo una manera fácil de rastrear y administrar los objetos y tablas y vincularlos entre sí. Ahora, piense en su base de datos SQL básicamente como un archivo de Excel, quizás, con varias hojas con pestañas. 

Así, puedes tener varias tablas, quizás, que unidas entre sí. Y al igual que Excel, tenemos una gran cantidad de la funcionalidad que queremos. Por ejemplo, podemos seleccionar ciertas filas. Podemos insertar información. Podemos actualizar filas. Y también podemos eliminar cosas. 

El SQL seleccionar las obras mediante la selección de filas o una fila de columnas especificado desde un base de datos que coincidan con un determinado criterios que usted indique. Así que por aquí cuando veo select * from magos dónde está la casa = Ravenclaw, luego Estoy seleccionando *, lo que significa que soy seleccionar cada columna única en ese fila de la tabla de los magos, pero sólo si la columna de la casa es igual a Ravenclaw. Ahora, esto es puro o SQL. Así que si me fui a phpMyAdmin, que es la forma específica en que utilizamos para gestionar nuestras bases de datos SQL, entonces yo podría insertar que en el sitio web de phpMyAdmin. Y eso sería ejecutar. 

Pero que en realidad queremos hacer que en el lado de PHP. Entonces, ¿cómo hacemos eso? Bueno, usamos la función de consulta, que básicamente ejecuta esa consulta SQL. El uso de? como marcador de posición, podemos pasar en cierta valores a nuestra cadena que nos desea reemplazar. Así que tal vez estoy almacenando diferente valores en el curr_house, que representa la casa actual que yo estoy pasando. Así que puede pasar que en un marcador de posición con el signo de interrogación. Y luego voy a básicamente ejecuto el lo mismo que hice antes, excepto Ahora, estoy en PHP. 

Y consulta devolverá un matriz asociativa. Y voy a guardarlo en filas. Ahora, consulta siempre puede fallar. Tal vez la consulta SQL no pudo ejecutar porque la tabla no existe. O tal vez, no existía la columna. Algo salió mal. Bueno, en ese caso, usted querrá asegurarse de Seguro que compruebe si el consulta devuelve falso. Y eso es mediante el uso de la triple es igual a la operación allí. 

Y entonces me disculpo, que es otra Función CS50, pasando en un mensaje. Y si nos fijamos en pedir disculpas, todo lo que realmente hace es hacer apology.php. Sí. 

AUDIENCIA: ¿Podría explicar lo que estrella hace entre selecto y de? 

ZAMYLA CHAN: Sí, por supuesto. Así que la estrella en el medio de selección y de significa que yo deseo seleccionar el conjunto toda la fila de mi mesa. Podría haber indicado seleccione nombre, año, casa. Y yo sólo iba a conseguir esos tres columnas en mi mesa. Pero si digo select *, entonces voy a poner todo en esa columna. Entonces me voy a ir a usted en la parte de atrás primero. 

AUDIENCIA: Así que esto es todavía en SQL, ¿verdad? ¿Es esta consulta o se trata de PHP? 

ZAMYLA CHAN: Estamos en una consulta. Así que esto es en PHP. Así, utilizando la consulta función de PHP, estamos ejecutando una consulta SQL. 

AUDIENCIA: ¿Hay algo en SQL mayúsculas y minúsculas, como seleccionar o magos o casa? 

ZAMYLA CHAN: ¿Hay algo en SQL entre mayúsculas y minúsculas? Yo creo que sí. Creo que SELECT y FROM ¿Y dónde están entre mayúsculas y minúsculas. No? 

ROB BOWDEN: Entonces, es todo lo contrario. Los nombres de columna y los medios de la tabla, todos esos son mayúsculas y minúsculas. Pero ninguna de las palabras claves de MySQL, como SELECT, FROM y WHERE, esos no son mayúsculas y minúsculas. Aceptar. Así lo contrario de lo que dije. Así que todas las palabras claves de MySQL - seleccionar, desde donde - los No se distingue entre mayúsculas y minúsculas. Pero todo lo demás es. Aceptar. Usted en la parte delantera. 

AUDIENCIA: Si Tengo $ filas en términos de más de una fila, ¿significa que es sólo se convierte en una matriz asociativa? 

ZAMYLA CHAN: Así que la pregunta era si las filas tiene más de una fila en el mismo, no que se convierta en una matriz asociativa? Así que es un conjunto de empresas asociativas matrices ya. Así que incluso si sólo hay una fila regresado, entonces usted tendría que ir a índice 0 de ese resultado. Y entonces usted tendría que primera fila. Sí, Belinda? 

AUDIENCIA: Cuando se utiliza ===, Es este el único caso? ¿O hay otros? 

ZAMYLA CHAN: Así que en este caso, === es una comparación entre los tipos. Lo siento. === Es una comparación que compara los tipos. Y entonces == compara todos los tipos. 

AUDIENCIA: ¿Puede explicar qué filas se encuentra en esta situación? ¿Es la fila de los datos? 

ZAMYLA CHAN: En la siguiente diapositiva, estoy voy a explicar lo que es filas. Así que si no te importa la celebración de fuera de eso. Y luego por la espalda? 

AUDIENCIA: Para funciones como consulta, prestar y pedir disculpas [inaudible]? 

ZAMYLA CHAN: La pregunta era si estas funciones - de consulta, se disculpan, y hacer - son comunes en PHP. Estos son los que CS50 escribió para pset7. Y Jay? 

AUDIENCIA: Cuando tenga que decir $ _SESSION, Es que sólo para los ID? O puede que haya dicho eso aquí? 

ZAMYLA CHAN: Así que la pregunta era, cuando utilizamos $ _SESSION, eso fue una específica variable global que estamos usando. Aquí esta variable se va a ser local en nuestra función. Así que estamos declarando una nueva variable. 

AUDIENCIA: ¿Cómo es pedir disculpas implementado? 

ZAMYLA CHAN: La pregunta era, cómo es disculparme implementado? Y creo que esto es en realidad una muy buenas prácticas para ustedes para entrar en la sección functions.php y mirar disculpas y ver cómo se puede tener hecho a sí mismo. Así que puede dejar eso a usted, pero sólo dice que si nos fijamos en disculpas, entonces toma el mensaje que presentó a pedir disculpas, y luego se hace que ese mensaje. ¿Alguna pregunta más? Me encanta preguntas. Así que les harán. 

AUDIENCIA: [inaudible] echo o print allí? 

ZAMYLA CHAN: La pregunta era, podríamos no sólo hemos puesto echo o print allí. Así que eso hubiera hecho algo ligeramente diferente. Eso habría impreso consulta fallado en que - así, en este momento, estamos en realidad en nuestro controlador. Así que en realidad no tenemos HTML fijado aquí. Pedir disculpas por la prestación apologize.php en realidad le redirige a apology.php. Aceptar. 

Así que ahora, vamos a abordar el pregunta de antes sobre lo que Realmente es filas. Bueno, consulta devolverá un conjunto de filas. Y cada fila se representa por una matriz asociativa. Así que si yo he ejecutado alguna consulta SQL y He almacenado el resultado en filas, entonces utilizando un bucle foreach, entonces la matriz nombre es el primero en llegar - filas. Y luego voy a llamar cada fila hay $ row. 

Así iteración en eso, puedo entonces acceder a la columna el nombre de la fila dada, columna de año, y la columna casa. Tenga en cuenta que yo no habría sido capaz de hacer esto con las filas, ya que el índice filas nombre no existe. Filas es sólo un conjunto de matrices asociativas. Así que hay dos niveles de allí. Una vez que tenga el conjunto de filas, usted tiene que entrar en eso. Y entonces usted puede tener acceso a las columnas. ¿Eso es claro? Sí, en frente? 

AUDIENCIA: [inaudible] abrir soportes para [inaudible]? 

ZAMYLA CHAN: Perdón? 

AUDIENCIA: Los soportes abiertos. 

ZAMYLA CHAN: Estas aquí? Eso es lo que me permite incluir esa variable. Sí. 

AUDIENCIA: Antes de imprimir, es usted imprimir en el código HTML? 

ZAMYLA CHAN: Si. Cuando imprimo, esto aquí es el interior mi plantilla ahora, para mi punto de vista del método de MVC. Así que estoy imprimiendo en el HTML. 

AUDIENCIA: Así que si nos fuimos al desarrollador herramientas después de la ejecución de este, podríamos que en realidad en el código? 

ZAMYLA CHAN: Esa es una gran pregunta, sí. Así que si usted entró en las herramientas de desarrollo Firefox con Firebug o Chrome, entonces sí, usted podría ver el código HTML específico. Así que no mostraría $ row ["Nombre"]. Esto mostraría que sea nombre está en esa fila. 

AUDIENCIA: Sólo una cuestión general, lo que se tr y td define como? ¿Por qué habría que [inaudible]? 

ZAMYLA CHAN: tr fila Tabla, tabla a continuación td columna. Aceptar. 

AUDIENCIA: Sí, es datos de la tabla. 

ZAMYLA CHAN: datos de la tabla. Sí. 

AUDIENCIA: Es una fila en la que el fila se trata como una columna? 

ZAMYLA CHAN: Lo siento. ¿Puede repetir eso? 

AUDIENCIA: ¿Cómo visualizar filas? 

ZAMYLA CHAN: ¿Cómo visualizar filas en qué tipo de forma? ¿Estás hablando de estos filas de aquí o de las filas tr? 

AUDIENCIA: Las filas. 

ZAMYLA CHAN: Estas filas aquí? Me imagino esto como Ejecuto mi consulta. Y dice, bien, tengo ya sea de 0 a n cantidad de filas que coinciden con los criterios que había consultado. Así que tengo un número de filas. Así filas, las filas, tiendas $ cada uno una de las filas de una matriz. Así que incluso si es sólo uno de ellos, es todavía una serie de filas que coinciden con ella. 

Así pues, por ejemplo, este es similar a cuando usted descabellada la memoria caché de los usuarios. Y los criterios allí era donde ID es igual al ID de sesión. Hay realmente sólo una fila que podría coincidir con eso. Pero aún filas acabamos de regresar de una fila. Así que si tienes que ir a filas, el índice 0, caché de índice para realmente llegar a su caché. 

AUDIENCIA: ¿Es la función de impresión en eco de la misma cosa? 

ZAMYLA CHAN: Si. Sí. Imprimir un eco de la misma. 

AUDIENCIA: Es el bucle foreach la única forma de índice en filas? 

ZAMYLA CHAN: Es un bucle foreach la única manera de que pueda iterar por las filas? No. También puede utilizar un bucle for, siempre que usted sabe la longitud de la matriz de la fila. 

AUDIENCIA: ¿Puede acceder a él utilizando una fila como [inaudible]? 

ZAMYLA CHAN: Así no se puede acceder a él sólo usar fila si usted no tiene un bucle foreach siempre que no se ha declarado fila. Sí. Sí, en el blanco. 

AUDIENCIA: Entonces, ¿qué tr y td hace? 

ZAMYLA CHAN: Así que tr y td son etiquetas HTML. TR indica el comienzo de una fila de tabla. Y cada TD indica un columna de datos de la tabla nueva. 

AUDIENCIA: Para una imagen visual de lo que una fila es como, imagínense el SQL, cómo que tienen una fila. [Inaudible]. 

ZAMYLA CHAN: Si. Eso es un gran punto. Puedes visualizar filas como se acaba de como en una tabla de Excel, sólo la lista de las filas. Aceptar. Está bien. Así que ahora que hemos repasado seleccione, si no hay más preguntas, vamos a ir a insertar. Así que si yo quería insertar en algunos tabla e inserte determinada columna valores, yo podría meterme en Ravenclaw en el año 7. Pero a veces puede haber duplicado valores, como vimos en pset7 cuando fueron actualizando nuestro portafolio. 

Así que en este caso, queremos que se utilizan en DUPLICATE KEY UPDATE, para que no lo hacemos almacenar múltiples filas con el mismo valorar sino actualizarlo. Entonces en realidad tenemos la actualización, que no es un inserto. Es sólo una actualización, donde se actualiza en un cierto mesa con un dado criterios y luego, finalmente, eliminar, que hace una cosa muy similar. 

AUDIENCIA: ¿Podría brevemente repasar la copia de la llave? 

ZAMYLA CHAN: Si. En esencia aquí, tengo INSERT INTO Gringotts, es, galeones, estos valores. Pero Identificación, presumiblemente, es una clave única valor establecido en la tabla de MySQL. Así que si ya he dicho ID de configurar, entonces no puedo insertar una nueva fila. Así que si no existe ya, entonces tengo que actualizarlo. En el centro en el blanco. 

AUDIENCIA: Así insertar, actualizar, eliminar, y selección, son los disponibles localmente [inaudible]? 

ZAMYLA CHAN: Entonces inserte, actualización, eliminación y seleccionar son todas las consultas SQL. Así que cuando usted está utilizando SQL, tendrás los disponibles. 

AUDIENCIA: Volver a los últimos concursos - había una pregunta que trataba de si usted tenía una mesa y quiso insertar resultados de las pruebas en uno y se inserta su nombre, así que no te deja [Inaudible] puntuación de la prueba de su amigo. ¿Cómo hacer eso con inserción? 

ZAMYLA CHAN: Así que la pregunta era sobre una pregunta anterior de mitad de período. No estoy al tanto de los cuales uno que es en estos momentos. Así que tal vez después, si quieres venir y mostrarme, entonces yo puedo sin duda le dará consejos. Pero hablando de cosas de inserción, como teniendo la calificación de alguien cuando no debe, vamos a hablar de Los ataques de inyección SQL. Así que un ataque de inyección SQL es esencialmente donde alguien toma ventaja de la baja seguridad de la camino que está tomando en los datos. 

Así que aquí, al igual que en las finanzas CS50, cuando ha entrado como podemos entrar en un nombre de usuario en el formulario de acceso, el primer cuadro de texto y a continuación, introduzca una contraseña. Tal vez nuestro código PHP puede tener un aspecto algo como esto, donde $ usuario es el nombre de usuario y contraseña de los datos después es la contraseña de post-data. Y luego pues sólo ejecutamos nuestra consulta, por ejemplo, OK, bueno, nuestra consulta se va a seleccionar de nuestros usuarios, en donde el nombre de usuario es la uno que se sometieron. Y la contraseña es la contraseña, lo que significa que las contraseñas coinciden. 

Ahora, ¿qué pasaría si en lugar de realmente la presentación de una contraseña real, al igual que 12345 y adivinando púa que dice contraseña y que intenta cortar su cuenta, ¿qué pasaría si en lugar presentaron este. Podrían escribir tal vez adivinar una contraseña. Y luego iban a terminar la cita a continuación, escriba o 1 = 1. Eso sería pasearse directamente en el SQL consultar a ver algo como esto. Seleccione entre los usuarios donde nombre de usuario = dientes y contraseña iguales lirio o 1 = 1. 

Así que, o la contraseña de cuenta ser correcta o 1 = 1, que siempre es cierto. Así que en este caso, básicamente, un usuario puede tomar ventaja de esto y sólo tienes que entrar sí mismos y truco la cuenta de alguien. Así que por eso queremos evitar alguien tiene que hacer esto. Pero por suerte, la función de consulta por pasando los marcadores de posición se llevará cargo de esto para usted. Además, por lo general va nunca quiere que presentar efectivamente las contraseñas a sí mismos. Es por eso que con hash o cifrado en las finanzas CS50. 

AUDIENCIA: El cuestionario pasado habló sobre las cadenas de escape de MySQL. ¿Tenemos que preocuparnos por eso? 

ZAMYLA CHAN: Esa es una buena pregunta. Las cadenas de escape de MySQL es sin duda un la función que se utilizó en nuestra consulta. Pero sin duda mirar en eso. Yo diría que eso es un juego justo para saber que lo que se necesita para llamar a ese funcionar en una cuerda. Sí, Belinda? 

AUDIENCIA: ¿Cómo sabes cuándo es comillas simples o dobles? Y también, me siento como en la conferencia que mencionado algo acerca de no tener la [inaudible] o algo o el segunda comilla simple al final. Creo que él señaló en la conferencia que que se supone que tienen apóstrofe 1 y luego no tener apóstrofes o algo así. 

AUDIENCIA: [inaudible]. 

AUDIENCIA: La cosa es el último single cita allí en ese segundo cuadro no debería estar allí. [Inaudible] Porque cuando usted toma ese último single Citando a cabo y que cumplan estas para el contenido donde la clave es, si usted tiene que consulta, hay una sola cita en el final ya. Usted quiere usar esa comilla simple como la que se enfrenta el uno [Inaudible]. Entonces, ¿qué es en realidad en ese texto caja no debe tener eso. 

ZAMYLA CHAN: Voy a cambiar eso. Aceptar. Si no hay preguntas, entonces lo voy a hacer pasarlo por alto a José hablar acerca de JavaScript, etcétera. 

[Aplausos] 

JOSÉ ONG: ¿Así que se están ejecutando un poco atrás. Así que si usted tiene que dejar, eso está bien. Pero le pedimos que mantenga sus cabezas hacia abajo si estás en el medio, por lo que no bloquee la cámara y utiliza la puerta de atrás si es necesario. Yo soy José, por cierto. Hola. Prueba, prueba. Dan, es tan bueno? Genial. 

Así que el video también se publicará en línea para aquellos que tiene que irse ahora. Awkward. Aceptar. Así revisión del cuestionario. Este es un gato. Ahora, JavaScript, lo que tal vez no sea aww como para algunos de ustedes. Aceptar. Así que eso es lo primero, recuerdan desde Zamyla. Recuerda que PHP es ejecutar en el servidor. Y muchas veces, ustedes escribieron bucles en PHP para imprimir HTML, ¿verdad? Así que una vez que se ejecute el código, que Salida HTML que imprima se envía al usuario. Y una vez que eso sucede, no más de PHP puede ejecutarse, a menos que vuelva a cargar la página, de Por supuesto, que reexecutes el PHP. Pero una vez que imprimas que HTML, usted no puede ir a ninguna parte. 

Así que el HTML se envía a través para el usuario, que es el navegador por aquí, donde Milo está usando la computadora. Y tan bien, hay varias cosas una vez que enviamos HTML para el usuario. A veces queremos hacer algo como al hacer clic en algo, queremos cajas de alerta para que aparezca, ese tipo de interacciones, como cuando se pulsa el clave, al hacer clic en algo en el página, quiero que algo suceda. Bueno, no se puede volver a ejecutar PHP código una vez que el HTML se establece. Entonces, ¿cómo hacer esto? 

Se introduce un nuevo lenguaje llamado JavaScript, que se ejecuta en el navegador que le permite hacer las cosas a HTML después de recibir ellos desde el servidor. Y es por eso que lo llamamos un lado del cliente lenguaje de programación. Trabaja en su ordenador - el cliente. ¿Una pregunta sobre que tan lejos? Ese paradigma tiene sentido para la gente? Aceptar. Bueno. Está bien. Así que lo primero a tener en cuenta Se JavaScript no es PHP. 

Ellos tienen una sintaxis diferente, que vamos a entrar en. Y tienen usos muy diferentes. JavaScript, de nuevo, para su navegador, para el cliente. Server se ejecuta en algún lugar de otra persona ordenador que envía información a usted, ¿verdad? Así que si le pedimos que escribir código PHP en una pregunta de examen, no escriba JavaScript y viceversa. Usted acaba de perder puntos, y no va a estar en lo cierto. 

Así que vamos a entrar en algunos diferencias de sintaxis - JavaScript en la izquierda y PHP a la derecha. La primera cosa que usted notará con JavaScript declaramos las variables con la palabra clave var - V-A-R. PHP utiliza el signo de dólar, como Zamyla discutido anteriormente. Si desea declarar un asociativa matriz, vemos la sintaxis familiar en el lado derecho con PHP. En el lado izquierdo, en lugar utiliza llaves. Y luego están sus llaves a la izquierda. Entonces usted tiene un colon. Y entonces usted tiene los valores que desee. 

Así que esta es la forma en que lo haría en PHP en el lado derecho con que segundo línea que comienza en Milo. Y así es como lo harías en la lado izquierdo de JavaScript si desea lo que llamamos un objeto. Y los objetos en JavaScript son sólo matrices asociativas. Así que si quieres tener acceso a los campos, en PHP utiliza esta sintaxis soporte. Y de esta manera, se puede reasignar este campo propietario a Lauren. 

Bueno, en JavaScript, si uno quiere acceso a un campo y cambiarlo, usted puede utilizar la sintaxis con punto. También puede utilizar la sintaxis de soporte. Pero no se puede utilizar el dot sintaxis en PHP. Eso no funcionará. Sólo funciona en PHP. Y, por último, para imprimir las cosas al consola, utilice console.log, que ustedes utilizan una gran cantidad de pset8. Puede console.log eso. 

Si desea imprimir una matriz en PHP, usted tiene que utilizar la impresión r. Y en el lado derecho, se ve Hachís concatenación de cadenas de allá. Alguien le preguntó antes. Yo uso un plus en JavaScript. Si quiero algo concatenar en PHP, yo uso el punto. Estos son diferentes. Si estás escribiendo código PHP, no utilice un plus. Si estás escribiendo JavaScript código, no escriba un punto. Será equivocado. Y estarás triste. 

Así que las diferencias de sintaxis. Conozca a su sintaxis, porque si tiene que escribir una pregunta y utiliza la sintaxis Del idioma equivocado, no va a funcionar. Y va a estar mal. Así que vamos a hablar un poco de control diferencias de flujo, cómo lo usa bucles en cada uno de ellos. Zamyla fue por arriba del lado derecho. Las cosas en el lado derecho debe estar familiarizado. Veamos en el lado izquierdo. 

Cuando se utiliza para n bucle en JavaScript, la variable de bucle, var i de allá, lazo sobre las claves de la matriz. Así que usted vea el nombre, la casa, y el papel. Si console.log i, recibo nombre, casa, y el papel. Esas son las claves. En JavaScript, un bucle foreach va en los valores de esta matriz. Entonces te das cuenta que ambos son i. Pero aquí en el lado de PHP, se imprime a Milo, CS50, y la mascota. Esos son los valores en PHP. 

Así que estos son cómo estos dos son diferentes en los diferentes idiomas. Así que si usted está usando un foreach loop, no asuma que se le da las llaves. Y si usted está usando un lazo para n, no lo hagas asuma que le da los valores. ¿Esto tiene sentido hasta ahora? La siguiente diapositiva se va a mostrar cómo se puede acceder a todo lo contrario en cada uno de ellos. 

Bueno, si usted tiene la llave en JavaScript y desea que el valor de salida, que acaba de índice en la matriz con eso. Entonces Milo de i le conseguirá lo usted quiere - los valores. Hay una sintaxis diferente en PHP. Si realmente quieres saberlo, no lo sé pensamos que hemos mostramos a usted todavía. Pero si usted está interesado, puede utilizar esta sintaxis adicional a la derecha lado que en realidad le permitirá obtener la llaves en PHP cuando se está utilizando un bucle foreach. Así que un poco de trivia si usted está interesado. 

Así que eso es sólo para demostrar la diferencias entre estos dos bucles. No los mezcle hasta cuando estás programar una pregunta. ¿Una pregunta sobre eso. Genial. Está bien. JavaScript objetos. Hablé acerca de ellos. Son como matrices asociativas. La única cosa que me gustaría que tenga en cuenta aquí es que un valor en un asociativa matriz puede ser cualquier cosa en JavaScript. 

Incluso puede ser una función, como allá. Tengo una función que es un valor de una clave. Y si quiero llamar a esa función, Acabo de acceder a la corteza. Y entonces me puse entre paréntesis después de eso. Y eso funciona. Así que ¿alguna pregunta? No? Aceptar. Bueno. JavaScript, como PHP, está vagamente escrito. ¿Qué significa eso? 

Se tiene tipos. Pero cuando se declara una JavaScript variable, se dice var i. Usted no lo dice. Eso no es nada. Usted acaba de decir que es una variable. Y luego JavaScript se encargará de la tipos bajo el capó para usted. Podemos convertir libremente entre tipos debido a esto. Así que empieza como una serie en este caso. Y luego tengo una cadena. Y añado yo a ella. Y yo reasignar de nuevo en i. 

Así que en esa primera línea, i es el número. En la segunda línea, ahora se convierte en un cadena después de hacer la reasignación. Y aquí, sólo estoy concatenando ese número en la cadena. Así que ya ves que a pesar de que yo era un entero en la primera parte, es una especie de como ser convertido a un cadena y luego se añade en esa cadena hola. Y eso es lo que quiero decir por la tipificación suelto. Eso es que permite convertir entre tipos muy fácilmente. Y no lanza advertencias a usted como C hace. 

Así que ahora contiene hola 123 a la cadena. Siguiente. También podemos comparar libremente entre los tipos. Así que si usted sólo tiene que utilizar ==, mucho como en PHP, JavaScript hace una cosa similar. La cadena 123 es el mismo que el número 123 cuando se utiliza igual doble. Cuando se utiliza iguales triples, también quiere asegurarse de que el tipo es el mismo. Así que, ya que es una cadena y que es un número, a pesar de que ambos son 123, cuando se utiliza el triple iguales, se obtiene falsa. En el doble es igual caso, se obtiene cierto, porque igual doble no lo hace preocuparse por el tipo. Iguales triples se preocupa por el tipo. ¿Preguntas? Aceptar. 

Y otra cosa sobre JavaScript está alcance es una especie de mundial a menos que esté en una función. Y funciona de la misma manera en PHP realidad. Así que vamos a ir a través de este ejemplo. Me puse i 999. Y después de entrar en este bucle. Así que si estoy imprimiendo i en el presente para bucle, espero 0, 1, 2, 3, 4. Llego a i = 4. Incrementa i ahora a 5 en el final del bucle para. Y entonces se rompe fuera de onda, ya que no cumple el condicionar más. 

¿Qué te parece que el próximo console.log imprime? Así que eso es lo que haría en C. En C, porque si tienes como var i fuera y usted tiene var i dentro de un bucle, como un bucle, entonces hace que sea tal que que es como alcance que los dos de i son diferentes. En JavaScript, lo hará justo lo tratan como el mismo i. Tengo 5, porque ese era el valor después de que salió fuera del bucle. Así que esas íes son los mismos i. ¿Eso tiene sentido? 

Bueno, tiene sentido desde un punto de vista de JavaScript. Pero el mismo paradigma no trasladará a C. Tienen diferentes reglas de ámbito. Sí. 

AUDIENCIA: [inaudible] fuera de la función [inaudible]? 

JOSÉ ONG: ¿Así que fuera de la función? Así que voy a llegar a eso en un segundo. Así que llamamos foo (i). Esto pasa en i foo, incrementos , y luego lo registra. Así que era 5. Por lo tanto, se convierte en 6. Pero de lo que estoy hablando es de que yo en esa función. Debido a que es un parámetro, es ámbito de esa función. Así que una vez hecho, me levanto de la que función, ahora se va a ir volver a la vieja i. Que sólo está en el ámbito, ya que está en una función. Y tenemos el alcance y funciones. Pero no tenemos alcance fuera de funciones en JavaScript. ¿Eso tiene sentido? Sí. Pregunta. 

AUDIENCIA: Same [inaudible]? 

JOSÉ ONG: Así que sí. En PHP, que es el mismo tipo de cosas. Hay una pequeña sutileza en realidad. Pero usted me puede preguntar acerca de que después de la revisión. Usted realmente no necesita saber que la sutileza de la prueba. Para todos los efectos, como las variables, global y PHP, a menos que están en una función, misma cosa en JavaScript. Sí. 

AUDIENCIA: ¿Por qué esta permitido en JavaScript y no en otro lugar? 

JOSÉ ONG: ¿Entonces por qué se permitió en JavaScript y no en C? Es que todo el que se le ocurrió JavaScript decidió que estaba bien en JavaScript. Así es como un lenguaje de programación convención como diríamos. Sí. 

AUDIENCIA: ¿Entonces por qué ir de 6 a 5? 

JOSÉ ONG: ¿Así que se fue 6-5, porque cuando pasé yo en foo, que i dentro de foo ahora tiene como alcance foo, porque existe un margen en funciones en JavaScript. Pero una vez que salga de aquí, porque fue ámbito de la función, sólo soy utilizando el i regular que estaba dentro el resto del flujo de control. Tiene sentido? ¿Puedo pasar? Está bien. Genial. 

La aceptación de esto es objetos se pasan por referencia. Ya sabes lo que pasa una matriz en C pudieras realmente modificar la matriz? Es la misma cosa en JavaScript. Si paso un objeto, en este caso, pasado Milo en esta función catify. Milo comienza. Su nombre es Milo plátano. Me pase ese objeto en una función porque es un objeto, un asociativa matriz en JavaScript. 

Al realizar una operación en esa función, lo hará realmente cambiar el objeto. Así que esto sólo ocurrirá para los objetos en JavaScript, lo mismo que ocurre para arreglos dentro del nombre de C. Así que Milo en realidad convertirse en gato ahora. ¿Eso tiene sentido? Así que esto sólo funciona para los objetos. Los objetos se pasan por referencia. Sí. 

AUDIENCIA: ¿Estás diciendo que en contraste a la variable i. 

JOSÉ ONG: Si. ¿Qué variable i sólo estaba un número, ¿no? Es como en C cuando se pasa un Integer, se hace una copia. Y cuando se pasa una matriz, que en realidad cambia la matriz real en C. Lo mismo ocurre con JavaScript en este caso. Está bien. Y al lado, Milo es triste porque ahora es un gato. Eso fue en realidad Milo después algún viaje al veterinario. 

Entonces, ¿cómo usamos JavaScript en una página web? Podemos incluirlo. Este es el código HTML con las etiquetas de la tira. Así que tengo strip tags allí. Y entonces me puse un poco de JavaScript código dentro de las etiquetas de script. Y entonces se ejecuta esta. Cuando sólo lo hago de esta manera, es llamado JavaScript inline. Es un poco complicado, ya que el JavaScript es en realidad en el código HTML. 

Una mejor manera de hacer esto, mucho mejor, es escribir tu JavaScript en una archivo externo y, a continuación, proporcionar la etiqueta script con una fuente. Y esto va a ir a ese archivo JavaScript y leer el código JavaScript de ese archivo en su lugar. Y de esta manera, usted no tiene una gran cantidad de JavaScript al comienzo de su Archivo HTML, lo que hace Es realmente complicado. Usted acaba de poner en otro lugar. Y luego se va a leer desde allí. ¿Eso tiene sentido? 

Materia de colocación. En este caso particular, el guión está antes que el cuerpo. Así que cuando yo haga eso, no hay nada en el cuerpo todavía. Tal vez esto te hará un poco más sentir cuando muestro la siguiente parte. En este caso, la secuencia de comandos viene después de la div. Así que el div aparece en realidad en la página primera. Justo aquí, en este pequeño círculo rojo, ves que aparezca el texto. Y entonces la alerta aparece. 

En el primer caso, porque el guión fue antes de la div, el alerta aparece en primer lugar. Y entonces el div se presenta después de desecha la caja. Así que la ejecución importa. Así que vamos a mantener esto en mente. Esto será importante dentro de un rato. Aceptar. Tan bien, ¿cómo se espera hasta el página completa se carga antes de ejecutar algún código? Vamos a entrar en esto un poco poco más tarde también. Pero sólo mantener esta posición asuntos en mente para cuando llegado a otra diapositiva. 

Así llegamos a DOM ahora. Y lo que es DOM? Así que si nos fijamos en el código HTML, es sólo un montón de texto en la pantalla. Entonces, ¿cómo sabe que JavaScript Este es un elemento HTML? Así que tenemos que tener algo de memoria representación de este estructura que tenemos. Y cada vez que tenemos esto en memoria representación en JavaScript, que llamamos que el DOM. Y es sólo una manera de que la gente decidió que debemos representar esta Estructura HTML como. 

¿Y qué tiene esto DOM parece? Bueno, en representación de la memoria, tomamos este texto. Y nos convertimos en la memoria representación. Así que este es el HTML. Así que nos encontramos en primer lugar que todos los Árbol DOM tiene un documento. Se parece a un árbol. Y el documento contiene el código HTML etiqueta, en realidad todo dentro de esto ahora. El tag HTML tiene dos hijos. Tiene una cabeza. Esa cabeza, si nos fijamos en la sangría allá en la forma en que está estructurado entre las etiquetas de cierre, la cabeza tiene un hijo. El niño es el título. Exactamente. 

Ahora, tenemos un niño cuerpo. Y después de que el cuerpo tiene una niño llamó a la familia. Y que la familia tiene tres hijos - más antiguo, medio y menor. Así que usted debe saber dibujar un diagrama así cuando nos preguntamos cómo para dibujar un diagrama cuando damos que el código HTML de la izquierda. Sepa cómo producir el árbol DOM. Y dentro de estas cosas, sólo hay un poco de texto, que he representado como pequeñas cajas. 

¿Esta estructura de árbol DOM hacer sentido y cuál es el DOM? Entonces, ¿qué significan las siglas de la p ¿Que buscas? Por aquí, la p por allá en esa etiqueta representa un etiqueta de párrafo en HTML. Así que usted puede mirar para arriba. Pero sólo significa que es una espacio para el texto. Y tiene un poco de CSS estilo predeterminado, porque es una etiqueta de párrafo. Pero en realidad no te preocupes por que una parte demasiado. Sólo sé que es un marcador de posición de algún texto. Sí. Consulta? Sí. 

AUDIENCIA: Usted acaba de mencionar CSS. La familia de hash y el hash todo eso es, básicamente, en representación de los ID en CSS? 

JOSÉ ONG: Sí, exactamente. Voy a llegar a lo que estos hashes significar en un segundo. Cuando Angela se acercó CSS, ella hablado de selectores CSS. Estos son los selectores CSS que que estaba hablando. Sí, Rob? 

ROB BOWDEN: También me gustaría comentar que DOM dentro de la etiqueta del título es también un nodo de texto. 

JOSÉ ONG: Así es. Así que dentro de la etiqueta del título, Tengo un poco de DOM texto. Así que en realidad, este título debe tener como una pequeña caja que sale de ella también. Pero en realidad no importa demasiado en este caso. En realidad no se preocupan por los nodos de texto, como los llamamos, demasiado. Bueno, lo que hacemos. Al parecer, lo que hacemos. Y voy a arreglar eso cuando Subo de nuevo. ¿Eso tiene sentido? 

Entonces, ¿Cómo podemos trabajar con el DOM? Cada vez que usted se ocupa de la DOM en JavaScript, hay dos pasos. Usted selecciona un elemento DOM. Y luego haces las cosas a ella. Así que en este caso, de manera abstracta, no tengo seleccionado el elemento medio. Y a continuación, un ejemplo de hacer las cosas a ella se cambia el texto. Eso solía ser Bob. Ahora bien, lo que hice con él fue que cambié Bob a Milo en este caso. 

Así que ¿cómo podemos hacer esto? ¿Cómo hacemos la selección? ¿Y cómo hacemos el haciendo cosas para la cosa una vez que hemos tomado esto? Bueno, la forma en que ustedes han aprendido en esta clase es el uso de algo que llamada jQuery. Entonces, ¿qué es jQuery? jQuery es una biblioteca que hace JavaScript más fácil de escribir. Así que alguien se tomó el tiempo y escribió jQuery. 

jQuery es en realidad escrito en JavaScript. Y luego porque hicieron esto, ahora tiene un montón de funciones que podemos usar que hacen que nuestra vive realmente fácil. ¿Cuáles son algunas de las cosas que hace? Esto hace que la selección elementos más fácil. Se hace el cambio de HTML, la adición de las clases más fácil. Se hace más fácil el Ajax. Vamos a llegar a eso en un segundo. 

Y es análoga a bibliotecas C. Así que usted incluye string.h, te strlen. Usted consigue strcpy, todas estas cosas. Al incluir jQuery, se obtiene buena formas de seleccionar elementos al cambio cosas, etcétera. Usted consigue una funcionalidad extra que JavaScript no le da. Así que jQuery no está JavaScript. jQuery es una biblioteca que está escrito en JavaScript que hace JavaScript más fácil de escribir. 

Así que jQuery no es una programación idioma. Pero es JavaScript. hacer. Asegurarse de que recibe su terminología correcta. ¿Alguna pregunta? Sí. ¿Es una pregunta? Está bien. Así que, ¿cómo usar jQuery? Bueno, cuando estás escribiendo algunos El código JavaScript y se incluye un jQuery en la parte superior de su archivo como un archivo de script, se utiliza el signo de dólar ahora para obtener acceso a jQuery para. Y esto es diferente de el signo de dólar en PHP. 

Es el mismo símbolo que escriba en el teclado. Pero que significan cosas muy diferentes. Signo de dólar en PHP significa esto es como me declaro una variable. En JavaScript, cuando usted ha incluido jQuery, que representa jQuery. Así que tenlo en cuenta. Así que ¿cómo podemos seleccionar los elementos DOM? Bueno, cuando lo hace el feo JavaScript manera, se accede a la documentar variable global. Y entonces usted consigue elemento de la familia de identificación. Esto es muy largo y prolijo y no muy agradable. 

O usted puede conseguir todos los elementos que son una etiqueta p. Eso también funciona en JavaScript. Pero en realidad nunca mostró que la sintaxis demasiado. Lo que demostramos que eras jQuery. Así que todo ese selector hacia arriba hay que se expresó en JavaScript sólo se pone condensado a esta muy bonito dólar firmar familia hashtag. Y $ p, justo donde es así. Si desea seleccionar todas las etiquetas p dentro de una familia, ponemos un espacio entre los dos. Y ahora, tenemos todo el p etiquetas dentro de una familia. 

Y mira familiar? Bueno, Angela habló de Selectores CSS. Dame un segundo. Y así, con el fin de seleccionar un elemento, sólo tiene que utilizar el mismo que usted lo haría con un selector CSS. Si pones un hash delante de ello, se selecciona por ID. Un punto selecciona por clases. Si sólo tienes la cosa sin hashes o puntos, selecciona esas etiquetas. Preguntas. ¿Sí? 

AUDIENCIA: Cuando usamos punto en nuestra HTML, es que no jQuery? 

JOSÉ ONG: Dot en nuestro HTML es una cosa JavaScript. No es una cosa de jQuery. La forma en que ustedes lo aprendieron con jQuery es utilizar. HTML. Y luego pasó lo que sea el código HTML que va a ser. Así que voy a llegar a eso en un solo una segunda realidad. Entonces, ¿cómo hacemos las cosas a elemento una vez que hemos seleccionado es? Así que eso es un ejemplo de la selección de un elemento. Así que ahora, lo que queremos hacer cosas para ella. 

Así que en este caso, déjame volver a la diapositiva anterior. Fue Bob antes. Y yo quiero cambiar eso dentro de HTML a Milo. Así que llamo a la función HTML desde el elemento. Esa función HTML está un método de elemento. Y entonces me doy lo que Quiero que el HTML sea. Y simplemente reemplaza lo que hay dentro de esa etiqueta con lo que le doy. Sí. Consulta? 

AUDIENCIA: Se utiliza el hashtag sólo para el jQuery. [Inaudible] no usaríamos eso. 

JOSÉ ONG: Sí, exactamente. Pero no te preocupes demasiado JavaScript sobre pura. Sólo quiero que ustedes se centre en cómo lo haría con jQuery, porque eso va a ser la importante parte en el concurso. Derecha. Exactamente. Así que ya ves que hashtag, de modo que corresponde para seleccionar el elemento con el medio ID por eso hashtag. Hashtag significa ID. Y este elemento tiene un ID de centro. Así que ese es el elemento que seleccionamos. 

AUDIENCIA: [inaudible]. signo de dólar hashtag [inaudible]? 

JOSÉ ONG: Así no. La pregunta es ¿Se puede utilizar. Valor. Y. Valor sólo funciona en los elementos que son insumos. En jQuery, sería . Val, no. Valor. Así que voy a llegar a un pequeño ejemplo que demuestra todo esto en combinación en un segundo. Pero creo que esto sirve un pequeño fragmento tiene sentido que la gente hasta ahora. ¿Quieres cambiar el código HTML, llamar al método de HTML. Sí. 

AUDIENCIA: ¿Puede explicar el método de nuevo? 

JOSÉ ONG: Así que un método es sólo una función que pertenece a uno, en este caso, uno de estos elementos DOM, porque se ve que seleccionado el elemento primero. En realidad, me permitió usar el ratón. He seleccionado el primer elemento. Y entonces llamé a este HTML función que tenía. Y debido a esta función pertenece a esto, lo llamamos un método. Eso es sólo un nombre elegante para ella. Dilo de nuevo. Así que recuerde, se seleccionaron el elemento ahora. Y hemos puesto en el interior de la variable elemento. Corrija? 

Por eso, cuando queremos cambiar el código HTML en en el interior, porque era Bob antes, quiere cambiar ese texto a Milo. Así que llamamos HTML. Y nosotros decimos que lo que el HTML dentro ese elemento debe ser ahora. Y así se lo cambia por Milo, porque yo se lo di Milo. 

AUDIENCIA: Así que están trabajando juntos. [Inaudible] 

JOSÉ ONG: Sí, sí. Están trabajando juntos. Así que uno de ellos selecciona el elemento primero. Y el segundo lo hace algo a él. Sí. 

AUDIENCIA: [inaudible]. Si este método es diferente de en HTML usted tiene el método de la igualdad real. 

JOSÉ ONG: Si. Es un método diferente. Es un método diferente. Y podemos cubrir que en tan sólo un segundo cuando lleguemos a un ejemplo. Quiero para asegurarse de que aceleremos porque nos estamos quedando sin tiempo. Pero nos hemos quedado muy por encima hora actual. Aceptar. Genial. Así que si usted quiere agregar una clase, hay también un método de clase add. Esto es sólo un ejemplo de lo que puede hacer con jQuery. Eso sólo se suma una clase. 

Si desea eliminarlo, usted puede llamar a remove. Esa es otra de las cosas que puede hacer. Así más ejemplos de cosas que puedes hacer. Así que ¿puedo ponerlo en la parte superior de esta manera? Benjamín remove. Si sólo hay que ejecutar JavaScript en la parte superior de mi archivo, funciona eso? Derecha. Debido media no existe todavía. Así que esto no va a funcionar. Orden de ejecución. Se va a la parte superior primero. ¿Qué? 

AUDIENCIA: Menores no existe todavía? 

JOSÉ ONG: Si. Benjamín no existe todavía. Exactamente. 

AUDIENCIA: Usted ha dicho medio. 

JOSÉ ONG: Lo siento. Benjamín no existe todavía. Y la otra cosa es que no tengo incluido jQuery presentar pedir script src. Así que eso no va a funcionar. En realidad, yo no hice eso en la siguiente diapositiva, que es supuestamente para arreglar eso. Pero la forma en que lo hacemos es JavaScript es impulsado evento. Así que lo que hacemos es que usamos un evento Handler para que esto suceda. Y, entonces, seleccione el documento establecer primero. Digo, está bien, cuando el documento es listo, yo correré una función. Así que eso es todo lo que los medios de sintaxis. 

He escogido el documento. Ahora, cuando el documento es listo, ejecute la función. Y así por aquí cuando el documento es listo, lo que significa que todo el HTML tiene cargado, entonces corro a la función que elimina ese elemento. Y ahora, cuando ejecuto esta función que pasé en listo, estoy garantizado que todo el HTML en el página va a existir en primer lugar. Sí. Consulta? 

AUDIENCIA: ¿Cuál es la palabra clave event dentro de la función? 

JOSÉ ONG: ¿Así que la palabra clave en el caso función es sólo un parámetro que se pasa a la función para cualquier evento. Es sólo algo que se obtiene de forma gratuita. Cuando usted está utilizando los controladores clave en pset8, ese evento podría decir, por ejemplo, qué tecla ha pulsado sobre. En este caso, para un evento de listo, en realidad no es muy útil. Pero para un evento de la tecla, es más útil, porque se llega a saber que tecla pulsada por la clave para acceder a código de ese objeto de evento. Corrija? ¿Eso tiene sentido? Aceptar. Sí. Consulta? 

AUDIENCIA: ¿Así que puedes poner el etiqueta de script más abajo? 

JOSÉ ONG: Así que sí. Usted podría poner el guión etiquetar más abajo. Pero entonces, sólo se vuelve realmente complicado. Y nos gusta centralizar toda de nuestro código en un lugar. Y esto nos permitirá hacerlo. Recuerde que antes he dicho que hay una mejor manera de asegurar que los elementos están en la página antes de ejecutar el código? Y esto es sólo una manera agradable usted desea lograr eso. 

AUDIENCIA: [inaudible]. 

JOSÉ ONG: Si. Usted todavía tiene que hacerlo, ¿no? Porque recuerda, que incluyó la presentar en la parte superior de la página. Así que va a ejecutar en primer lugar antes de se llega a la parte inferior de la página. Aceptar. Así que usted puede también agregar a otra persona tipo de controlador de eventos. Éste sólo procesa los clics. Cuando hago clic en joven, luego que se abrirá con una alerta. Esto es sólo una diferente tipo de evento. A diferencia del evento ready, ahora utilizar el evento click cuando reciba hace clic en un elemento. 

Y así, en este caso, recuerde, el clic controlador está conectado a menor. Por lo que sólo ocurre cuando Hago clic en los más jóvenes. Y en el otro, el evento ready se adjunta al documento. Por lo tanto, espera a que el documento para estar listo. Tiene sentido? Creo que puedo seguir adelante. Sí. Consulta? 

AUDIENCIA: [inaudible]. en este caso se utiliza [inaudible]. 

JOSÉ ONG: Oh, sí, porque en este caso, tengo que esperar a que los más jóvenes elemento para que aparezca en la pantalla primero antes de que pueda conectar un controlador de clic a que, por lo que me puse dentro de un documento listo. Aceptar. Y al lado, así que esto es un gran ejemplo de cómo le gustaría combinar todo. Esto es sólo un ejemplo de validación de formularios que has visto en clase. Así que ir paso a paso a medida usted va a través de este. Y será totalmente bien. Acabo de leer lo de arriba a abajo. 

Tengo un formulario en la parte inferior. Cuando el documento esté listo, adjunto un presentar manejador a la forma, de tal manera que cuando presente el formulario, consigo los valores dentro de cada una de esas entradas. Y puedo comprobar si está en blanco. Si está en blanco, vuelvo falsa, porque No quiero para enviar el formulario, porque la forma es erróneo. Si la contraseña está en blanco o es menos de ocho caracteres, no me someto la forma, porque eso también es malo. Y el falso retorno sólo previene la forma de presentación y ir a una nueva página. 

Y es de esperar, esto tiene sentido. Creo que ustedes deben caminar a través de este código paso a paso por su cuenta. Y una vez que usted entiende lo que el selectivo elementos y hacer cosas a ella en realidad implica, esto hará que mucho sentido para usted. ¿Sí? 

AUDIENCIA: ¿Qué hace el name = significa nombre de usuario? 

JOSÉ ONG: Así que el nombre = nombre de usuario y name = contraseña sólo significa mira el atributo de lo usted está seleccionando. Y entonces eso tiene que coincidir. Así que entramos en el registro. Y luego nos fijamos en todas las entradas y el registro. Y luego escogemos el que el nombre atributo es igual al nombre de usuario. Así que el primer selector sólo selecciona la entrada de nombre de usuario. Y ese segundo selector sólo selecciona la contraseña de uno, porque éstos tienen sus atributos name establecen como lo se supone que deben ser. Consulta? 

AUDIENCIA: En la presentación, ¿cómo funciona el parte inferior a resolver la parte de arriba? 

JOSÉ ONG: Así que eso es porque del controlador de eventos. Así que estamos a la espera de un evento de presentar que es despedido de la forma. Y eso es todo lo que es presente. ¿Por qué llamo presentar hasta allí? Dice, cuando se envía el formulario, Me sale un evento presentará. Así que permítanme que interceptar y a continuación, ejecute este código en su lugar. ¿Sí? 

AUDIENCIA: ¿Por qué tienes tener evento función? ¿Por qué no puede usted acaba de [inaudible]? 

JOSÉ ONG: Porque en JavaScript, tienen que declarar las funciones. Así es como funciona en JavaScript. Usted tiene que decir que va para ejecutar una función. Así que usted está diciendo es que eres esperando una función aquí en lugar de sólo llaves. 

AUDIENCIA: Y la función es lo que sigue? 

JOSÉ ONG: Si. La función es lo que está en el interior las llaves después de esa palabra clave función. ¿Sí? 

AUDIENCIA: [inaudible]. 

JOSÉ ONG: Para presentar? 

AUDIENCIA: No, para la función sin el evento. 

JOSÉ ONG: Si. Así que sin el evento, usted puede tener eso. Si usted no necesita el evento, a continuación, puedes omitirlo. Pero si lo hace, entonces usted sólo hay que poner ahí. Sí. Una pregunta rápida? 

AUDIENCIA: [inaudible]. 

JOSÉ ONG: Si. Porque lo que tiene que hacer, el document.ready sólo dice esperar a que todos los el código HTML de la página se cargue primero. Y por lo general, usted quiere que sus elementos en su lugar antes de ejecutar cualquier código. Está bien. Tenemos que llegar al Ajax. No tenemos mucho tiempo. Así pros y sus contras. JavaScript es más fácil tratar escribir con jQuery. Pero jQuery es un poco lento. 

Es como PHP es más lento que C, porque ha interpretado. Y jQuery es un poco más lento que JavaScript, ya que hace un montón de las cosas bajo el capó. Y por lo que si usted está usando jQuery, es sólo un poco más lento que JavaScript, aunque le da buen elegancia. Y, por último, el Ajax. Hasta ahora con el Ajax, que no has visto Ajax en términos de pset7 todavía, porque cuando lo hace, usted somete una forma de cotización. Se carga una nueva página. Para que pueda obtener este gran destello blanco en la página, mientras que cargas segunda página, ¿correcto? 

Sería muy bueno si usted no tener este flash. Al igual que Facebook, si usted acaba de desplazarse a la parte inferior, se añade nuevo contenido sin actualizar la página entera. Así que algo así iba a ser agradable. Este es el código JavaScript en el lado izquierdo. Usted obtiene lo que hay dentro de esa entrada. Usted recibe la información de stock de Yahoo! Y luego de hacer una gran cadena que dice, OK, este es el mensaje que quiero para mostrar en la pantalla. Y luego pones ese mensaje dentro de algún elemento HTML que se que aparece en la pantalla. 

Así que eso es todo lo que está pasando aquí. Así que, básicamente, porque todo esto es JavaScript y no es necesario para ejecutar Ya PHP, este se asegurará de que la página no se actualiza. Así que esto es sólo una idea abstracta que yo estoy diciendo aquí por ahora. La idea abstracta es que si lo haces todo en JavaScript, que no tienen un actualización de la página. Pero, ¿cómo realmente hacer esto? 

Bueno, en realidad, vamos a hablar de un problema con este primero. Un problema es en JavaScript, ejecución es sincrónica. Así que hay que esperar a que una line para terminar antes de que usted ejecutará la siguiente línea. ¿Y si me voy a Yahoo!, y sus servidores son muy lentos, y les toma tres segundos para devuélveme ese stock info? Cuando llegué a esa línea de precios, si el ejecución es sincrónica, ya que es por De forma predeterminada, lo que sólo va a hacer es el navegador va a estancar por tres segundos. Y tú no vas a ser capaz de hacer nada mientras se pone esos datos. Va a ser congelados. 

Y eso es malo. Usted no desea que un usuario tendrá una página Web congelado. Corrija? Eso es malo. Todos están de acuerdo? Si estás navegando por Facebook y se se congela y no se puede hacer nada, conseguir realmente frustrado. Así que la solución es que hagamos algo asíncrono lugar. Así que todo esto asíncrono dice es, yo voy a hacer esta URL para algunos datos. Y luego voy a seguir adelante. Yo sólo voy a seguir ejecutando cualquier código que fue después de eso. 

Y entonces cada vez que los datos están listos, entonces voy a procesarla. Eso es todo lo que está diciendo. 

AUDIENCIA: Ajax sólo hace código asíncrono? 

JOSÉ ONG: Es un asíncrono camino de la búsqueda de datos. Así que la primera cosa sobre Ajax es que me permite recuperar los datos de un sitio web externo. Y lo segundo es que se asegura que mi página no se cala mientras estoy ir a buscar esos datos. Esa es la parte asíncrona de la misma. Porque va a otra parte, porque lo digo yo sigo pasando mientras que es ir a buscar que los datos, que hace que sea asíncrono. Sigo ejecución. 

Así que tenlo asíncrono idea en mente. Y te voy a mostrar lo que la diferencia es. La versión sincrónica está en el lado izquierdo. La versión asíncrona está en el lado derecho. Mire los números para ver cuál pasos corresponden a lo que ejecuta en cada línea. Allí, la alerta aparece en primer lugar. Porque conseguir info de Yahoo! toma de tres segundos, que se ahogue durante tres segundos. Y entonces se avisa al precio después de esos tres segundos. 

Así que ahora, que los programas de alerta hasta en ese momento - tres segundos pulg Y entonces se avisa por después de eso. Por lo que sólo va paso a paso. Es como lo que ustedes aceptaría, ¿correcto? Con la ejecución asíncrona, que le avise primero. Luego te vas a esta URL. Y dices, voy a sólo pregunta por los datos. Y luego voy a procesarla más tarde. Por lo tanto, se ejecuta inmediatamente el siguiente línea después de hacer que solicitud asincrónica. 

Así que unos 0,001 segundos, verá hi alerta. Ejecutar esa función, bye alerta. Y porque yo hice una promesa que yo procesaría los datos más tarde, lo que que pasa es que cuando los datos se vuelve tres segundos más adelante, entonces corro que función que tengo allí. ¿Sí? 

AUDIENCIA: ¿Podría usted especificar o aclarar lo que significa Ajax? 

JOSÉ ONG: Así Ajax es una manera de que si necesitan datos cuando estoy en un sitio web y yo no quieren actualizar la página, a continuación, Yo uso esta tecnología llamada Ajax. Eso sólo significa esencialmente, va búsqueda datos de otro sitio web. Y hacerlo de una manera que sólo no estancar mi página web. 

AUDIENCIA: ¿Así es que una inherente parte de JavaScript o jQuery? 

JOSÉ ONG: Así que alguien escribió una manera de hacer esta en JavaScript hace mucho tiempo. En un momento dado, no existía. Y por lo que alguien inventó esta técnica para permitir que las personas que soliciten estos datos de esta manera. Y ellos escribieron algunas cosas que lo haga por usted. Y jQuery sólo te da esta muy buena manera de hacerlo con estos $. obtener la función. ¿preguntas? Puedo responder a preguntas sobre Ajax después también. Voy a estar aquí. 

Así que vamos a buscarnos datos sin actualizar la página. Y vamos a hacer esto en de manera asíncrona que no se congela la página. Demasiado largo, no leyó si eso explicación era demasiado largo para usted. Así que finalmente, cross-site ataques de scripting. Vimos esto con Zamyla. Si en mi base de datos que alguien tiene este nombre, que es esta etiqueta script, y yo tener algo de código en mi página que se imprime los nombres de las personas en una fila, o tengo algo de código JavaScript que se inserta este nombre en la página, lo consigue HTML producido? Bueno, yo imprimo la etiqueta HTML. Imprimo todas estas etiquetas. 

Llego a la parte en la que estoy de impresión salir con mis amigos. Imprimo a Lauren. Se imprime Milo fuera. Y entonces mi nombre en la base de datos es posterior guión unflattering estado de Facebook. Porque yo inserté esto en la página porque parece que JavaScript cuando esta página se envía al usuario, el fichero es ejecutado como JavaScript. Y esto es lo que llamamos un ataque de cross-site scripting. Alguien pone información maliciosa en su base de datos que pudiera corresponderles alguna cadena adicional o alguna cadena JavaScript. 

Y cuando se imprime a la página de esta manera, entonces, ¿qué que pasa es que mal código es ejecutado que yo no tenía la intención a que se ha podido ejecutar. Y eso es todo un cross-site ataque de scripting es. Y la manera de conseguir alrededor esto es como Zamyla dijo. Usted acaba de envolver las cosas en HTML caracteres especiales. Y este HTML caracteres especiales es un PHP función que evite este tipo de lo que le suceda a usted si usted tiene un malicioso cadena en su base de datos. Simplemente escapa, de manera que no hace conseguir interpretado como HTML. Sustituye a los pequeños soportes con lo que llamamos entidades. Y pasamos esto en la conferencia también. Así que creo que ustedes deberían tener una buena comprensión de eso. ¿Preguntas? Sí. 

AUDIENCIA: Entonces, ¿cómo lo haría la [inaudible]? 

JOSÉ ONG: Dilo de nuevo. 

AUDIENCIA: ¿Cómo sería el monitor - 

JOSÉ ONG: Así es. Así que hay algo que dice, cuando Me registro, escriba en mi nombre. Acabo de escribir en ese campo, mi nombre es stript mensaje poco halagüeño Facebook estado cerca etiqueta de script. Y eso sólo consigue poner en la base de datos, porque no puedo decir que alguien en el mundo no tiene un nombre con una flecha hacia la izquierda en él o la escritura de la palabra en ella. Eso no tiene mucho sentido. Así que sólo tengo que asegurarme de que desinfectar las cosas antes de que yo imprimo a la página. 

AUDIENCIA: Así que las tarjetas especiales de HTML impide que las etiquetas de script? 

JOSÉ ONG: Si. Por lo tanto, no impide que las etiquetas de script. Simplemente se asegura de que el etiquetas de script no reciben interpretado como HTML o - sí. Simplemente hará como lo lo que realmente es. Está bien. Así que esa fue la revisión del cuestionario. Genial. 

[Aplausos]