JavaScript: guía para principiantes

1. ¡Hola!: Todo el mundo ha oído hablar de JavaScript, ¿verdad? Este poderoso lenguaje de programación que utilizó el sitio web para hacer que su contenido cobrara vida. No más páginas aburridas, estáticas que simplemente se sientan ahí mirándote con JavaScript, vamos a poder interactuar con los usuarios, responder a eventos, comunicar datos entre el servidor y el navegador, crear outs y juegos y mucho más. Mi nombre es mi cuerpo, y seré tu instructor para este curso similar a cómo te acercarías a aprender casi cualquier cosa. Es necesario comenzar con lo básico. Aquí es donde entra este curso. Este curso te ayudará a captar los conceptos básicos de JavaScript. Una vez que tengas bueno y bueno en eso, puedes pasar a algo más avanzado. medida que te abras camino a través de las lecciones, vas a ver un ejemplo práctico fuera de dónde usar JavaScript y cómo usar JavaScript de manera tanto informativa como esperemos entretenida. Al final de este curso, tendrás una sólida base en javascript. Sería capaz de crear casa y dinámica con aplicaciones y derribar cualquier aspecto laboral relacionado. Desafía tu rostro. Está bien. Basta de hablar. Estoy tan emocionado de compartir este curso con ustedes. Vamos a saltar 2. Hola mundo: no importa lo bonitos que se vean los sitios del mundo que usan Onley, CSS y HTML, rápidamente se volverán aburridos la estética de la ópera y no responderán a lo que está haciendo el usuario . El sitio web que a menudo visitas nuestro en estática. Eso se debe a que están confiando en JavaScript para darle vida a su contenido. Entonces, ¿qué es Drive a Spirit? JavaScript es un lenguaje de programación utilizado para hacer que las páginas web sean interactivas. Es lo que da una página de los elementos interactivos y animaciones que involucran a un usuario. Esta es una lista corta de lo que JavaScript puede hacer, cuantificó el HTML y, digamos, para la página después de que la página se haya cargado responder a eventos como una máscara, haga clic hacer animaciones que capten las intenciones de los usuarios y muchos muchas otras cosas interesantes. No te voy a poner en guerra con la historia de JavaScript, pero quiero que sepas que JavaScript no tiene nada que ver con Java. Entonces suficiente información de fondo por ahora, vamos a mojarnos los pies escribiendo algunos trabajos. Dejar de fumar. Al final de este video, podrás mostrar algún texto en tu navegador antes de ir en Mr. Además, necesitamos un editor de corte para escribir JavaScript, un editor básico como bloc de notas puede hacer el trabajo, pero un buen editor te hará la vida más fácil. Algunos fuera de mis favoritos llamados editores incluyen sublime nota de texto Malo más código de estudio visual . Realmente no importa cuál estés usando, siempre y cuando sepas crear un nuevo documento. Edita, guarda y revisa en tu navegador. Estás bien para ir. Lo primero que tenemos que hacer es crear un documento HTML. Este documento. Contenemos nuestro código JavaScript. Si revisamos este documento en nuestro navegador, no vemos nada que sea totalmente normal porque nuestro documento está en blanco. Ver la etiqueta de guión? Aquí es donde ocurre la magia. El guión Tang es donde se coloca el JavaScript que se desea ejecutar. Lo que quieres hacer es mostrar un cuadro de diálogo que diga Hola mundo cuando cargamos nuestra página HTML . Por lo que dentro de nuestro guión AG, voy a añadir la siguiente línea de alerta y hola mundo. Digamos nuestro html cinco y ábrelo en nuestro navegador. Y como puedes ver, el mensaje hola Mundo se muestra dentro de un diálogo baches. Ves, eso no fue tan duro. Acabas de crear un ejemplo de trabajo usando JavaScript. Buen trabajo. Entonces, ¿qué pasó exactamente aquí? Lo que hicimos es correcto. Una simple declaración de propagación Java. Las declaraciones de JavaScript son instrucciones que debe ejecutar el navegador Web. En nuestro caso, tenemos una declaración que le dice al navegador que escriba Held the world. Por lo general se puede decir cuando algo es una declaración si termina con un Cullen soleado. Pero esta no es una forma garantizada de identificar una declaración. JavaScript funciona bien en muchos casos sin tener un punto y coma al final de las declaraciones, y algunos desarrolladores incluso optaron por omitirlas. Echemos un vistazo a nuestra declaración. Tenemos esta cosa llamada alerta Alerta es igual que el nombre sugiere es responsable acaparar tu atención por estos aviones. En texto, La palabra mothered es en realidad algo conocido como función. El afecto es básicamente un trozo reutilizable de abrigo que hace algo. Las funciones usualmente toman datos, los procesan y devuelven un resultado. afecto podría ser definido por usted, definido por alguna biblioteca de terceros que está utilizando, o podría ser definido por el propio marco de JavaScript. Una vez que se escribe una función, se puede utilizar una y otra vez. volviendo a nuestro ejemplo. El texto que quieres mostrar es hola mundo. Observe cómo nos envolvieron las palabras dentro de las comillas. Siempre necesitarás piezas del dedo del pie de dext, más comúnmente conocidas unas cuerdas dentro de simples o dobles rápidas las comillas. Puede parecer raro, pero así es como funciona el impuesto de JavaScript San. Veremos las cuerdas con mayor detalle en las próximas lecciones. Puedes jugar y cambiar el fijo como quieras. Digamos, por ejemplo, que nunca lo veo. Juego fuera de las habitaciones. Vamos a guardarlo en. Vamos a revisarlo en nuestro navegador. Y como puedes ver, JavaScript es lo suficientemente amable como para no juzgarme y simplemente mostrar el siguiente. Muy bien, recapitulemos en esto. Escucha, nos ensuciamos las manos creando un ejemplo sencillo. En el camino, nos encontramos con muchos conceptos y términos. Tal cadena de función de declaración. No te preocupes si no puedes recordarlos todos en este momento, todavía vamos a elaborar en cada uno de los términos con otros ejemplos. Está bien, nos vemos en futuras lecciones. 3. Variables: en declaraciones JavaScript, generalmente en cuarto. Lo que llamamos objetos de valor proporcionan una manera fuera de etiqueta y datos con el nombre destructivo para que nuestros programas puedan ser comprendidos más claramente por el lector y por nosotros mismos. Es útil pensar en las variables como contenedores que contienen valor. Su único propósito es etiquetar y almacenar datos en la memoria. Estos datos se pueden utilizar a lo largo de sus programas. ¿ Funcionó el coágulo una variable utilizada de nuestra clave, seguido del nombre que desea dar su valioso? Cuando seas nombre y objetos de valor, haz todo lo posible para asegurarte de que el nombre que asignas tu valioso sea descriptivo y comprensible con precisión . Toe otro lector En esta línea de código, declaramos un resfriado valioso. Di hola. Por el momento, nuestro valioso está vacío. Eso se arregló que al inicializar en eran valiosas un valor. Digamos, por ejemplo, hola son ahora voy a usar la otra facción con así antes para mostrar el contenido fuera nuestra variable. Entonces alerta. Di hola. Es seguro. Nuestro documento. Andi, vamos a abrirlo en nuestro navegador. Como se puede ver, los resultados son los mismos que antes. Si quieres cambiar el texto de visualización para saludar todos. Todo lo que tienes que hacer es hacer un cambio al valor especificado, como el hola body capaz. Entonces aquí voy a cambiar mundo a todos. Si guardo en re ejecutar el script, se puede ver que la pantalla toma cambiado a Hola, todos. A lo largo de tu abrigo, Donde quiera que te refieras a la variable di hola. Es el nuevo valor que se utilizará para aplicaciones más grandes. Esto te ahorrará una tonelada de tiempo porque tienes solo una ubicación donde puedes hacer cambios y se reflejará en todas partes. Pero, ¿cómo puedes llamar a tus objetos de valor? ¿ Algún nombre es? ¿ De acuerdo? Bueno, no. Pero las reglas en torno a la creación de nombres valiosos son simples. Inicia tu variable con una letra y un guión bajo. O un autor del lado del dólar que usó tantas letras dígitos numéricos subrayados o signos de dólar , como quieras. Ah, y una cosa más. Realmente no queremos confundir javascript, pero usando cualquiera fuera de las palabras clave welt end como, lejos o función, obtendremos algunas de estas palabras clave y lo que significan a lo largo del resto de este curso 4. Funciones: tienes algo de programación A bajo tu cinturón. Ahora es el momento de mover realmente las cosas junto con las funciones. Las funciones permiten escribir código que se puede volver a utilizar una y otra vez, código que es mucho más manejable. Bien. Eso puede ser abstracto de distancia y darle un nombre sencillo para que puedas olvidar toda la complejidad y seguir adelante con lo importante. Para ilustrar esto, digamos que queremos consolar el índice de masa corporal o B M I para abreviar a una persona. El ser yo se calcula dividiendo el peso de una persona en kilogramos por el cuadrado de su altura en metros. A una persona se le considera sobrepeso si su bebé, um tengo más de 25 años. Entonces aquí tenemos dos variables. Cada almacén variable, un número, siendo mi valioso resultado almacenado fuera dividiendo el valor almacenado por la variable de peso por el cuadrado de los valores almacenados por la variable de altura. El carácter de la varilla indica que una división necesita tener lugar donde nosotros el carácter asterisco indica que una multiplicación necesita tener lugar. Ahora digamos que queremos calcular la bahía sobre yo para diferentes personas. No hay en Lee lo que hemos aprendido hasta ahora. Escribiríamos algo como esto. Tomaría este código y lo copiaría varias veces. Entonces cambiaría el nombre de las variables así y cambiaría los valores también. Por ejemplo, se puede ver a dónde va esto. Nuestro código es redundante y francamente hablando, se ve terrible. Pero usando funciones, podemos volver a hacer esto genial. Entonces voy a reemplazar todo esto por una porción más pequeña de cope. Esta pequeña porción de código hace el mismo trabajo que antes, pero sin la redundancia. Entonces, ¿cómo sucede esto? Eso es lo que vamos a aprender porque rara vez vas a acertar o usar código que no lo hace en cuatro funciones. Es importante que te familiarices con ellos y aprendas todo sobre cómo funcionan . El mejor modo de hacerlo es saltar directo a ellos. Entonces voy a borrar todo esto. Vamos a crear la sencilla función que dice hola, pero aún tenemos que llamarla así donde voy a añadir la siguiente mentira después del final de nuestra declaración de función. Ahora vamos a guardar esto y previsualizarlo en nuestro navegador Como puedes ver, se muestra el mensaje hola. Ahora dividamos nuestro código en trozos pequeños y veamos cómo funciona. En primer lugar, nuestro código comienza con la palabra clave facción Después de la palabra clave function. Se especificó el nombre real fuera de la función, seguido de abrir y cerrar paréntesis. Entonces, ¿dónde está alrededor de nuestra función? Con corchetes de apertura y cierre, estos corchetes encierran las declaraciones que tenemos en su interior. Por último viene el contenido fuera de nuestra función. En nuestro caso, el continente es la otra función que muestra un diálogo libros con la palabra Hola y no olvidemos la función. Llama a la facción. carbón es el nombre fuera de la función que desea llamar o invocar, seguido de nuevo de paréntesis. Sin su llamada de función. La función que creaste no hace nada. Ahora veamos una función diferente. Permítanme primero retrasar esto. ¿ Recuerdas a nuestra pareja de ser mi función? Antes se veía así. Esta función es lo que llamamos Obama intenta función, lo que significa que toma argumentos cuando hace frío. Se puede decir cuando una función toma argumentos mirando la propia declaración de función función que no toman argumentos,por función que no toman argumentos, lo que aparecer con parentis vacíos es padre gana su nombre. Funciones que toman argumentos no son así Siguiendo su nombre y entre los aprendices la función se quedó claramente qué tipo de argumentos necesitan y el número fuera de estos argumentos para país 8 p.m. I. Se puede ver que este toma dos argumentos. El 1er 1 es el peso en el 2do 1 es la altura. En nuestro caso, llamamos a nuestro cálculo ser yo función y especificamos los valores que nos desea a la función dentro de las piezas padre aquí, el 70 corresponde al argumento peso en el 1.86 corresponde al argumento altura. El orden es muy importante. Entonces ahora sabes comunicarte con tus funciones en una dirección, es decir, sabes pasar argumentos a funciones. Pero, ¿qué pasa con el revés? ¿ Puede una función comunicarse de nuevo? Tenemos a nuestro país siendo mi función y la disciplina pone en mensaje de alerta con el valor fuera de nuestro valioso. Pero ¿y si realmente queremos almacenar ese valor para algún uso futuro? Entonces en lugar de que nuestra cubierta sea mi función, calcule el haz y muéstralo como una alerta. Nosotros queremos hacer algo como esto, podrían ser un mi valioso almacenarán los resultados fuera del cálculo realizado por la calculo B M. función calculo B M. I. Entonces, ¿cómo podemos lograr esto? El modo de devolver datos de una función es mediante el uso del trabajo de la clave de retorno. Entonces aquí dentro de mi calculadora B y yo funciono, voy a hacer algunos cambios. Entonces en lugar de la otra función, voy a decir regreso soy notado que todavía estamos calculando el b m I dividiendo el peso por el cuadrado de la altura. Pero en lugar de este avión y alerta fueron devueltos el b m i, según lo dicho por el BM valioso. Ahora todo lo que tenemos que hacer es llamar a la función y un signo el resultado de retorno a una variable. Una vez que tu función golpea la palabra clave de retorno, se detiene. Todo lo que está haciendo en ese momento regresa. El valor se especifica y sale, por lo que en el código que existe después de su declaración de retorno se ignorará. Otra noticia interesante fuera de la palabra clave de retorno es simplemente salir de la función con que realmente devolviendo un valor al color. Por ejemplo, puedo tener una función encendida, pero tiene por ejemplo, hace algo, y después de hacer lo que debe hacer, dirá volver aquí. La palabra clave de retorno es usada por sí misma como ves para simplemente aceptar la función. 5. Declaraciones condicionales: Hasta el momento, hemos logrado tareas pre desafiantes. Pero lo que hace que el programa sea mucho más poderoso son las declaraciones condicionales. Esta es la capacidad de probar una variable contra el valor y actuar de una manera. Si se cumple la condición, obedezca el valioso u otro camino. De no ser así, JavaScript proporciona una capacidad general de toma de decisiones en forma del constructo del lenguaje conocido como la sentencia if, la frase más básica es la que ves frente a ti. En este caso, si la condición dentro de los paréntesis de hamburguesa se evalúa como verdadera, entonces se ejecutarán las sentencias entre corchetes curvos. De lo contrario, el programa no ejecutará las sentencias y continuará justo después del último corchete rizado que indica el final del bloque. El enunciado if básico también se puede extender con la palabra clave else. Esto proporciona una sentencia set off alternativa para ser ejecutada si la condición no es verdadera . Para darle sentido a esto, echemos un vistazo a un ejemplo sencillo. A menudo f l declaración en acción. Aquí tengo un valioso efectivo frío y monedero inicializado a true, y tengo otras dos funciones. El 1er 1 dice que puedes pedir una pizza el 2do 1 decir , Alejarse nuestro Es bueno para tu salud. Entonces, ¿cuál de esta verdadera declaración se ejecutará? Guardemos nuestro documento y salgamos derecho y veamos cuál será ejecutado. Y como puedes ver, la primera declaración que dice's puedes pedir una pizza es la que se muestra en nuestro navegador. Esto se debe a que nuestro valioso se inicializa a verdadero. De modo que la parte verdadera de nuestras declaraciones F else inicia. Ahora sigamos adelante y cambiemos el valor de dinero en efectivo y billetera. Cae dedo del pie. Vamos a ejecutar nuestro guión. Como se puede ver el texto que dice's se adhieren al agua. Es bueno para tu salud está apareciendo. Esto sucede porque nuestra expresión evalúa las caídas del dedo del pie. Tiene sentido correcto. En la mayoría de los casos, tu expresión no será un simple valioso que tome caídas de Traore. En cambio, necesitarás comparar entre dos o más cosas para obtener un resultado verdadero o falso. Hacer esto contigo es lo que llamamos operadores condicionales. El general ex off. Tal expresión es la que ves frente a ti si expresión seguida por el operador, luego por la expresión. Entonces si el resultado de esto es cierto, haremos otra cosa. Haremos otra cosa. Echemos un vistazo a algunos de los operadores condicionales antes de seguir adelante. El operador doble igual es verdadero si la primera expresión valora a algo que es igual a la segunda expresión. El doble extremo, por ejemplo, es verdadero si la primera expresión en la segunda expresión ambas se evalúa como verdadera. Para ejemplo concreto de operadores condicionales, imagínense un programa bancario que imprima una breve notificación al fondo. Cada recibo de transacción de acuerdo al saldo restante en la cuenta. Si el valor fuera de la variable de saldo es mayor que el saldo mínimo, que es 100 en este caso, en alerta debería aparecer diciendo saldo seguro. Si el saldo no es mayor que el saldo mínimo, entonces debe aparecer un mensaje que diga advertencia Saldo bajo. Entonces si llamo a la función de estado de equilibrio usando un saldo apagado 80 por ejemplo, en este caso, esta expresión se evalúa evaluada a la culpa porque 80 no es mayor a 100. Si ejecuto el script, debería recibir un mensaje de baja advertencia de saldo. Como pueden ver, ese es el mensaje que recibo ahora. Si llamo a esta función con abundancia, digamos que fuera 150 esta vez, el valor del balance es mayor que el saldo mínimo porque 150 es mayor a 100. En este caso, debería sacar un mensaje de saldo seguro. Y como pueden ver, saqué el mensaje. Seguro. Bono. casi terminamos con la declaración if, lo último que quiero mostrarles. El variante fuera de la declaración FL Hasta el momento, utilizamos la sentencia F ejecutada a una sección diferente de abrigo. No obstante, podemos pensar en casos en los que quisiéramos ejecutar más que a una sección de código diferente . En estos casos, podemos usar la palabra clave else F para cambiar si las declaraciones juntas nuestra aserción cabra dentro cada bloque F y else f buscando una expresión que evalúe como verdadera. Si ninguna de las declaraciones tiene expresiones que evalúen como verdadero el código dentro del tipo else , si existe, ejecute. Eso es todo por las declaraciones F. Pasemos a una declaración condicional diferente. Ahora veremos declaraciones de cambio que funcionan de manera similar a la sentencia FL, pero con un centro diferente. Son particularmente útiles cuando se tiene varios más cierra una sentencia switch evalúa una sola variable en el dependiente de su valor, ejecuta un cierto bloque off coat. El impuesto general enviado para declaración básica de cambio es el que ves frente a ti. El interruptor comprueba el valor por apagado de la variable para una coincidencia. En uno de los casos, si son iguales, ejecutarán las declaraciones en ese caso. Está bien, Es un ejemplo que probablemente te hará hambriento. Tengo un sabor frío variable era Valor se dice a las galletas y verde. Esta variable de sabor es lo que se pasa a nuestra declaración de cambio de estado. Nuestra declaración de cambio contiene una colección de bloques de cajas Onley. Uno de estos bloques será atropellado con su código siendo ejecutado. El modo en que este elegido es cotejando un valor de caso de bloques, con el resultado off evaluando la expresión en nuestro caso, porque nuestra expresión evalúa a un valor fuera de las cookies y el verde. El código dentro del caso blogueado, fue valor de caso es cookies y crema se ejecuta para evitar la ejecución. Toda la afirmación que sigue a la palabra clave break se utiliza su propósito es romper el interruptor y continuar con el resto del programa. Por defecto es el equivalente de switch off la ropa de Els y una declaración F else. Si ninguno de los casos explícitos se aplica a la variable default con todavía aplicar, cada valor coincidirá con el caso predeterminado. Por lo que esto puede ser útil para manejar situaciones inesperadas. Esta declaración que se puede convertir en declaración fl equivalente. Deja mover o eliminar esto, como puedes ver, si de lo contrario es muy similar a nuestra declaración de cambio. Entonces al igual que con la declaración de cambio, estamos comparando invirtiendo nuestro sabor valioso contra los diferentes valores que puede tomar. Ahora mismo, podrías estar preguntando, ¿Cómo puedo saber cuándo usar? Lo cual hay muchos argumentos en la Web sobre cuándo usar switch versus una declaración else , y lo único que está claro es que todos no son concluyentes. personal, yo cambias cuando me he ofendido. Número de valores esperados 12 meses en un año, por ejemplo, podría estar representado por 12 casos. Si la situación requiere mucho rango de valores, es más dulce del dedo del pie una declaración f l. Pero de nuevo encontrarás a alguien que de manera convincente pueda proporcionar un argumento en contra. Entonces ve con lo que encuentres más legible 6. Bucles: cuando programas a menudo necesitarás hacer cosas en los tribunales más de una vez, y JavaScript te da algunas maneras de ejecutar código repetidamente varias veces. Por ejemplo, digamos, tener una función llamada decir gracias. Esta sanción muestra un mensaje de texto diciendo Gracias. Entonces si quiero llamar a esta función, digamos 10 veces. Una forma en que podría hacer eso es llamándolo la primera vez, luego simplemente compañía en y basándome en esto tanto como yo quiera. Si bien esto funciona pero son redundantes, código es un difícil de mantener y simplemente un mal 80. Además, no siempre sabrías el número de veces que necesitas para correr tu abrigo. Puede cambiar de acuerdo a las condiciones específicas presentes durante una ejecución determinada, y más que probable, el número de veces que desea repetir algún código podría ser enorme. No se quiere copiar y pegar algo unas 100 o miles de veces para repetir algo que sería terrible. Lo que necesitamos es una solución generosa para un código de paloma, con control sobre cuántas veces se repite el código. Esta solución se llama Loops Loops, ya que el nombre sugiere nuestras estructuras que recorren una sección de código. En tanto se cumpla una condición alguna, hay tres tipos de esperanzas que puedes crear cuatro bucles. ¿ Por qué los lóbulos en los bucles de alambre? Una de las formas más comunes de crear un lope es mediante el uso de la palabra clave de cuatro para crear lo que se conoce como un bajo cuatro. utiliza un bucle de cuatro para repetir un código de bloqueo específico número desconocido de veces. La sentencia de inicialización se ejecuta sólo una vez. Después se evalúa la expresión de prueba. Si la mejor expresión es caídas, se termina el grupo completo. Si la expresión de escritorio es verdadera, ejecuta el código dentro del cuerpo de cuatro Aoul y se opera la sentencia update. Veamos un ejemplo aquí tenemos una función llamada Di hola esta función. Trae la palabra hola al navegador usando el método documento punto derecho, voy a terminar. Voy a estar llamando a este método. Chen Tien. Ejecutemos nuestro guión y veamos el resultado. Como puedes ver, la palabra Hola se imprime el navegador 10 veces. Esto es posible gracias al bucle de cuatro, vamos a tomar un más cercano ubicado. En nuestro ejemplo, creé una nueva variable llamada I y la centralizé a cero. El condicionante es que nuestra variable I es menor a 10 en cada iteración fuera de nuestro bucle completo, somos incrementos nuestra variable I por uno el bus bendito después me refiero a sus indagaciones. Cualquiera que sea el valor que yo variable tenía por uno, este proceso se repite hasta que la expresión de prueba sea pliegues. Ahora que tenemos una idea general sobre cómo para las obras, todavía hay algo que nuestro ejemplo sencillo no cubrió. En ocasiones es posible que desee soportar para grupo antes de que llegue a su finalización. El modo de hacerlo es mediante el uso del trabajo rompedor. Ya has visto la declaración de descanso utilizada en una lección anterior. Se utilizó para saltar de una declaración de cambio. La sentencia break también se puede usar para saltar del bucle y ejecutar el código después de él . Si los hay, voy a hacer algunos cambios en nuestro abrigo. Voy a copiar esto basted aquí, cambiar la palabra hola dedo en, entonces voy a usar la declaración F. Si soy igual a seis, entonces rompa. Quitaremos esto. Entonces vamos a guardar esto y ejecutar nuestro guión. Y como se puede ver cuando el valor off yo es igual a seis. Las sentencias break rompe el lope y continúan ejecutando el código tras bucle. Entonces aquí no tenemos ningún código después de la foto, así que simplemente nos detenemos cuando el número seis se imprima al hermano. En ocasiones tal vez quieras forzar la siguiente iteración fuera del look para que se lleve a cabo, saltando cualquier cotización en el medio. Esto se puede lograr utilizando la declaración continua. Veamos un ejemplo. Voy a hacer algunos cambios en nuestro abrigo. Voy a copiar y pasar esto aquí en adelante. Voy a cambiar la palabra rota por Continuar. Ahora vamos a quedarnos, raspar y ver qué pasa. Como puede ver, falta el valor seis en la salida. Por qué, cuando los ojos el valor es de seis. El programa encuentra una declaración continue, que lo hace saltar en el inicio de las cuatro esperanzas para la siguiente iteración salto en la declaración para la iteración actual. Como dije antes, hay tres tipos de grupos. Vimos a los cuatro mirar, ahora todavía tenemos dos más, así que empecemos con el look salvaje. The Wild Hope ejecuta algunas declaraciones hasta que su condición regrese cae en este ejemplo. El estado se representa por número es menor a 10 expresión con cada iteración nuestros incrementos lope, el valor numeral por uno era el valor off number se convierte. Entonces el bucle se detiene porque el número es menor a 10. Expresión devolverá caídas, por lo que lo que se muestra es 10. Entonces ejecutemos nuestro guión y veamos si esto es cierto. Ahora es el momento de ver el Do I look en cuatro y anchos bucles con esta condición de Dildo en la parte superior del look. Pero, ¿me veo? Verificamos su estado en la parte inferior fuera del bucle. A Do I look es similar a un bucle de alambre. Aceptar el hecho de que está garantizado ejecutar al menos una vez. Se ilustra esto con un ejemplo. Este grupo mundial nunca será ejecutado porque es condicional. La expresión es falsa con un bucle do while porque la expresión condicional se evalúa en Lee. Después de una situación, garantiza que tus looks continente se ejecuten al menos una vez. Entonces si ejecuto este guión, lo que obtendré es el que estoy corriendo texto de bebé print en el hermano, gracias a la puerta, mientras mira así cubrimos los diferentes tipos de grupos. Ahora mismo eres mi chiflado tú mismo usando bucles mucho. Pero a medida que empezamos a manipular colecciones de elementos HTML de datos en tu documento y otras situaciones complejas, te apoyarás mucho en bucles. 7. Timers: un bloque de código JavaScript generalmente se ejecuta de forma sincrónica, lo que significa que cuando una sentencia necesita ejecutarse, se ejecuta inmediatamente. Pero podemos deleitar la ejecución de instrucciones que fue en algunas funciones nativas llamadas temporizadores. Dicen esas funciones. Tiempo de espera dicho Intervalo. Andhra Quist animación Frame the set Time out establece un temporizador, que ejecuta una función o pieza de código especificada una vez después de que expira el temporizador. Si queremos mostrar en los libros de alerta después de dos segundos, por ejemplo, no haríamos algo como esto. Aquí tenemos una función llamada show Otro que otro el mensaje diciendo que finalmente me presenté . Llamo a esta función fue en cambio yo modo después de dos segundos o dos miles milisegundos. Entonces si guardo esto y ejecuto el script, se puede ver que después de dos segundos aparece el mensaje, Se podría preguntar por qué el tiempo de espera I d Valioso está aquí. Después de todo, no lo usamos bien. Este valioso no es realmente inútil. Podemos usarlo si quieres cancelar el tiempo de espera. Cuando llamamos al set Time out, regresa sobre i d Este i d se puede pasar del dedo del pie. Otra facción llamó a tiempo claro para cancelar el temporizador. Entonces si quiero cancelar mi temporizador, haría algo así como este tiempo de espera claro. Entonces pasaré el I D devuelto por el set. Función de tiempo fuera como esta al mismo tiempo Sondas de afecto muy útiles en muchos casos. Por ejemplo, si hay una acción en curso que no puede terminar, puede usar la misma función de tiempo fuera para interrumpir esta acción y devolver el control al usuario, dijo Interval, repetidamente llamado la función o ejecuta un fragmento de código con un fix it tratando retraso entre cada carbón. A diferencia del tiempo de salida de sesión que ejecutan la cancha apenas una vez. El primer argumento de esta función especifica la función que le gustaría ejecutar. El segundo argumento especifica el tiempo en milisegundos para esperar antes de que el código se vea de nuevo , dicho Interval Returns, también un Interval i D, que identifica de manera única el intervalo para que pueda eliminarlo más tarde llamando a claro Intervalo . Muy bien, vamos a ver un ejemplo aquí tenemos una función llamada Di hola Esa alerta y un mensaje diciendo hola ya que es intervalo somos Lupin Esta función con el retardo apagado tres segundos entre H Loop. Si desea cancelar el bucle, puede utilizar el intervalo claro omitiendo el intervalo I d a esta función al intentar animar algo a la pantalla. Tienes que asegurarte de que tus calderos de animación usando correctamente la misma función de intervalo mencionada anteriormente, no garantiza eso. Seamos explicados. Tu navegador está ocupado, el viento, cosas diferentes en cualquier momento dado, escuchando máscara Knicks, este avión, este avión, lo que escribes en un teclado, cargando recursos ejecutivo JavaScript y más mientras hace todo esto. Tu navegador también está redibujando la pantalla a 60 fotogramas por segundo, dijo que Time Out no toma en cuenta lo que está sucediendo en el navegador. Entonces nuestro código de animación, mi get, puede perderse en el caos. Para evitar esto y superar otros problemas de eficiencia, tenemos la función de amigo de animación de solicitud la forma de usar esta función es un poco similar a establecer el tiempo de espera y dicho Intervalo, posible que hayas notado que no especificas un intervalo, ¿verdad? Eso todo depende de la velocidad de fotogramas de tu navegador y computadora, pero normalmente es de 60 fotogramas por segundo. La diferencia clave aquí es que estás solicitando al navegador que dibuje tu animación en la siguiente oportunidad disponible, no un intervalo predeterminado basado en la visibilidad del elemento de carga y Baker Status Browser también puede optar por optimizar su rendimiento fuera de solicitud marco de animación. En fin, así es como utilizarías la solicitud, el marco de animación y la vida real. Aquí tenemos una función llamada Condujo Something Note que nuestro marco de animación de solicitud llama a la sequía. Algo funciona completamente desde dentro del mundo envió la infección misma. Quizás te estés preguntando por qué esto no crea un bucle infinito. Eso es porque solicitar amigos de animación Implementación evita eso. En cambio , asegura a la misma. La infección se llama justo a la derecha. Cantidad de veces necesarias para controlar las cosas se dibujan a la pantalla. Joe crea animaciones de boca para detener una animación de solicitud por infección. Tienes la función de fotograma de animación de cancelar, igual que vimos antes. Cancelar animación Frame quita el I D. Valor de nuestra solicitud animación por infección que se devuelve cuando lo llamas 8. Alcance, variable: toe trabajar con JavaScript de manera eficiente. Una de las cosas más importantes que debes entender es el concepto o alcance variable. El alcance de una variable es controlado por la ubicación fuera de la variable Declaración y define la parte del programa donde un valor particular es accesible. En otros términos. hecho de que declare un valioso no significa que se pueda acceder desde cualquier lugar de su código. Vamos a iniciar nuestra exploración fuera de alcance con lo que se conoce como escuela global. Los objetos de valor globales se definen fuera de todas las facciones, generalmente encima del programa. Ellos mantienen su valor a lo largo de toda la vida fuera de su programa. Cualquier función puede acceder en Global Valuable que es un valioso global está disponible para su uso lo largo de todo su programa. Después de su declaración en este ejemplo, el número valioso se declara fuera del afecto número de retorno. A pesar de eso, la función de número de retorno tiene acceso completo al número valioso. Obviamente, hemos estado usando variables globales todo el tiempo sin notarlo, así que solo estoy asegurándome de que sepas con qué estás lidiando porque esta valiosa escuela hace que muchos principiantes se frustren. Ahora echemos un vistazo a los objetos de valor que son, por ejemplo, la nube dentro de la función. A esas se les llama variables locales. contra del dedo del pie las variables globales se ven de variables cuando la red cuando el acceso desde fuera de la función en este ejemplo que este valioso se declawed dentro de la función de prueba de alcance . Entonces si trato de acceder al escritorio valioso desde fuera de la función, no funcionará. El motivo es que la variable scope off your desk es local a la función de prueba de alcance. hay obstante, una excepción a esto. Si declaramos valiosa nuestra prueba sin el trabajo de Vaki, el comportamiento de alcance cambiará por completo en este caso, pesar de que nuestra prueba valiosa aparece dentro de la disfunción del alcance primero, sin incluir la palabra clave VAR hace que esta variable vivir globalmente. Entonces aquí voy a cambiar esto para que vivo globalmente. Entonces si Irán nuestro guión, mostrará el mensaje diciendo que dejé globalmente, que es el valor de nuestra prueba valioso. Esto es cierto para cada valioso declarado sin usar las palabras clave var. Odio decírtelo, pero este es solo uno de muchos cuartos de JavaScript. Hay otros con los que necesitas estar familiarizado. Echemos un vistazo al padre. Un abrigo. En primer lugar, déjame en el guión y ver el resultado. Entonces volveré y explicaré lo que pasó aquí. Tenemos el primer mensaje diciendo Bienvenido a la edad adulta. Después un segundo mensaje diciendo lo mismo. Bienvenido a adulto. Ahora volvamos a nuestro código. Aquí tenemos una función llamada etapa de vida Dentro de la declaración if, tenemos un valioso llamado mensaje. Cuando se ejecuta este código, se muestra la otra función directamente debajo de él. Bienvenido a la edad adulta que tiene sentido. Lo que podría tener menos sentido es que la segunda alerta que está fuera de la declaración if también mostró bienvenida a la edad adulta y es lo que está pasando. Nuestra variable de mensaje es la nube dentro de lo que llamamos look ah block es cualquier cosa que aparezca dentro de los corchetes abiertos y cierres. En muchos lenguajes de programación, las variables declaradas dentro de un bloque son parte de ese bloque propio alcance. Eso significa que esas variables son locales y se puede acceder fuera de ese bloque. Pero en JavaScript, las cosas son diferentes. JavaScript no es compatible con el alcance de bloques. Entonces desde el punto de vista de los scripts de Java, también podríamos declarar en una determinada variable de mensaje en la parte superior de nuestra función de estado de vida misma de la siguiente manera. Entonces aquí voy a decir mensaje. Entonces borraré esto de nuestro aquí. Ahora vamos a correr el crédito y a ver si hay algunos cambios. El primer mensaje diciendo Bienvenido a la edad adulta y el segundo mensaje diciendo: Bienvenido a la edad adulta. Como se puede ver, el comportamiento es idéntico a lo que vimos antes. Porque los negros de JavaScript parecen alcance. La mayoría de los desarrolladores que vienen de otros lenguajes como C C plus o Java experimentan mucha frustración y comportamiento inesperado. Es por eso que la última versión de JavaScript introduce una nueva palabra clave llamada Let Si usas lead para definir variables, su alcance se limitará al bloque en el que se declaren. Muy bien, digamos un ejemplo. Voy a retrasar esto. Aquí tenemos una función llamada comportamiento de bloque. Dentro de esta función, tenemos una sentencia if y dentro de esta sentencia if declaré un número llamado valioso. Estaba en deleite, palabra clave. Entonces tengo una nueva función de alerta que muestra el valor fuera de esta variable. Fuera de este bloque, tengo otra alerta que muestra el valor de una variable llamada número, pero esta vez. No lo es. El valioso que declaramos aquí está en la palabra clave let. Pero es la variable global que declaramos por encima de nuestra función. Por lo que la primera alerta debe mostrar el número 20. Y la segunda alerta debe mostrar este valor que es entonces vamos a guardar esto y ejecutar el script. Por lo que el primer valor es 20. El segundo valor es 10. Muy bien, pasamos por este. Pero espera, aún no terminamos. Javascript aún tiene sorpresas para nosotros. Déjame mostrarte de lo que estoy hablando. Veamos otro ejemplo. Entonces aquí tengo una variable llamada texto que tiene un valor off. Hola. Y tienen una función llamada saludar a todos dentro de esta sección tengo una función de alerta que decía que esto mostraba el valor nuestro texto valioso. Tenemos nuestra re declaración fuera de nuestro texto valioso con el valor. Nos vemos más tarde. Después tenemos otra alerta mostrando el valor del texto. ¿ Cuál crees que será el resultado de las otras llamadas de función? Dado lo que está pasando a través de mi respuesta que la primera alerta mostrará hola en la segunda alerta te mostrará más adelante. No obstante, si ejecuto este script. Lo que vamos a ver es indefinido y nos vemos después. Entonces, ¿qué está pasando? Cuando Javascript encuentra una función, buscaba todo el código buscando cualquiera de los objetos de valor de la nube. Cuando los encuentra, inicializa son ellos por defecto, con un valor off indefinido. La gran función de todos está declarando un texto frío variable. Por lo que antes de que la primera alerta llegue incluso, se crea una entrada para texto con un valor off indefinido. Eventualmente, cuando nuestro código golpea a nuestro texto equivale a sello más adelante, el valor del texto se inicializa correctamente. Pero eso no ayuda a nuestra primera función de alerta. Pero sí ayuda al 2do 1 que sigue a la re declaración off. Siguiente. Todo esto tiene nombre. Se le conoce como host in o valioso hosting. Entonces ten esto en cuenta porque créeme, rastrear mientras tus objetos de valor no se comportan como se esperaba no es divertido. Y ojalá esto te ayude a saber por qué 9. Cierres: una de las cosas más importantes al trabajar con funciones en JavaScript. Las revelaciones, Cierres permiten a los programadores de JavaScript escribir mejor código, y ahora que tenemos alcance variable bajo nuestros recintos de entender construidos sería mucho más fácil. No más hablar de cierres ya que esto hará que tu solo se confunda. En cambio, vamos a conseguir nuestro jurado de mano manipulando código real. Esto te ayudará a entender mejor. En primer lugar, veamos qué sucede cuando tienes funciones dentro de funciones. En este ejemplo, tenemos nuestra función ganadora anunciada que contiene una alerta y otra función llamada say winner name que también contiene una alerta. El interesante parte es lo que regresa la función ganadora anunciada. Cuando hace frío, vuelve a decir, función de nombre de ganador. Llamemos a esta función inicializando evitable que gana para anunciar Ganador, voy a nombrar a mi variable ganadora igual a anunciar ganador. Si ejecutamos nuestro código, verás un cuadro de diálogo que dice que el ganador es lo importante a tener en cuenta ¿Es ese el mismo ganador? Todavía no se corre una infección porque en realidad no la hemos llamado con simplemente devolver una referencia a ella porque el ganador, valioso ahora príncipe a una función se puede invocar esta función la estamos llamando usando el open and close tesis de paren como esta cuando se hace esto, la intervención devuelta, un nombre de ganador diga. También nos van a ejecutar. Corremos nuestro guión y veamos. Entonces el primer mensaje diciendo que el ganador es y el segundo mensaje diciendo, Mohammed Ali. De acuerdo, ahora nos estamos acercando cada vez más a saber cuándo son realmente los soldados. Cuando tienes funciones con las infecciones, realmente te encuentras con casos como el que acabamos de hacer. En cambio , a menudo tendrá variables y datos que se comparten entre la función externa y la intervención. Para ilustrar esto, hagamos algunos cambios a este ejemplo. Voy a eliminar esto y reemplazarlo declarando un valioso llamado fueron nombre ganador y establecer su valor. Dos. Mohammad Ali en esos el dejar también esta alerta Andi declarar otra variable llamada Ganador en Verdadero y Sit. Su valor para el ganador es más nuestro nombre de ganador variable. Esta es una manera de salir del brebaje ating esta cuerda con nuestra variable. Hablaremos de esto más adelante. Aquí está el giro, el decir ganador llamado Función se dio cuenta en el nombre del ganador Variable que vive en el alcance fuera de la función ganadora anunciada externa. Vimos previamente que cuando golpeamos la palabra clave de retorno, salimos de la función. Entonces cuando ejecutamos nuestra función ganadora anunciada, desaparece una vez, digamos que el nombre del ganador se devuelve al ganador. Valioso. Entonces, ¿qué opinas? ¿ Qué pasa cuando llegamos a esta línea? No hay asunción lógica es que nombre ganador Variable está en realidad en derecho definido? Entonces alertemos el valor del andro ganador y veamos qué pasa. Vamos a ejecutar nuestro guión. Tenemos un mensaje diciendo que el ganador es Mohammed Ali. Por lo que nuestro guión está funcionando en realidad. Algo está pasando aquí, y que algo no es más que nuestro misterioso cierre de superhéroes. Aquí te damos un vistazo a qué, exactamente o por qué exactamente. El nombre del ganador no era indefinido. El tiempo de ejecución de script Java que da camión de todos tus objetos de valor, memoria, referencias de uso y así sucesivamente es realmente inteligente. En este ejemplo, detecta que la función interna, digamos nombre de invierno es un dependiente de variables de la función after, que se anuncia ganador. Cuando eso sucede, el tiempo de ejecución asegura que cualquier variable en la función externa que se necesite aún esté disponible para la función Inter aunque la función externa desaparezca. Por lo que el ganador Valioso se está refiriendo a esto. Un ganador llamado Function. Pero la función de nombre del ganador también tiene acceso al nombre del ganador Valioso que existe en el Exterior anunciado función ganadora esta inter facción debido a que de cerca, objetos de valor relevantes de la función externa en por lo que su alcance se conoce como un cierre. 10. Dónde poner JavaScript: Hasta ahora, hemos estado escribiendo nuestro código JavaScript dentro de nuestro documento HTML. Pero esto no es una obligación no. Existe otra opción que implica derecho en tu código JavaScript. En un expediente separado. Usando esta opción se eliminará en JavaScript dentro de tu documento HTML. Seguirás teniendo la etiqueta de tira, pero su propósito sería apuntar al archivo JavaScript separado en estado de contener código JavaScript. Ten en cuenta que aún puedes ayudar a las líneas de código JavaScript mientras usas un archivo JavaScript externo . Ninguno de estos enfoques se excluyen mutuamente. Ahora echemos un vistazo más de cerca a estos enfoques y veamos los pros y los contras de cada enfoque que puedas elegir el enfoque adecuado para tus aplicaciones Web. El primer enfoque que veremos es el que hemos estado utilizando hasta ahora. Este enfoque es donde todo su JavaScript está contenido dentro de la etiqueta de script lado a lado con el resto del código HTML. Cuando a tu navegador le encanta la página, atraviesa y analiza cada línea de cada canal de arriba a abajo. Cuando llegue al script AG, irá adelante y ejecutará todas las líneas de JavaScript también. Una vez que lo haya terminado ejecutando tu código, seguirá pasando el resto de tu documento. El segundo enfoque es aquel en el que no se escribe JavaScript en tu documento HTML. En cambio, todo tu javascript, está contenido en un archivo separado. Este enfoque solo funciona si tienes un archivo separado para contener un oro de JavaScript. Pero la extensión de este archivo debería ser el GS. Por ejemplo, aquí tengo un archivo llamado Script RGs. El nombre no importa. Puedes nombrarlo. Lo que quieras. Dentro de este archivo, hay script Onley Java. No se le permite escribir ninguna de cada Diana o CSS llamado aquí solo código JavaScript que normalmente pondrías dentro de la etiqueta de script. Una vez que creamos el archivo JavaScript, necesitamos vengarnos de la referencia en la página HTML para ello. El script tag tiene un atributo llamado SRC. Este atributo apunta a la ubicación fuera de los despedidos. Gran archivo. En este ejemplo, Jarvis, gran script de archivo como sí, se encuentra en el mismo directorio que nuestros documentos HTML. Puedo hacer referencia al nombre del archivo directamente haciendo esto dentro de la etiqueta de script. Añadiré los atributos SRC y digamos iguales para raspar los gs. Si tu archivo se encuentra en otra carpeta, por ejemplo, tienes un G frío más completo y dentro de esta carpeta pones tu archivo. Entonces deberías cambiar la espalda un coddling. Por lo que aquí agregaré el nombre de esa carpeta. En este caso, nuestro archivo de script comienza a mirar la raíz fuera de nuestro sitio y navega por la carpeta GS . También se puede especificar el camino de cuatro o lo que llamamos el baño absoluto. Por ejemplo. Puedo eliminar esto y en su lugar escribir lo siguiente antes de hablar de qué enfoque es mejor. ¿ Está en línea o JavaScript externo? Yo quiero discutir algo primero. Por ahora, nos han puesto en nuestro tiempo de guión dentro de nuestro ataque corporal aquí. Estamos lidiando con un documento HTML vacío, así que eso no hará ninguna diferencia. Pero cuando tienes unas 100 líneas de oro, ahí es cuando comienza el debate fuera donde poner javascript. Algunas personas consideran el lugar en JavaScript en la parte inferior de la página, una mejor práctica cuando otros ven lo contrario. Entonces, ¿quién tiene razón? Echemos un vistazo más de cerca a cada caso tu navegador pasa tu página HTML empezando arriba y luego se mueve línea por línea. Entonces cuando apuntas tu JavaScript a la parte superior de la página, al navegador, empezamos a cargar tus archivos GS antes que las imágenes y texto del mercado y dice Browser. Aunque JavaScript sincrónicamente nada más se cargará mientras se carga el JavaScript, por lo que el usuario verá una página en blanco durante unos segundos mientras se carga el JavaScript. Por otro lado, si coloca su JavaScript en la parte inferior de la página, el usuario dirá primero la página cargando, y después de eso, el JavaScript se cargará en segundo plano. Entonces si, por ejemplo, tu CSS y HTML tardan cinco segundos en cargarse y tu JavaScript tarda otros cinco segundos , poner nuestro JavaScript en la parte superior de la página le dará al usuario un tiempo de carga percibido apagado 10 segundos, y ponerlo en la parte inferior dará un tiempo de carga percibido apagado cinco segundos. Estoy usando la palabra percibida porque en ambos casos, la página estará completamente cargada en la misma cantidad de tiempo. Al poner JavaScript en la parte inferior de la página, nuestras páginas parecerán estar cargando el doble de rápido Pero hay una captura. Si cargamos nuestro JavaScript en la parte inferior de la página, el usuario se queda por unos segundos con una página HTML de aspecto hermoso donde nada funciona. Si el usuario intenta realizar una acción y descubre que no está funcionando, pensará que nuestra obligación está rota. Lo que es aún peor es que no tenemos manera de dejar que los años o no cuando la aplicación será completamente funcional. Unos segundos para cargar. El APP es una de las cosas más comunes. Nosotros todo el peso para que nuestras computadoras lancemos para que carguen videos, inusual para, para que la tienda abra para casi todo. A un par de segundos más. Esperar no volverá loco a nadie, espero. Pero no hay nada peor que un usuario haciendo clic en un botón, lo cual no funciona porque puede perder la confianza en la aplicación. Incluso la experiencia de carga lenta se puede suavizar usando un cargador simple como el que ves al abrir tu cuenta de Gmail, por ejemplo, realmente depende de lo que estés haciendo. Si el contenido es más importante para ti, entonces ha sido mejor colocar tu javascript en la parte inferior de la página. Pero si estás haciendo una aplicación Web, eres un lugar mucho mejor en JavaScript en la parte superior. Ahora tenemos que elegir cuál de los dos enfoques es mejor. ¿ Es mejor? Prueba JavaScript insider documento HTML O ponlo en un vuelo externo como aquí. Bueno, la decisión depende de tu respuesta a la siguiente pregunta. ¿ Vas a usar el mismo código JavaScript en múltiples documentos HTML? Si la respuesta es sí, entonces probablemente quieras poner el código en un archivo externo y luego referirlo a través de todas las páginas HTML en las que quieres que se ejecute. Esto le ayudará a evitar la duplicación llamada a través de las páginas y a facilitarlos y el mantenimiento . Ya que tienes un solo lugar para realizar todos los cambios que quieras a tu script. Esto también ahorrará mucho tiempo a los usuarios porque no tienen que descargar el script cada vez que cargan una de esas páginas HTML, sobre todo cuando el script está a más de unos cientos fuera de líneas. El navegador no conocerá el abrigo sólo una vez y entregará el efectivo la versión persona fuera del archivo bajo demanda si respondiste no a la pregunta anterior respecto con el registro se va a utilizar en múltiples documentos HTML. Entonces puedes hacer lo que quieras. No habrá mucha diferencia. 11. Escribir un comentario: Si estás tomando este curso para convertirte en desarrollador de JavaScript primero llegaste al lugar correcto . En segundo lugar, probablemente trabajarás con otros desarrolladores de JavaScript. En equipo. Esto significa que a menudo estarás mirando el código de tus compañeros de equipo, y a menudo estarán mirando el tuyo. Por lo que debes asegurarte de que puedan decir lo que eres código hace o de lo contrario. Es inútil. Pero aunque estés trabajando solo, te sorprenderías de lo rápido que incluso te vuelve inútil a ti mismo porque estás para conseguir lo que es el go off del programa. Para evitar este desafortunado problema, una de las mejores formas es mediante el uso de algo conocido como comentarios empezar líneas especiales de tu programa que no están escritas en botón de código en inglés o francés sencillo o cualquier idioma que hables. Está bien, aquí es un ejemplo. El comentario está marcado por la doble diagonal. El asunto a tener en cuenta sobre los comentarios es que no se ejecutan y se ejecutan como el resto de tu código. JavaScript los ignora. El objetivo del comentario es ayudarnos a entender cuál es el código el viento. Otro propósito de los comentarios es marcar líneas de código que no se desea ejecutar. Si quiero decirle a JavaScript que no muestre este mensaje de alerta, simplemente lo comentaré poniendo el carácter de doble diagonal delante. Fuera de la declaración. Hay muchos tipos de comentarios en JavaScript. Uno de estos tipos, es, piensa es la sola línea común, la que acabamos de utilizar. este momento, la sola línea común se puede escribir en su propia línea, o podemos escribirla en la misma línea que una declaración. Depende de ti elegir una ubicación que parezca apropiada para el entrar en nuestra redacción. Si quieres escribir un comentario largo fuera de múltiples líneas o quieres contar una gran pieza de código, entonces usar la doble diagonal no será práctico porque necesitarás agregarlas frente a cada línea. En su lugar, podemos utilizar la siguiente slash de sintaxis, seguida de e histeria y para cerrar este comentario. Pero la estética primero, luego talada por el personaje de la slash, necesitas estar familiarizado con una sola línea y multiplicando los comentarios porque en la mayoría las aplicaciones usarás una combinación de ambos fuera de estos enfoques comentaristas. Ahora que sabemos diferentes formas de comentar, Vamos a pasar por algunas mejores prácticas a seguir. Viento viene código junior siempre entra en tu código como tienes razón en él. Sé que escribir comentario puede ser aburrido, pero créeme, estarás agradecido cuando puedas entender lo que está haciendo tu código. Apenas de leer el comentario como opuesto a pasar por 100 fuera de líneas fuera de JavaScript. Segunda cosa. Comentario. Claramente, usa más inglés o cualquier idioma que prefieras y menos código. No complices el grande, claro y conciso de tu Kamen . El último es, no superes y comentar cosas obvias reducirá la legibilidad. Si sigues estas mejores prácticas, podrás escribir mejores cañones, y eso va a facilitar el código para ti y para que tus compañeros lo lean. 12. Tipos: en las mejores lecciones con tan diferentes tipos de valores con tan miles de millones, una fuerza de números verdaderos o falsos y muchos mundo y cosas diferentes que pertenecen a JavaScript. Este aliento y las cosas se conocen formalmente como tipos. Por suerte, JavaScript es lo suficientemente amable como para dejarnos usar este tipo sin planear con anticipación. A pesar de lo sencillo que es usar este tipo, pasa mucho detrás de bambalinas. Es importante saber lo que JavaScript te está ocultando porque no te ayudará en Lee a entender tu código más fácilmente. Incluso podría ayudarte a identificar lo que salió mal. Sabíamos que Program no funciona correctamente antes de descubrir qué esconde JavaScript. Veamos algunos tipos básicos de script Java string. Esta es la estructura básica para trabajar con número de texto. Permite trabajar con números lingotes, tomar un verdadero o falso no representar el equivalente digital apagado. Nada indefinido. Esto se devuelve cuando debe existir un valor, pero no le gusta cuando declaras una variable, pero no le asignes nada. Objeto. Esto actúa como contenedor para otros tipos, incluyendo otros objetos. Cada uno de estos tipos es único, en el que lo hace Pero hay un grupo simple en defecto bajo. Estos tipos pueden ser simples antes conocidos como primitivas, o pueden ser complejos, anteriormente conocidos como Objetos Primitivos, Nuestro Atomic. En otras palabras, no se pueden deconstruir en tipos simples. En JavaScript, los tipos primitivos son número de cadena Boolean No en tipos indefinidos. Los objetos, por otro lado, son un poco misteriosos. Entonces, ¿qué son exactamente? De hecho, estamos rodeados de objetos. Casi todo lo que sabemos puede ser considerado un objeto. Un celular es un objeto. Puedes encenderlo y apagarlo, hacer llamadas, ver videos y hacer todo tipo de cosas. Los objetos están en abstracción. Puedes usarlos fácilmente sin saber qué está pasando detrás de escena. Por ejemplo, no importa lo que vaya dentro de tu teléfono, qué tipo de materiales o qué componente electronique se utilicen. Todo lo que nos importa es que el teléfono haga lo que se le dice. Básicamente pensar a menudo objeto como una caja negra. Se puede ver lo que está pasando dentro, pero sí. No importa mientras funcione. Esto cambiará cuando aprendamos a crear. El interior muchas veces se oponen por el momento. Vamos a mantenerlo simple además del Brault y tipos que así antes tenemos también un montón objetos predefinidos en Javascript que podemos usar cuerdas actúa como goma alrededor de la cuerda . Primitive brillante actúa como un rapero alrededor del lingote número primitivo actúa como una goma alrededor del número matriz primitiva ofertas con la recopilación de datos fecha te ayudan a trabajar con fechas. Mi ayuda manipular los números. Te explicaré cada objeto con gran detalle más adelante. Por ahora, veamos algún fragmento de código para darte una idea sobre ellos. Aquí tenemos diferentes objetos. Tenemos un objeto string, una fecha, una matriz en el objeto 1.000.000.000. Observe cómo usamos la nueva palabra clave seguida del nombre fuera del objeto para crear cada uno a estos objetos. Sé que probablemente estés confundido sobre el propósito de tener forma de objeto fuera de los lingotes de cadena y las primitivas de números. Después de todo la forma del objeto y la forma primitiva fuera de estos tipos se ven muy similares. Veamos otro ejemplo. Entonces aquí tenemos una cadena primitiva y un objeto extraño ambos con el mismo valor. Entonces lo que veremos impreso será idéntico debajo de la superficie, aunque ambos Muppet en el objeto Muppet son muy diferentes. Vamos a sentar la diferencia poco a poco en las próximas lecciones a medida que exploramos los tipos construidos en más profundidad. 13. Cuerdas: como seres humanos, utilizamos palabras casi todo el tiempo para comunicarnos. JavaScript también utiliza palabras o anteriormente conocidas como cadenas, para comunicar información entre el programa y el usuario. Fuera del programa. Las cuerdas no son como las oraciones. Están escritos en un código como una secuencia de caracteres citados, obteniendo tus comillas simples o dobles. Como se puede ver en estos ejemplos, el fin de hacer nuestra vida más fácil cuando se trabaja con cadenas, existe una implementación de objeto de cadena subyacente en JavaScript que contiene muchas propiedades. No voy a repasar cada propiedad existente. Eso sería muy aburrido, pero me centraría en los más importantes. En JavaScript. Se puede inventar, innar o combinar dos cuerdas juntas usando el operador plus. Aquí combino saludo y objetivo juntos. Pero como puedes ver, especifico un personaje de espacio vacío entre ellos para asegurarme de que haya un espacio entre el mundo Hola y el mundo, todos. Entonces si ejecuto este script, el resultado será hola, a todos. También podemos agregar los objetos de cadena a la mezcla, pero tendremos el mismo tipo al final, que es una fuerza primitiva. Entonces aquí voy a cambiar esto de una fuerza primitiva a un objeto de cuerda usando nuevo strike. Hay otra forma de tener un espacio vacío entre las palabras Hola y todos. En cambio, fuera de este espacio vacío aquí, simplemente puedo quitarlo y adicto aquí. Entonces ahora si ejecuto el script, se puede ver que vamos a obtener el mismo resultado. Otra palabra para combinar huelgas en JavaScript es mediante el uso del método concurrido. Llamaste a este método desde una cadena. Después indicas la otra fuerza, primitivas y objetos a los que quieres unirte. personal, prefiero usar el operador plus porque es más rápido. Una cuerda puede parecer una unidad de punto cercano, pero de hecho es, conformada con los personajes off de un Siri. Se puede acceder a cada carácter indicando la posición del índice fuera del carácter dentro corchetes. ¿ Qué personaje crees que se mostrará? Si tu respuesta es s, entonces felicitaciones. Tienes razón. Si esperabas otro personaje, probablemente el último A en Javascript aquí, entonces deberías saber cómo funciona la exposición final en Javascript y muchos otros idiomas. La posición del índice empieza desde cero y sube desde ahí. Es por eso que la posición de índice es para pero la cuenta atrás. El elemento en esa posición es otro cinco. Se utilizaron otros. Forma de acceder a un personaje es mediante el uso del método de tiburón at. Entonces aquí puedo quitar los corchetes y en su lugar decir, pero tiro a las cuatro, este método devuelve el carácter en el especificado y la exposición, por lo que aquí el resultado será similar. Entonces, ¿qué vimos antes? Si quieres acceder a todo el personaje en una fuerza, puedes mirar a través de las posiciones de índice. El punto de inicio de tu look será cero en el final fuera de tu lope es en realidad la longitud fuera de tu cuerda. En lugar de contar el número de caracteres en tu cadena, hay una propiedad muy útil para determinar la longitud en JavaScript esa propiedad es Yep , adivinaste longitud. A veces no te interesa toda la cuerda, sino sólo una parte de ella. Para poder extraer los cócteles, te interesa. Terminar en una cuerda. Tenemos dos métodos. Slice y sub str el método de corte. Extraer una sección de una cadena dependiente de las posiciones inicial y final. Tu pasado hazlo así aquí, manera rebanada la pizza valiosa extraemos los cócteles entre la posición índice seis y 17. El resultado. El sub string es el mejor se devuelve. El otro método que ayuda a tu cadena divisor es el subtexto que eres método. Este método devuelve los caracteres en una cadena, comenzando en la posición inicial y todo el camino a través de la longitud fuera de un sustrato. En este ejemplo, partimos desde el primer personaje, que tiene la exposición final fuera de cero y contó cinco caracteres, por lo que el resultado será la palabra pizza que se devuelva. También puedes llamar a este método sin especificar el argumento length, en cuyo caso obtendrás la fuerza que va desde la posición inicial hasta el final. Entonces si me detuve del índice partidista seis. ¿ A qué le devolverá? ¿ El sub string es lo mejor de la historia? Una de las cosas poderosas que puedes hacer al trabajar con cuerdas es buscar un personaje o caracteres dentro de la cadena. se puede hacer. Estaba en el índice fuera del último índice off y los métodos de partido. Veamos primero el método de índice off. Este método ICS como argumento el carácter o caracteres que estás buscando y devuelve el índice de la primera ocurrencia. Si no se encuentran los caracteres especificados , devuelve menos uno. Entonces aquí estoy tratando de encontrar la palabra dólar dentro de mi fuerza. El método index off es lo suficientemente amable como para hacernos saber que esta palabra existe en el 11 en Exposición. Se trata de buscar algo que no existe. Por ejemplo, X. Se puede ver que este método devuelve menos uno. Ahora pasemos al último método de índice off. Como se puede adivinar su nombre. Este método devuelve la última ocurrencia fuera del valor especificado si no se encontró nada más tarde sintoniza Mentes un índice apagado. Último índice off puede tomar otro argumento. Además de los personajes que estás buscando, este argumento es la posición de inicio donde quieres comenzar tu surf. Lo que piensas que debes recordar sobre los métodos indexados y menos indexados es que no hacen una distinción entre palabras enteras ni lo que estás buscando. Siendo parte de un conjunto más grande de personajes que avanzan, veamos ahora el método de coincidencia. Este método mucho es una cadena contra una expresión regular y devolver una matriz que contiene el en valor mucho resultado expresiones regulares son fortalezas de texto especiales utilizadas para hacer coincidir combinaciones fuera de caracteres en fortalezas. Para construir una expresión regular, cierras mejor tu surf entre rayas. Aquí tendremos un partido sobre Lee si los captores E V. C. Ocurrieron juntos en ese orden, cuál es el caso aquí? Entonces esto encenderá un mensaje diciéndole a ABC, Porque tenemos un partido que vimos antes cómo venir, Capitán. Ocho cuerdas juntas. Ahora vamos a hacer lo contrario dividiendo una cuerda aparte. Para hacer esto realmente se mostró método, que dividió la fuerza en una matriz de subcadenas con el fin de determinar exactamente dónde. Para hacer cada división, necesitamos especificar un separador. Digamos un ejemplo. Nuestros meses variables tiendas, un string off meses separados por coma. Utilizamos este método de sangre para separarnos cada mes. El personaje separador que es es Kama. En consecuencia, conseguimos un array de descuento 12 meses. Lo último que vamos a ver es cómo convertir una cadena en mayúsculas y minúsculas. Es bastante sencillo. Nada complicado Los métodos que iban a usar son métodos en mayúsculas y minúsculas. Veamos cómo funcionan. Por lo que aquí tenemos un turno valioso que tiene una cadena en minúsculas. Entonces si quiero convertir este dedo del pie de cuerda en mayúsculas, todo lo que tengo que hacer es llamar al método en mayúsculas del dedo del pie en este valioso cuando lo contrario. Si quiero convertir este dedo del pie bebida, minúscula que haré es lo mismo llamando al método minúscula en este valioso. Entonces, ejecutemos este guión y veamos qué pasa. El primero se convierte dedo del pie en mayúscula, y el 2do 1 se convierte, se convierte en minúsculas. Antes de terminar esta lección, quiero señalar algo en una escucha previa. Hablé de primitivas y objetos, y dije que las primitivas son simples y directas. A diferencia de los objetos, no tienen propiedades ni métodos que nos permitan jugar con sus valores. Pero en esta lección, hicimos muchas cosas interesantes con nuestra fuerza Primitivos. Entonces, ¿qué está pasando aquí sin demasiados detalles aburridos? Quiero que sepas que JavaScript convertirá temporalmente tu tribu primitiva en remolque sobre objeto siempre que quieras acceder a una propiedad o a un método. Una vez que ese objeto sirvió a su propósito, se desvanece, dejándote con el resultado final 14. Arrays: En esta lección, veremos una noción fundamental en JavaScript conocida como raza. Una matriz almacena una secuencia de valores que están todos apagados al mismo tiempo. Una forma de crear una matriz es utilizar un cohete abierto y cerrado. Después, dentro de los corchetes, puedes colocar tus artículos y separarlos por comas. Ahora bien, ¿cómo accedemos a nuestros artículos? Bueno, ya sabes hacer eso. Recuerda cómo accedemos a los caracteres dentro de la cadena es de la misma manera, con un aumento dentro de una matriz, cada elemento se le asigna un valor de índice, comenzando por cero. En nuestro ejemplo, las galletas y la crema tendrían un valor índice o cero. Entonces si quiero conseguir el sabor a chocolate, montaré los siguientes sabores de helado. Y dentro de los corchetes, pondré el índice fuera del chocolate, que es aquí es el número uno. Entonces puedo firmar esto a una variable, por ejemplo, sabor. Y aquí lo tienes, igual que lo hicimos antes. Puede mirar a través de su matriz usando un bucle for y la propiedad length. El índice valora fuera de nuestra matriz, comienza desde cero y termina en unidad que su enlace de matrices. Eso se debe a que la propiedad longitud devuelve cuenta fuera. Todos los elementos de nuestra matriz, que está en este ejemplo, está bien, pero el valor del índice debe detenerse en cuatro porque estamos empezando desde cero. Si tratamos de acceder a los helados volando, por ejemplo. De acuerdo, lo que obtendremos es un mensaje diciendo indefinido. Si desea agregar elementos a la matriz, puede usar el método push. El método push se llama en su matriz y toma el elemento que desea agregar. El nuevo elemento se agregará al final de su matriz. Si quería ser anuncio al principio, su matriz utilizó el método on shift en su lugar. El valor de retorno de la llamada tanto en los métodos push como shift es la nueva longitud fuera de su tasa para eliminar elementos de matriz utilizado los métodos shift y bob. El método shift elimina el primer elemento de una matriz y lo devuelve mientras que el método pot elimina el último elemento de la matriz y lo devuelve. Ten en cuenta que ya sea que estés agregando elementos o quitándolos, el primer elemento de la matriz siempre tendrá un valor de índice de cero. También hay un método de corte para la carrera. Permite copiar algunos elementos de su matriz y Ritter una nueva matriz con sólo esos elementos copiados en este ejemplo, recapitando todos los elementos entre el primero y el cuarto elementos de nuestra matriz y los devolvió al nuevo rayo. No le pasa nada a nuestra matriz original porque esos artículos se acaban de copiar. Si estás buscando un elemento dentro de una matriz, puedes usar dos métodos indexar off y last index off the index off method devuelve el valor del índice de la primera ocurrencia del ítem que estás buscando y el último método de índice off devuelve el valor del índice de la última ocurrencia del artículo que estás buscando. Si no se encontró ningún elemento tanto apagado, este método devuelve menos uno. 15. Numbers: los números son una parte esencial de JavaScript. Trabajarás con ellos la mayor parte del tiempo, sobre todo cuando intentes contar algo. Declarar un número en JavaScript Es bastante sencillo. Ese no es el caso en otros lenguajes de programación como Java o C Plus. ¿ Dónde tienes que declarar un número como V tipo suficiente? No es doble flotador, etcétera. Los números JavaScript siempre son de 64 bits flotantes. Los números de punto también se pueden escribir con decimales y con imitación científica utilizando exponentes. También puede declarar números negativos sobre la colocación del carácter menos antes del número. Perdón pliegues. Es hora de algunas matemáticas. No te preocupes. Es simple matemática. En JavaScript, puedes hacer las operaciones matemáticas básicas que aprendiste en primer grado, por ejemplo, suma, resta, multiplicación y división algo que ingresarás por mucho cuando trabajar con miembros es incremental o en un decreto se menciona un valioso tal como vimos con los cuatro. Aquí hay un ejemplo de incrementos de una variable por una. Podemos simplificar esta línea haciendo la siguiente X plus, más de manera más general si quieres aumentar por s y cierto número y puedes hacer lo siguiente . Esto significa exactamente lo siguiente. No hay diferencia. Esta primera sintaxis es simplemente más simple que esta. Se puede hacer lo mismo con otras operaciones. Todo lo que tienes que hacer es reemplazar el signo más con el operador fuera de tu elección. Algo que debes tener en cuenta al usar el signo doble más o el signo doble menos es que si aparecen antes después de lo valioso eres incremental o D'yquem, Inter realmente importa. Un ejemplo ilustraría lo que estoy tratando de decir. Entonces aquí tenemos una variable llamada X que tiene un valor off cinco, y estamos incremento en esta parábola. Entonces, ¿cuál crees que sería el resultado de esta alerta? Corremos el guión en C. Tenemos X Tickle seis e Y es igual a cinco X igual. Seis. Esto se espera porque incrementamos y el valor de X. Pero ¿por qué? ¿ Por qué tiene un valor de cinco y no de seis? El motivo es porque el doble signo más aquí aparecen después de la X valiosa. Por lo que estamos asignando el valor de X, el valor antiguo fuera de X a la variable y antes del incremento en ella. Si colocamos el doble signo más delante esta vez, lo que obtendremos es X igual a seis e y igual a seis 16. Objetos: en una escucha previa. Echamos un vistazo a los objetos, y te dije que deberías pensar en ellos como cajas negras. Pero ahora es el momento de abrir esas cajas y ver qué hay dentro. Para crear un objeto, use el follow in sintaxis, la palabra clave var, seguido del nombre fuera de su objeto, luego algunos corchetes rizados de apertura y cierre. Simple es esa esa línea? Crear un auto de oro objeto. Nuestro look de hombre de objeto de auto llega tarde al aquí, pero de hecho está conectado al tipo de objeto principal. ¿ Cómo es eso? Bueno, ¿por qué no hemos definido ninguna propiedad para nuestro objeto de auto? Existe una propiedad interna especial que existe llamada proto. Esta propiedad hace referencia a lo que se conoce como objeto prototipo. Un objeto prototipo se merece en el que se basa otro objeto. Decimos que el objeto auto hereda del tipo de objeto. Es por eso que se puede acceder a cualquier propiedad que contenga el objeto a través de nuestro objeto auto. Veamos un ejemplo aquí. Estoy llamando a un método llamado a cadena en nuestro objeto auto. A pesar de que nuestro auto objeto no tiene ninguna propiedad llamada la tensión, podemos ver el resultado fuera llamar a este método en lugar de obtener un error o indefinido? No. Definamos algunas propiedades en nuestro objeto de auto, por ejemplo, nombre y modelo. Podemos encontrar estas dos propiedades utilizando tres enfoques. El primer enfoque es mediante el uso de la documentación. Entonces aquí tengo un nombre, propiedad con ese valor o para todas las llagas en la propiedad modelo con un valor de fantasma. El segundo enfoque implica el uso entre corchetes, así que voy a quitar la documentación y en su lugar, uh, uh, algunos corchetes y hacer lo mismo para la propiedad hocico. El último enfoque implica extender nuestro objeto inicializar er's en impuestos así. Entonces aquí queremos decir nombre es rollos, palabras coma, luego modelo Phantom. Ahora puedo quitar esto. Ahora vamos a divertirnos más y crear un método llamado get model. Este método devolverá el valor de la propiedad del modelo para hacer esto, uh, un coma aquí, luego el nombre fuera de su método seguido de Cullen. Entonces la función de palabra clave, igual que tú, crearía una función normal, pero sin el nombre, porque ya la tenemos aquí. Por lo que queremos que nuestro método get model devuelva el valor de la propiedad del modelo, así que diré Return on, Vamos a agregar algo de texto, por ejemplo. Modelo es y puede cafeinado con este modelo de punto. No te preocupes por el disco E palabra. Hablaremos de ello más tarde. Ahora vamos a ir nuestro método de modelo get usando el misil de documentación antes. Entonces voy a decir otro núcleo pero ponte móvil ahora. Si ejecuto este guión, conseguiremos hocico es fantasma. A veces necesitas crear objetos que sean básicamente los mismos. Por lo que aquí tenemos tres objetos auto, camión y ventilador. Cada uno de estos objetos tiene verdaderas propiedades. Nombre y modelo Método Onda Obtener modelo. Observe cómo el método get mobile es el mismo para cada uno de estos objetos, por lo que hay una duplicación en nuestro código. Para solucionar esto, usaremos el principio de herencia que vimos antes. Vamos a crear un objeto padre que contenga las propiedades que son más genéricas y no necesita estar en el objeto hijo mismo porque el nombre y el móvil son únicos Para cada objeto que tengamos, dejaremos tal como están. Pero el método get model, otro lado, se puede poner en aparente objeto que el resto de los objetos puede heredar de Llamemos a este vehículo objeto. Por lo que yo estaba viene aquí en el Klauer un objeto vehicular. Ahora copiaré y pasaré esto dentro de nuestro objeto vehicular. Pero ahora eliminaré todos estos objetos en los que no podemos crear así o de otro modo. El prototipo de estos objetos será objeto y no queremos eso. Queremos que el objeto vehicular con la propiedad get model sea el padre. Por lo que tenemos que hacer el prototipo de propiedad en auto, camión y camioneta objetos referencias vehículo. Para ello, usaré el objeto que crear lo significaba. Este método crea un nuevo objeto con el objeto prototipo especificado. En nuestro caso, es vehículo y ahora podemos agregar nuestras propiedades igual que antes para crear los otros objetos . Simplemente copia y apresura esto y haz los cambios que quieras. Si estás siguiendo y entiendes lo que está pasando, debes darte una palmadita en la espalda. No obstante, aún no terminamos con Stillman. Es necesario ver lo que significa el disco e palabra. Tratemos de llamar al método del modelo get met. Por lo que aquí voy a decir auto que se ponga modelo. Llamaré a la otra función para ver el resultado. Entonces si ejecuto este guión, lo que conseguiré su modelo es fantasma. No, si le hago esto al entonces objeto Así que aquí voy a sustituir coche para entonces se en las drogas otra vez el guión . Lo que voy a obtener este modelo es City Express dependiendo de qué objeto lo llamaste desde get model fueron devueltos El modelo apropiado Tenga en cuenta que no hay propiedad de modelo en nuestro vehículo. Objeto Entonces como viene get model devuelve el valor correcto La respuesta radica con ¿Esta palabra clave el escritorio? Fuiste el primero el objeto que nuestro método get model bueno llamó En un caso fueron los objetos de auto y camioneta los cuales ambos contenían la propiedad del modelo antes y en esta lección quiero decir que javascript no proporciona clase implementación percibida, que puede ser un poco confusa para los desarrolladores que están acostumbrados a trabajar con lenguajes basados en clases como Java o C plus. Pero sí, sin embargo, utiliza el prototipo todo modelo de herencia que vendemos, que de hecho es más poderoso que el modelo clásico 17. Expresión de funciones Inmediatamente: hasta ahora, estamos siendo utilizados en funciones bastante pesadamente. Como ya saben. Son extremadamente útiles y nos permiten escribir código que se puede utilizar una y otra vez . Vimos cómo crear la función y llamarla usando su nombre, pero también podemos crear una función sin darle nombre. Este tipo de funciones se denominan funciones anónimas para crear función anónima. Simplemente quita el nombre de aquí. Pero ahora no tengo forma de llamar a esta función, así que necesito asignarle una variable. Usaré sólo el mismo nombre usando el nombre de la variable, seguido de alguna tesis de indulto. Ahora pueden llamar a mi función anónima. Ahora es el momento de mirar otra variación de función, conocida como una expresión de función invocada inmediatamente o I P. Para abreviar, pago es una función de JavaScript que se ejecuta un pronto como se define. En lugar de darte directamente la expresión, muchas veces yo fi, se crea paso a paso. En primer lugar, vamos a crear una facción anónima como aprendemos a hacer a continuación. Robemos nuestra función dentro de paréntesis para decirle a Javascript que es una expresión. Ahora necesitamos que esto se ejecute de inmediato por lo que sumaré otro par. Parentis está al final, padre con por un poco de níquel. Enhorabuena. Has escrito con éxito en la expresión de función invocada inmediatamente. Es bastante complicado en ese momento, por los muchos paréntesis, igual que una función normal. Si también toma argumentos, la única diferencia es cómo se pasa en esos argumentos. Entonces aquí tengo un ejemplo fuera de una función, el otro el algunos off verdadera variable mejor el valor cinco y siete a esta función. Cinco sobre Miss Crate, resultado de los 12 como se esperaba. Ahora que aprendimos a crear una bonita cuota con y sin discusión, veamos cuándo necesitamos usarlos. Me siento usado permitirme contaminar la escuela global en JavaScript. Las variables definidas dentro de la función están en alcance local, mientras que las variables definidas fuera de la función están en la escuela global. Debido a que el cuchillo, es una función en una valiosa declarar dentro de ella. Nuestro local a esa función. Esto te ayudará a evitar colisiones entre tus objetos de valor y otros ya en variables definidas con el mismo nombre en el ámbito global. Esta técnica es muy popular entre los desarrolladores se llamó Will se usará en la aplicación de otra persona . Yo honorarios también se utilizan recintos. Hay algo que no mencioné en la lección de cierre. Cierres, almacenar referencias a las funciones exteriores. Objetos de valor. No inician los mitones y ejemplos reales de valor. Se puede entender lo que acabo de decir para hacer que las cosas interesen en su uso, lo que aprendimos sobre matrices y objetos y crear una matriz de objetos llamados perros. Cada objeto contiene el nombre y la raza de un perro. Aquí tengo una función llamada perritos. Esta función quita una matriz de objetos oscuros, y Richard y Ray o funciones que saca el nombre y respirar se enfriaron. Déjame llamar a esta función perritos. En primer lugar. Voy a mezclarme sobre el espacio. Ellos, yo diría Andi de Sochi. Voy a pasar nuestra matriz de perros a ella. Por lo que esta función devuelve una matriz o funciones algunas voy a declarar una función de muelles de oro variable en. Llegaremos ahí función devuelta en esta valiosa. Ahora voy a obtener la primera función usando la notación corchetes nosotros. Por lo que antes voy a asignar esto a un valioso Andi, lo nombraría roto en True. Ahora que tienen la primera función lo alertaré antes de ejecutar este script. ¿ Qué esperas ver? Porque estamos recibiendo el primer elemento de las funciones ray off. Suena razonable de esperar. Mi nombre es Pickle y, um, un carajo, pero lo que veremos es totalmente diferente. Aquí tenemos forro es Lulu y soy un portal Ese es el último objeto en nuestra matriz fuera de los perros. Entonces, ¿qué está pasando aquí? Estamos empujando a los perros hacia una Que Y como saben, esta disfunción está tomando valiosa desde afuera y usándola dentro. Eso es lo que llamamos antes del cierre. Nuestra función es cerrar sobre perro, lo que significa que tenemos una referencia a esa variable. El problema aquí es que tenemos un bucle que está cambiando el valor de este valioso. cuando nuestro bucle tenga para el lector y para su finalización, nuestros cierres harán referencia al último objeto con el nombre Lulu. Cuando ejecutemos la siguiente línea, lo que conseguiremos es mi nombre es Lou y un total bien. Hasta el momento, entendemos por qué nuestro código no funciona correctamente. Para arreglar esto, vamos a cerrar por algo que no cambia. En lugar de cerrar sobre algo que cambia. Y nuestra amiga Ivy nos ayudará a lograr esto. Voy a hacer algunos cambios. Voy a poner todo esto dentro de un cuchillo E. Así que aquí diría función que tiene él para mí, también. En la granja la naturaleza estarán los perros van a decir el para la comida. Y aquí voy a cambiar en el nombre valioso con el solo para hacer las cosas más jueguen para ti. Necesito otro nacimiento está aquí y eso es todo. Asegúrate de tener todas las piezas de tus padres y corchetes rizados en los lugares correctos Aquí. El perímetro todavía cambia cada vez a través del bucle. Pero la función que agregamos se ejecuta de inmediato. Se está ejecutando dentro del bucle como puntera opuesta después de que la caída ya haya terminado. Ahora nuestro código vamos a trabajar tal y como esperamos. Entonces tenemos un mensaje diciendo que mi nombre es vehículo y soy un pavo 18. Modelo de objetos de documento (DOM): cuando abres una página Web en tu navegador, lo que ves es una combinación de CSS HTML y JavaScript. Trabajar juntos para crear se mostraría para tener sentido fuera de esta mezcla, tu navegador sigue una cierta estructura jerárquica. A la estructura se le conoce como el modelo de objeto de documento para el dunk de la izquierda es un ejemplo fuera de HTML. Perra a la derecha es como se veía el basurero de este ejemplo. El estiércol se compone de elementos de cada canal, atributos de texto y muchas otras cosas. Todas estas cosas se conocen como notas. Cada elemento HTML está asociado a un niño. Por ejemplo, un elemento de muerte está en cada general, el elemento todas las tribus se extienden desde el objeto nodo. El dunk no permite Onley acceder a cada elemento Jamel, sino también modificar esos elementos antes de aprender a hacer esto. Permítanme presentar primero a un objetos especiales el objeto ventana representa la ventana del navegador . Es el camino fuera de tu jerarquía. Puedes hacer muchas cosas con objeto de ventana, como determinar el tamaño fuera de la ventana del navegador. Manipulando marcos jugando con esta barra de desplazamiento y mucho más objeto de documento representan tu página web. Es el punto de partida si quieres acceder a cualquier borde. Danielle Element en una página No, que cualquier cambio que realices a la cúpula vía JavaScript se reflejaría en lo que se muestra en tu navegador. Esto significa que puedes hacer todo tipo de cambios, como agregar un elemento, quitarlo estilo en tu contenido ¿CSS y mucho más? Por lo que tienes todos estos elementos HTML colgando en tu página y quieres acceder a esos elementos o modificarlos. En esta lección, vamos a aprender a utilizar dos métodos llamados selector cuadrado y selector de consultas, todos para encontrar elementos en la cúpula. El método selector de consultas toma como argumento una cadena que contiene un selector CSS. Queers Elector devuelve el primer elemento que coincide con el selector especificado, mientras que Selector de Cuadros todos devuelve una lista del elemento que coincide con el selector especificado . Echemos un vistazo al siguiente código HTML Aquí tenemos a la muerte con un I D off menu y contenido, respectivamente, y luego tenemos otras dos vidas con un valor de clase off item y agrega cada una de ellas contenidas a gastar elementos. Ahora vamos a ver qué sucede cuando se utiliza el selector de coro y selector queer todos los métodos en este código HTML. Entonces si quiero acceso del dedo del pie, la muerte fue idee es menú. Todo lo que tengo que hacer es llamar a mi método selector queer y pasarle el menú I D. No olvides poner primero el signo numérico porque es un I d. Por otro lado, si quiero acceder al Dave Element que tiene una clase llamada ítem, bueno, tengo que hacer es llamar a mi selector queer y darle el no están en esta vez con un punto frente a ella. Si quiero seleccionar todo este impuesto de plan que están dentro de nuestra clase, ese rubro también se contiendan en nuestro elemento de defunción. Gana con un menú i d off. Todo lo que tengo que hacer es llamar a mi método selector de consulta todo porque tenemos múltiples ítems y luego así el selector Sears A apropiado. Hasta el momento, tienes una idea general fuera de lo que es el perro y también sabes encontrar elementos cuyo selector de indagación y selector queer todo lo que serás. El viento la mayoría del tiempo está modificando la cúpula. You 're don elements contienen propiedades que permiten obtener y establecer valores y llamar a métodos la funcionalidad cada elementos tontos proporciona un spread a través del elemento nod y los buzos basados en elementos HTML, tal como vimos antes con herencia. Echemos un vistazo al siguiente código HTML e intentemos modificar las cosas por aquí. Se puede ver un párrafo, este plano algunos MIPs de Laura indexados. Para aquellos de ustedes que no saben qué alarma es Epsom, es un texto de relleno utilizado para demostrar elementos textuales antes de que se haya producido el contenido en sí . Entonces vamos a cambiar la ley. Remit envió texto. En primer lugar, necesitamos obtener un dedo del pie de referencia, nuestro párrafo usando nuestro antiguo selector de consultas amigo. Para ello, voy a declarar una variable llamada entonces ya que su valor a documento no consulta selector, luego pasó el párrafo I d a este método. A continuación utilizaremos un contenido de texto frío propiedad para reemplazar el Lauren Ipsum por algún contenido realmente significativo. Entonces usando nuestra variable de párrafo va a decir Bogra dot contenido de texto. Entonces estableceré el texto para rizar contenido significativo. Entonces ahora si estuviéramos en nuestro guión, se puede ver que el texto ha cambiado todos sus elementos Jamil pueden tener atributos. Proporcionan información adicional sobre un elemento. Por ejemplo, el atributo riff de ceniza off en un tanque para obtener el valor de un tributo, usaremos el método. Consigue un tributo. Entonces aquí, si quiero obtener el valor de los atributos Ashraf todo lo que tengo que hacer su primer año plazas elector para obtener una referencia a la hora una etiqueta luego almacenó este dedo de referencia una variable. Yo lo llamé link. Entonces recuerdo mi método get attribute en este valioso en. Vuelvo más allá del nombre fuera del atributo. Si ejecuto el script, debería obtener este valor. Si desea sentar un valor para su atributo, puede utilizar el atributo de conjunto de métodos. Por ejemplo, si quiero cambiar esto de mi sitio web dot com a otro sitio web dot com, lo que tengo que hacer es usar mi variable de enlace que tiene la referencia a la etiqueta ocho Estar usando el método de atributo sit. Ahora puedo especificar el tributo sobre el que quiero cambiar el valor, luego el valor, el nuevo valor que quiero. Entonces aquí, si ejecuto el script, debería conseguir otro sitio web dot com 19. Estilizar tu sitio web: En la lección anterior, aprendimos cómo modificar los elementos del amanecer usando JavaScript, pero los elementos HTML no son solo X y atributos. También hay un parque estético para ellos. Hablo de su estudio. El más común donde se utiliza para vender cada elemento terminal es mediante la creación de una hoja de estilo y ponerla y poner en reglas de estilo dentro de ella. Por ejemplo, esta regla de estilo afectaría en elemento que se ve así. Aparte del INL Einstein, hay otro enfoque que puedes usar para empezar las cosas. Este enfoque implica usar lo tonto y JavaScript. Es posible usar JavaScript para iniciar elementos, y eso es lo que vamos a aprender. Podría preguntar, ¿Por qué alguna vez querría usar JavaScript para estilo en Element? Esa es una buena pregunta cuando se usan hojas de estilo o en líneas tiempos el estilo en Texas efecto tan pronto como se carga el estiloso como se carga la página. Ese sería tu objetivo la mayor parte del tiempo. Pero a veces se quiere hacer algunos cambios dinámicamente, como ocultar algo cuando el usuario hace clic en un botón. En este caso, las reglas de estilo o en líneas los tiempos no te ayudarán, por lo que la solución es usar JavaScript. Hay dos formas de estilo en elemento usando JavaScript. Una forma es establecer una propiedad CSS directamente sobre el elemento. La otra forma es agregar o eliminar valores de clase de un elemento con el fin de aplicar o ignorar ciertas reglas laterales Para establecer una propiedad CSS directamente sobre un elemento, puede utilizar el objeto Stein. En este ejemplo, tengo un elemento diff con un 90 de descuento mi muerte. Quiero sentar el fondo fuera de este elemento a un color azul. En primer lugar, obtuve mi referencia ocular a mi elemento def aquí. No usé selector cuadrado, pero utilicé otro método llamado get element by i. D. Este es otro método muy útil para seleccionar un elemento por su d noto cómo no puse ningún signo numérico. Le doy directamente el valor de la I. D. Siguiente, usando mi Dave valioso, llamé al objeto de estilo luego la propiedad de color de fondo y establecí su valor en azul. Ahora, si alrededor de este guión, puedes ver que me dan un aviso de fondo soplado cómo escribí la propiedad de color de fondo normalmente en CNN s s la escribirías con un guión entre fondo y color si lo hiciéramos aquí, sin embargo, JavaScript con quejas. Entonces para especificar una propiedad CSS en JavaScript que contenga un guión simplemente elimine el guión y capitalice la primera letra de la segunda palabra. La segunda forma de dar estilo a los elementos es mediante el uso de la lista de clases. AP en sin clases. El FBI proporciona métodos y propiedades para manipular valores de clase de elementos dom como agregar o quitar clases. Veamos algunos de estos métodos aquí. Tengo un elemento diff que tiene una idea de contenedor en el valor de clase fuera de descripción. Si quiero agregar el valor de clase trajo eso, por ejemplo, por ejemplo, a los atributos de clase fuera de nuestro elemento de muerte. En primer lugar, empezaré por obtener una referencia al Elemento Dave. Estaba en el elemento get Por qué d método. Después usaré el entrenador difícil y llamaré al admitido en la lista de clases y rápido el nombre fuera de la nueva clase que quiero. Entonces esto debería bajo los diferentes valores de clase que tenemos. Si ejecuto este script, lo que obtendremos es descripción y rompió que si quiero relacionar un valor de clase Todo lo que tengo que hacer es reemplazar lo admitido por el método remove. Ahora esto debería alertar sobre Lee el cristal de descripción. En ocasiones se desea eliminar un valor de clase si existe o hacer lo contrario y en ese valor de clase al elemento. Si no existe para hacer esto fácil, existe un método Tuggle proporcionado por el FBI sin clases. Lo último que hicimos fue quitar el valor de la clase de producto. Si quería, Toe añadió otra vez, Bueno, tengo que hacer es reemplazar más. Nada con método de lucha. Ahora bien, si quiero mi guión, el valor de la clase de producto estaría en otra vez. Si vuelvo y copio y ayudo esta línea, el valor de la clase de producto debe ser removido de nuevo. Entonces lo que deberíamos conseguir es en Lee la clase de descripción. Puedo seguir haciendo esto todo el día, así que si no puedo ser esta línea otra intentando y copiarlo. El valor de la clase de protección debe agregarse en otro momento. Si quiero comprobar si existe un valor de clase en un elemento, puedo usar el método contains. Este método devuelve true si el valor existe o se pliega de lo contrario. El último que hicimos fue en el valor de la clase de producto. Por lo que los contendientes netos debieran devolver verdadero. En este caso, voy a la para usar una declaración if y ver si existe el valor de la clase de producto. Voy a reemplazar el método de la selva con contiene y decir, si esto es igual a dos. Es cierto, entonces no haría daño a un mensaje diciendo que existe el producto de valor de clase. Como pueden ver, ese es el mensaje que obtenemos. 20. Navegar el DOM: antes usábamos consulta, selector, selector Queer Selector todo y obtener elemento. Por qué d dedo del pie accedo elementos html. Una vez que hacemos esto, es responsable de moverse más precisamente usando un montón de métodos y propiedades fuera. Digamos, por ejemplo, queremos acceder en elementos padre. Para ello, tenemos una propiedad llamada Parent Node. Aquí tenemos un párrafo con un i d off párrafo. Accedo a este elemento usando el método que vimos antes, que es selector cuadrado. Por alguna razón. Digamos que necesitamos acceder al elemento de muerte, que también es el padre fuera de nuestro párrafo. La forma de hacerlo es mediante el uso de la propiedad del nodo padre. Puedo llamar a esta propiedad en mi esa variable de párrafo. Entonces puedo asignar el dedo valioso. Y ahora tenemos un don, Sesto, Sesto, nuestro elemento de muerte, que es el padre fuera de nuestro párrafo. Si desea acceder a un primer y último elemento padres, puede utilizar métodos de primer hijo y último hijo. En este ejemplo, el primer hijo de nuestro elemento de párrafo es un nodo de texto representado por algún texto, y el último hijo está en un elemento de etiqueta. Si desea recuperar los Hijos que son notas de elemento y no nodos de texto puede utilizar a propiedades. Primer elemento hijo y último elemento hijo. Otra propiedad útil son las notas infantiles. Esta propiedad devuelve una matriz que contiene una lista de Niños, a menudo elemento. Si desea acceder al siguiente Devlin o informar a su elemento siete a menudo, puede utilizar las siguientes siete propiedades y las siete anteriores. En este ejemplo, encontramos el elemento de corte de sangre usando su I D. Entonces accedemos a su próximo hermano, que es el elemento a. Este un elemento tiene un hijo, y este niño es un fijo. Saber que dice's y el pensar. Entonces, ¿esto tocaba los palos? Utilizo la propiedad llamada datos. El inmueble de siete anteriores se utiliza de la misma manera. Si lo aplicamos aquí, obtendremos el elemento de párrafo en lugar del elemento a. Si estás siguiendo y copiando el código, asegúrate de no dejar ningún espacio o saltos de línea entre los elementos de la calle porque en algunos navegadores se consideran espacios y saltos de línea, notas de texto también asegúrate de usar la última versión de Google chrome para que puedas obtener el mismo resultado que yo 21. Crear e insertar elementos: No logré General Element con el texto domo tres pasos. Primero creamos el elemento, luego le asignamos atributos. Y finalmente insertamos en el documento para crear un elemento que usamos para crear método de elemento . Este elemento ahora se crea pero no se inserta en el documento, por lo que no es visible, pero ya podemos manipular agregando algún atributo. Vimos a Ho para agregar atributos. Estaba interesado atributos método. Pero también podemos definir atributos directamente usando un D quit propiedades. Por ejemplo, puedo definir un atributo I d. directamente escribiendo el siguiente enlace Dodge I d. Entonces daré el valor que quiero, por ejemplo, mi enlace. Ahora es el momento de insertar el elemento creativo. Para ello, usaremos el método del niño suceda como se puede obtener de su nombre. Necesitamos saber a qué elemento vamos a añadir el elemento creativo. Vamos a agregar nuestro un elemento dentro de nuestro elemento de párrafo, Así que necesitamos obtener primero este elemento de párrafo. Para ello, voy a utilizar el elemento get by I d método. Ahora puedo usar el método de arma niño para agregar nuestra imagen a L. Ahora que hemos insertado nuestro elemento, falta algo el contenido del texto. Afortunadamente, tenemos un método de nodo de texto creado que nos ayuda a hacer esto. Voy a declarar una variable llamada Enlace Fijo. Ahí hay variable mantendrá el valor o el contenido de texto que queremos agregar a nuestros elementos. Es un documento que crea mazos. No digamos, por ejemplo, por ejemplo, mi sitio web de Suker. No, todo lo que tenemos que hacer es en dis text nuestro elemento recién insertado usando otro niño. Entonces voy a llamar valioso al enlace. Um, estaba arriba en longitud infantil, fijo en JavaScript. Al igual que muchos otros idiomas, el contenido de las variables se pasa por valor. Esto significa, si es un nombre valioso, uno contiene ónix y asignamos este valor a otro valioso. Ese valor se copia en el nuevo. Si cambiamos el valor off name también, el valor off name uno no cambia eso. Tus variables son distintas. Además de pasar por valor, JavaScript tiene un pasado por referencia. Esto nos permite tener a objetos de valor que apuntan al mismo valor. Te digo todo esto porque cuando manipulamos una página usando lo tonto ingresamos a referencias mucho volviendo a nuestro ejemplo. Voy a acceder al elemento recién insertado años en la idea se lo dará para hacer esto. Voy a declarar una variable llamada mi enlace usando documento que obtengo elemento por qué d Obtendré mi enlace usando esta idea igual que mi alma antes de que voy a usar la propiedad hash riff para acceder directamente a mi enlace. Entonces voy a cambiar este sitio web Así que otro sitio web para que no hayamos pensado valioso. Eso contiene una referencia a lo creado un elemento. Y también tenemos mi variable de enlace que también contiene un referente a ese elemento. Aquí lo uso el segundo valioso mi enlace para acceder a la propiedad H Rafe y cambiar la u R l. pero si vengo aquí y alerto el valor de la propiedad de cada ref usando el primer enlace valioso , lo que obtendré no es el primero u l, pero el nuevo euro, que es otro sitio web dot com. El verdadero valor apunta al mismo valor. Por eso cuando usamos uno de ellos para cambiar este valor, podemos ver ese cambio usaríamos también al otro valioso. ¿ Y si queremos duplicar un elemento? ¿ Qué debemos hacer? Bueno, hay que clonarlo para clonar un elemento utilizado el clon. Sin método. Este método toma un 1,000.000.000 ya sea verdadero o falso. Si desea clonar el nodo con sus Hijos y eventualmente diferentes atributos, use true de lo contrario. Usar falso. Tenga en cuenta que el elemento clonado no se inserta hasta que recupere el método hijo arma para reemplazar un elemento por otro usado para reemplazar el método hijo. Este método toma dos argumentos. El primer argumento es el nuevo elemento. El segundo argumento es el elemento a sustituir. Al igual que la nota baja. Este método se puede utilizar en todo tipo de notas, elementos, notas de texto, etcétera. En este ejemplo, el contenido de texto fuera del enlace, que es el primer hijo fuera del elemento a, será reemplazado Aquí. Ahí. Vice child se ejecuta en el elemento a, que es el padre fuera del elemento que queremos reemplazar. Para eliminar un elemento, utilice el método. Quitar niño. Este método toma como argumento que elementos hijos quieres tu movimiento. Aquí usamos la propiedad pound note con so antes para obtener el nodo padre, que es el elemento de párrafo, luego un usado remove child para quitar el elemento A. No, ese remove child devuelve el elemento eliminado, lo que significa que es totalmente posible eliminar un elemento, luego añadido Una vez más, Como puedes ver, mudo es algo que podemos modificar según nuestras necesidades. Entonces no hay nada que te detenga de crear todos tus elementos usando script Java. 22. Eventos: son acciones que ocurren cuando el usuario o el navegador manipula una página. Un ejemplo de un evento es un usuario haciendo clic en un botón, cerrando una ventana o personificando una clave. Podrás responder a eventos que quieras. Por ejemplo, puede mostrar un cuadro de diálogo en los años de intentar cerrar la ventana. Evita aburrirte Con todos los eventos existentes, Aquí tienes una lista de los principales eventos y acciones que los desencadenan. No te preocupes, incluiré esta presentación power print con el curso para que puedas tener esta lista y todas las demás diapositivas también. Aprendamos cómo usar realmente estos eventos. Vamos a empezar con algo fácil que no involucre a la cúpula. Veremos cómo utilizar los eventos con ellos más adelante. Aquí tengo un elemento span dentro de atributos llamado un clic. Este atributo tiene un JavaScript llamado como valor. Este código JavaScript es la función de alerta, mostrando un mensaje apagado. Hola, Vamos de descript y veamos qué pasa. Como se puede adivinar a esta jugada el mensaje holo. Todo lo que tenemos que hacer es simplemente dar click en el texto que dice Quick, yo Así que cuando hacemos esto, puedes ver que un mensaje diciendo hola aparece otro atributo. Yo quiero mostrarles aquí su propio enfoque. Tengo cualquier elemento de entrada con un valor off toma aquí y aquí. Tengo los propios atributos de enfoque cuando le damos a este elemento el foco, su cambio de valor de click aquí para presionar la tecla tabulador. Ahora, cuando el foco se apaga, el valor se convierte en clic aquí de nuevo. El elemento tiene también en el enfoque hogareño. Atributo. Esta vez, cuando le damos el enfoque al elemento, cambia el valor de la importación a ti Ahora ten el foco en el enlace. Ejecutemos este guión y veamos qué pasa. Es muy tener mi elemento de importación con un valor off click aquí, usted factoriza el cuidado. puede ver que es valor cambiado para presionar el pavo. Ahora bien, si yo presidente soy tecla en mi teclado, el enfoque va al link y el valor de la importación cambió. ¿ Sabes cómo el enfoque en la línea Ahora que vimos cómo usar los eventos sin lo tonto, es momento de involucrarse el tiempo. Podría preguntarse por qué usar el pulgar Bueno, si usamos el tonto. Podremos crear el mismo evento varias veces, y también podemos usar el objeto de evento, que te da mucha información sobre los eventos desencadenados. Vamos a enviar ejemplo usando el evento click aquí tenemos un elemento con un i D off link. Empiezo usando el método Queer Selector para obtener una referencia a ese elemento. Entonces uso mi elemento valioso y llamo al método de escucha de eventos de anuncio en él. El método oyente de eventos de arte toma tres argumentos, aunque sólo especificamos a aquí. El primer argumento es el nombre del evento. Sin lo adelante, el segundo argumento es la función a ejecutar. El tercer argumento, que es opcional, tiene que ver con el burbujeo y la captura de eventos. Hablaremos de esto más adelante. Corremos esta fruta y veamos qué pasa. Como puedes ver, cuando hago clic en el elemento un mensaje aparece civil, haces clic en el enlace. Como dije antes, cuando usó el tonto, podemos crear varias veces el mismo evento para el mismo elemento para que pueda hacer lo siguiente . Voy a copiar esto en Basij. Entonces cambiaré de alerta a, y tienes un segundo mensaje. Ahora si guardo esto y dibujé el interruptor, puedo ver que cuando hago clic aquí, obtengo el primer mensaje diciendo Usted hizo clic en un enlace y me sale también la segunda señora Ahora vamos a ver cómo quitar un evento. Esto se puede hacer. Estaba en el método de escucha de eventos eliminado. Para eliminar un evento, tienes que pasar los mismos argumentos que usaste al crear ese evento. Esto puede ser un problema si quieres crear un evento con función anónima porque no tenemos una referencia a esa función para usar con el oyente de eventos remove. Si vengo en esta línea y dibujando el guión, puedes ver que obtengo el mensaje al hacer clic en el enlace. No obstante, cuando poco común esto y estamos en el guión, pesar de que hago clic en el enlace, no pasa nada. Recuerda cuando vimos por primera vez al oyente del evento del anuncio. Te dije que este método argumentos extra y que vamos a ver el uso del tercer argumento más adelante. Bueno, soy un hombre de palabra. El tercer argumento tiene que ver con algo llamado embotellar y capturar, burbujear y capturar son pasos demasiado lejanos para la ejecución. A menudo, la captura de eventos se ejecuta antes de desencadenar un evento, mientras que el burbujeo se ejecuta después de que se ha activado un evento. Ambos definían con frecuencia la dirección de propagación. Evento. ¿ Qué es un evento? Propagación? Vamos a usar un ejemplo para explicar. Si asignamos un evento click nuestro desarrollo y nuestro elemento P y damos click en las cubiertas. Algún texto. ¿ Qué eventos serán difíciles al principio? Buena pregunta. No, la respuesta yace con capturar y burbujear. Si decides usar la captura, entonces el evento Dave se activará primero. Entonces el evento de cuota viene después. Por otro lado, si hace años burbujeando, ese evento de día se activará primero. Después viene el DIV uno tras él. Tenga en cuenta que la cara predeterminada es la cara burbujeante. Veamos un ejemplo para ilustrar lo que dije aquí tengo a los elementos. El elemento de primer paso tiene una idea fuera. Capturar uno dentro de este el elemento tengo un elemento de párrafo off capturaría el segundo elemento tiene un I D off pero uno y dentro de este elemento Dave, tengo un párrafo con un i d off a lo primero que hago es conseguir las referencias a mi elementos. Observe cómo usé en Lee una de nuestras palabras clave para definir cuatro variables. Todo lo que tengo que hacer es coma de pie después de cada variable y un semi colon al final. A continuación, creé mis eventos, y esta vez especificé el tercer argumento, que o toma verdadero o falso. Si especifica true como argumento, esto significa que usará la captura. Si usas la captura, entonces el elemento de muerte se activará primero. Entonces el evento viene después de él. Entonces vamos a ejecutar nuestro guión y ver qué pasa. Si hago clic en Capitán Cara un mensaje que se muestra, digamos. Y si el evento es recto, entonces el Distrito de Eventos P. Si especificas nos tonta, el argumento. Esto significa que estarás zumando burbujeando Si usas burbujeo, el evento B se activará primero, luego lo hizo el div. Uno viene después de él, Entonces, como se puede ver cuando hago clic en la cara burbujeante, el evento se activa primero. Entonces el evento diff es jaker segundo 23. El objeto de eventos: anteriormente, vimos cómo crear eventos bajo movimiento. Sigamos adelante y veamos el objeto de evento. En primer lugar, ¿qué hace este objeto? Bueno, el objeto de evento te da información sobre el evento actualmente activado. Por ejemplo, se puede saber qué elemento ha desencadenado ese evento. Las coordenadas del cursor qué claves son tu persona, cosa actual y mucho más. Se puede acceder a este objeto. Onley fn Evento tiene un curado. Su acceso sólo se puede hacer a través de una función que ha sido ejecutada por el evento. Digamos un ejemplo aquí. El objeto de evento está sesgado por una referencia al argumento function. Yo nombré el Argumento E, pero puedes elegir cualquier nombre que quieras. Alertar aquí mostrará el tipo fuera del evento que en este caso es un rápido vimos la propiedad de tipo que nos dice qué tipo de evento se ha activado. Ahora es el momento de ver otras propiedades y métodos del objeto de evento. Una de las propiedades más importantes fuera de nuestro objeto de evento es el objetivo. Estas devoluciones de propiedad se hacen referencia al elemento cuyo evento se ha desencadenado. Por ejemplo, puedo cambiar el contenido a menudo elemento en el que se ha hecho clic. No, es otro escenario cuando aplicas algunos eventos como la mayoría sobre click etcétera. Nota aparente. Esos eventos también se pueden difundir entre los Niños. Notas. Es un ejemplo para entender lo que acabo de decir aquí. Tengo un desarrollo cuando lo hice con un padre de 80 descuento. Este desarrollo cuenta con dos Niños niño número uno en niño número dos. Apliqué un evento mouse sobre este padre. Cuando se desencadene este evento más sobre, el contenido del texto fuera de nuestro párrafo cambiará en pantalla el i D off the triggering element. Es ejecutar el script y ver qué pasa, como se puede ver cuando pongo mi musgo sobre el elemento de libra y mensaje Así que tú y el elemento desencadenante tienen un I. D off parent se muestra cuando quiero cambiar uno. La idea cambió a su hijo. Uno. Sucedió lo mismo cuando paso al timbre número dos. El I D cambió a Canal dos, pero ¿y si queremos conseguir el elemento en el que aplicamos el evento? En este caso, es el elemento padre. Todo lo que tenemos que hacer es reemplazar la propiedad objetivo con actual John get property después cambiar esta línea, el I t Siempre será un padre incluso cuando ponga mi ratón sobre los Niños. Otra información muy importante que ofrece el objeto de evento es la posición del cursor. Esto es ampliamente utilizado, especialmente en el script de arrastrar y soltar. Generalmente, obtenemos la posición del cursor relacionada con la manzana esquina izquierda fuera de la página del mundo para sacar la posición de nuestro cursor a propiedades existen huevos del cliente para el coordinate horizontal y cliente. ¿ Por qué para el coordinado vertical? Debido a que la posición de visita superficial cambia cada vez, el más movimiento, el evento de movimiento del ratón está ahí para que el más apropiado use en la mayoría de los casos para saber qué teclas se presionan. Contamos con tres propiedades diferentes. Si bien eso puede parecer demasiado, no 40. Es muy sencillo. Tuvimos el evento key up, que se activa cuando el usuario libera una tecla en el teclado. El evento K 't, que se activa cuando el usuario presiona una tecla. El tercer evento escapan Chris. Este evento está lejos cuando una clave que produce un personaje valorado s pecho hacia abajo. El verdadero beneficio fuera de Cape Press es que puede detectar combinaciones K. Entonces si presiono turno y un evento de alcaparras detectará una A mayúscula donde se escalan y K hacia abajo . Defensa será despedido dos veces si presiono turno y una vez para el Shefki en el 2do 1 Para que la tecla A consiga el botón del teclado que se presionó, gana un evento de teclas. Ocurren. Utilice la propiedad key. Esta propiedad devuelve una cadena que no te agradezcan botones de tablero, congee de distrito, un solo carácter como F o T o cuatro o multi carácter como enter o caps lock. Muchos elementos HTML muestran un comportamiento predeterminado cuando interactúas con ellos. Por ejemplo, si haces clic en un enlace, te redirigirá a nuestra página web. Es posible bloquear este comportamiento predeterminado mediante el uso de un método llamado Prevent Default. Ejecutemos el guión y veamos qué sucede aquí. Tengo mi enlace. Si hago clic en este enlace, no pasó nada. Nuestro método de prevención default está funcionando como un encanto 24. Formularios: trabajar con formularios es algo en lo que vas a hacer mucho. Los formularios JavaScript son sencillos de usar, sin embargo, necesitas conseguir algunas propiedades bajo rebelde. En primer lugar, podemos acceder a las propiedades fuera de los elementos del formulario directamente utilizando sus nombres como valor deshabilitado, chequeado etcétera. Veamos un ejemplo aquí. Tengo un elemento importante. A menudo me d. Siguiente. El valor de este elemento es que necesito su enfoque, por favor. Empiezo por obtener una referencia a mi elemento. No iba a conseguir elemento mi método I D. Entonces tuve dos eventos a este elemento de entrada. El primer evento es el evento de foco. Cuando el elemento de entrada obtiene el foco, su valor también cambió. Genial A. Ten tu foco. Cuando el foco se deshace de su valor. Vuelve a Necesito tu enfoque, Por favor. Encontremos el guión y veamos qué pasa. Ahora nuestra importación íntima no tiene que enfocarse. Cuando hago clic en él, el elemento obtiene el foco y es que cambiaste demasiado grande. Yo tengo tu enfoque cuando el foco se va de la conducta de valor a la vieja, que es necesito tu enfoque, por favor. Cuando estás en las propiedades desactivadas comprobar y leer solo en HTML escribiríamos algo como esto. Aquí tengo una casilla de verificación para preseleccionarlo. Utilizar la propiedad comprobada. Se puede ver que no. Esta propiedad nos lleva a beber como valor. Pero en JavaScript thes propiedades comenzaron en realidad miles de millones. Entonces si quiero seleccionar esas chequeras, escribirías algo como esto el primer inicio consiguiendo una referencia para hacer tu elemento como siempre lo hacemos. A continuación, especifica la propiedad comprobada y da listas desplegables verdaderas o falsas tienen sus propias propiedades. Vamos a aprender sobre Lee a cuáles son el índice seleccionado más importante que devuelve el índice de la opción seleccionada y opciones que devuelve una lista fuera del elemento de todas las opciones en nuestra lista desplegable. Como de costumbre, digamos un ejemplo aquí tengo una lista desplegable con diferentes opciones. Empiezo por obtener una referencia a esta lista usando su I D. Luego agrego un evento de cambio a esta lista. Este evento de cambio se activa siempre que elijo una opción diferente. Lo que quiero hacer es mostrar el continente fuera del elemento de opción seleccionado, así que utilicé opciones e índice seleccionado juntos para obtener la opción que selecciono, luego usando la propiedad de recuento de texto, puedo obtener el contenido de ese seleccionado opción. Encontremos el guión y veamos qué pasa. Como puedes ver cuando selecciono la opción casual, se muestra. Si elijo una opción diferente, también se muestra. Los formularios no tienen propiedades Onley. Hay algunos métodos realmente útiles. Es cierto que una forma tiene dos métodos interesantes. Se presenta el 1er 1 que permite enviar el formulario sin la intervención del usuario. restablece el 2do 1 quien restablece los campos de formulario. Si tienes alguna experiencia con formularios HTML, probablemente sepas que estos dos métodos tienen las mismas reglas que enviar y restablecer en los elementos de importación. 25. Herramientas de desarrolladores: contrario a lo que uno podría pensar que el navegador no sólo se muestran con páginas. También proporcionan un set off con el bug en herramientas para que los desarrolladores accedan a su aplicación Web . A estas herramientas se les conoce como herramientas de desarrollo o herramientas de muerte para abreviar. En esta lección, vamos a echar un vistazo a la distancia y aprender a juguetear con Overcoat. Estaré usando Google Chrome para mis ejemplos. Trabajo en ellos para hacer lo mismo para que puedas seguir conmigo. Otros browses también proporcionan funcionalidades similares a lo que te estaré mostrando, pero las escaleras para llegar serán diferentes. Para abrir los peajes de muerte, tienes tres vías. El primer camino es ir al menú principal de migas. Selecciona mortales y haz clic en herramientas de desarrollador. Segunda Vía es a la derecha, haga clic y seleccione Inspeccionar. El tercer camino es el control deprimido. Cambiar nuestra opción de comando o. Yo Si tu propio Mac, lo que vas a ver es una barra de troll con un montón de vitamina it. Cada elemento literalmente hace una prueba específica. El panel Elementos te da una vista fuera de tu tonto y te permite inspeccionar los elementos hacia abajo y editarlos también. Estarás visitando este panel con bastante frecuencia si quieres identificar el código HTML de alguna parte de tu página, como ver si un elemento tiene una idea, tributo y qué valor se le asigna. Otra funcionalidad poderosa y muy utilizada es el Consejo Consejo brinda muchas funciones para que los desarrolladores prueben su aplicación Web. Al igual que Logan, información diagnóstica durante proceso de desarrollo e interactuar con el documento y reptiles que se encuentra en una concha impulsan al consejo. El FBI proporciona un método muy poderoso por sí solo. Se percataron de esa información llamó consejo que log usando consejo esa ley. Puedo ver el valor off, mi resultado valioso. Si vuelvo al cabildo bajo primera etapa, se puede ver que obtengo valor por usar el abogado al bicho es mucho más superior que tuya y otra sanción. Si utilizas el cabildo, puedes comprobar si tu código está funcionando sin esas molestas e interrumpidas cajas de diálogo . El Consejo Ese método log también es muy práctico. estado tratando de visualizar el contenido, a menudo objeto si utilizo la otra función. Todo lo que consigo es un mensaje disciplina, objeto , objeto, que no dice mucho, pero con el consejo que log, podemos mostrar el contenido fuera de nuestro objeto, como se puede ver aquí. Si los desarrolladores quieren construir unaaplicación JavaScript grande y compleja, aplicación JavaScript grande y compleja, necesitan una forma eficiente y rápida de descubrir la causa detrás de un error y solucionarlo. Aquí es donde la muerte pega con sus herramientas de menú. Viene al rescate y hacer el bicho en mucho. Úsalo mucho más fácil en tus herramientas de desarrollador. Haga clic en la superficie final. Asegúrate de seleccionar el distante cada archivo Daniel de la izquierda o la multa con la que estés trabajando en este momento. Esto hará que el contenido de este archivo aparezca a la derecha. Digamos que queremos ver si nuestra función de multiplicación está devolviendo el valor correcto . Para ello, giraré el navegador para detenerme en la declaración de retorno para ver cuál es el valor de por qué es La forma de hacerlo es sentando un punto de interrupción para establecer un punto de interrupción click a la izquierda aquí . Una vez que haces eso, puedes ver que el número se pone resaltado. Ahora necesitamos refrescar la página para que el navegador golpee el punto de interrupción en el momento se imponga el modo pagar la página. Si encima de lo valioso, se puede ver que es valor. ¿ Sabremos que puedes quitar un arroyo fue haciendo click en el número de línea. Si quiero retomar la ejecución fuera de mi frío, todo lo que tengo que hacer es hacer click en play. Si hay algunos otros puntos de ruptura en el código, también serán golpeados. 26. ¡Gracias por acompañarnos!: felicitaciones. Llegas al final de este curso. Date una ronda de aplausos. Definitivamente te lo mereces. Gracias por aprender JavaScript conmigo. Se divertían tanto durante este curso. Y espero que tú también lo hicieras . Después de seguir junto con este curso ahora debe entender las colillas esenciales fuera JavaScript. Si quieres llevar tus habilidades de JavaScript al siguiente nivel, entonces tienes que seguir practicando. ¿ Sabes lo que dicen? La práctica hace perfecto. Así que sigue escribiendo, cotizando, construye tus propias aplicaciones y se unió a la amplia comunidad de desarrolladores de JavaScript.