grg8881m Goto Github PK

-mbito-global-vs.-local-en-funciones

Es posible tener variables locales y globales con el mismo nombre. Cuando haces esto, la variable local tiene precedencia sobre la variable global. En este ejemplo: const someVar = "Hat"; function myFun() { const someVar = "Head"; return someVar; } La función myFun devolverá la cadena Head porque está presente la versión local de la variable. Añade una variable local a la función myOutfit para sobrescribir el valor de outerWear con la cadena sweater.

-mbito-global-y-funciones

En JavaScript, el ámbito se refiere a la visibilidad de las variables. Las variables definidas fuera de un bloque de función tienen un ámbito Global. Esto significa que pueden ser observadas desde cualquier lugar en tu código JavaScript. Las variables que se declaran sin las palabras clave let o const se crean automáticamente en el ámbito global. Esto puede crear consecuencias no intencionadas en cualquier lugar de tu código o al volver a ejecutar una función. Siempre debes declarar tus variables con let o const. Usando let o const, declara una variable global llamada myGlobal fuera de cualquier función. Inicialízala con un valor de 10. Dentro de la función fun1, asigna 5 a oopsGlobal sin usar las palabras clave let o const.

-mbito-local-y-funciones

Las variables que se declaran dentro de una función, así como los parámetros de la función tienen un ámbito local. Esto significa que sólo son visibles dentro de esa función. Esta es una función myTest con una variable local llamada loc. function myTest() { const loc = "foo"; console.log(loc); } myTest(); console.log(loc); La llamada a la función myTest() mostrará la cadena foo en la consola. La línea console.log(loc) arrojará un error, ya que loc no está definida fuera de la función. El editor tiene dos console.logs para ayudarte a ver lo que está sucediendo. Revisa la consola a medida que programas para ver cómo cambia. Declara una variable local myVar dentro de myLocalScope y ejecuta las pruebas. Nota: La consola todavía mostrará el error ReferenceError: myVar is not defined, pero esto no causará que las pruebas fallen.

2d-hedersonleeh-player-controller

Player controller by hedersonleeh

a-ade-bordes-alrededor-de-tus-elementos

Los bordes CSS tienen propiedades como style (estilo), color y width (ancho). Por ejemplo, si quisiéramos crear un borde rojo de 5 píxeles alrededor de un elemento HTML, podríamos usar la siguiente clase: <style> .thin-red-border { border-color: red; border-width: 5px; border-style: solid; } </style> Crea una clase llamada thick-green-border (borde grueso verde). Esta clase debería añadir un borde verde de 10px, "solid", alrededor de un elemento HTML. Aplica esa clase a tu foto de gato. Recuerda que puedes aplicar múltiples clases a un elemento usando su atributo class, separando cada nombre de clase con un espacio. Por ejemplo: <img class="class1 class2">

a-ade-bordes-alrededor-de-tus-elementos-

Los bordes CSS tienen propiedades como style (estilo), color y width (ancho). Por ejemplo, si quisiéramos crear un borde rojo de 5 píxeles alrededor de un elemento HTML, podríamos usar la siguiente clase: <style> .thin-red-border { border-color: red; border-width: 5px; border-style: solid; } </style> Crea una clase llamada thick-green-border (borde grueso verde). Esta clase debería añadir un borde verde de 10px, "solid", alrededor de un elemento HTML. Aplica esa clase a tu foto de gato. Recuerda que puedes aplicar múltiples clases a un elemento usando su atributo class, separando cada nombre de clase con un espacio. Por ejemplo: <img class="class1 class2">

a-ade-esquinas-redondeadas-usando-border-radius

Actualmente, las esquinas de tu foto de gato son puntiagudas. Podemos redondear esas esquinas con una propiedad CSS llamada border-radius (radio del borde). Puedes especificar un border-radius usando píxeles como unidad de medida. Dale a tu foto de gato un border-radius de 10px. Nota: Este desafío acepta múltiples soluciones posibles. Por ejemplo, puedes añadir border-radius a la clase .thick-green-border o a la clase .smaller-image.

a-ade-m-rgenes-diferentes-a-cada-lado-de-un-elemento

En ocasiones, querrás personalizar un elemento para que tenga un margin diferente en cada uno de sus lados. CSS te permite controlar por separado el margin de los cuatro lados individuales de un elemento por medio de las propiedades margin-top, margin-right, margin-bottom y margin-left. Asigna a la caja azul un margin de 40px en sus lados superior e izquierdo, pero sólo de 20px en sus lados inferior y derecho.

a-ade-nuevas-propiedades-a-un-objeto-de-javascript

/*Puedes añadir nuevas propiedades a los objetos de JavaScript existentes de la misma manera que los modificarías. Así es como podríamos agregar una propiedad bark a nuestro objeto ourDog: ourDog.bark = "bow-wow"; o ourDog["bark"] = "bow-wow"; Ahora cuando evaluemos ourDog.bark, obtendremos su ladrido, bow-wow. Por ejemplo: const ourDog = { "name": "Camper", "legs": 4, "tails": 1, "friends": ["everything!"] }; ourDog.bark = "bow-wow"; Añade una propiedad bark a myDog y establécela a un sonido de perro, como "woof". Puedes usar tanto la notación de puntos como la notación de corchetes.*/

a-ade-un-margen-negativo-a-un-elemento

El margin (margen) de un elemento controla la cantidad de espacio entre su border y los elementos que lo rodean. Si estableces el margin de un elemento a un valor negativo, el elemento crecerá de tamaño. Intenta establecer el margin a un valor negativo como el de la caja roja. Cambia el margin de la caja azul a -15px para que llene todo el ancho horizontal de la caja amarilla que lo rodea.

a-ade-un-margen-negativo-a-un-elemento-

El margin (margen) de un elemento controla la cantidad de espacio entre su border y los elementos que lo rodean. Si estableces el margin de un elemento a un valor negativo, el elemento crecerá de tamaño. Intenta establecer el margin a un valor negativo como el de la caja roja. Cambia el margin de la caja azul a -15px para que llene todo el ancho horizontal de la caja amarilla que lo rodea.

a-ade-un-padding-o-relleno-diferente-a-cada-lado-de-un-elemento

En ocasiones, querrás personalizar un elemento para que tenga un padding o relleno diferente en cada uno de sus lados. CSS te permite controlar por separado el padding de los cuatro lados individuales de un elemento por medio de las propiedades padding-top, padding-right, padding-bottom y padding-left. Asigna a la caja azul un padding de 40px en sus lados superior e izquierdo, pero sólo de 20px en sus lados inferior y derecho.

accede-a-arreglos-anidados

Como hemos visto en ejemplos anteriores, los objetos pueden contener tanto objetos anidados como así también arreglos anidados. De manera similar a como se accede a los objetos anidados, la notación de corchetes de arreglos puede ser encadenada para acceder a arreglos anidados. En el siguiente ejemplo, vemos cómo se accede a un arreglo anidado: const ourPets = [ { animalType: "cat", names: [ "Meowzer", "Fluffy", "Kit-Cat" ] }, { animalType: "dog", names: [ "Spot", "Bowser", "Frankie" ] } ]; ourPets[0].names[1]; ourPets[1].names[0]; ourPets[0].names[1] sería la cadena Fluffy, y ourPets[1].names[0] sería la cadena Spot. Utilizando la notación de puntos y corchetes, establezca la variable secondTree en el segundo elemento de la lista trees del objeto myPlants.

accede-a-arreglos-anidados-

Como hemos visto en ejemplos anteriores, los objetos pueden contener tanto objetos anidados como así también arreglos anidados. De manera similar a como se accede a los objetos anidados, la notación de corchetes de arreglos puede ser encadenada para acceder a arreglos anidados. En el siguiente ejemplo, vemos cómo se accede a un arreglo anidado: const ourPets = [ { animalType: "cat", names: [ "Meowzer", "Fluffy", "Kit-Cat" ] }, { animalType: "dog", names: [ "Spot", "Bowser", "Frankie" ] } ]; ourPets[0].names[1]; ourPets[1].names[0]; ourPets[0].names[1] sería la cadena Fluffy, y ourPets[1].names[0] sería la cadena Spot. Utilizando la notación de puntos y corchetes, establezca la variable secondTree en el segundo elemento de la lista trees del objeto myPlants.

accede-a-arreglos-multidimensionales-con-ndices

Se puede pensar que un arreglo multidimensional es como un arreglo de arreglos. Cuando usas corchetes para acceder a tu arreglo, el primer par de corchetes se refiere a las entradas en el arreglo externo (el primer nivel) y cada par adicional de corchetes se refiere al siguiente nivel de entradas. Ejemplo const arr = [ [1, 2, 3], [4, 5, 6], [7, 8, 9], [[10, 11, 12], 13, 14] ]; arr[3]; arr[3][0]; arr[3][0][1]; arr[3] es [[10, 11, 12], 13, 14], arr[3][0] es [10, 11, 12] y arr[3][0][1] es 11. Nota: No debe haber ningún espacio entre el nombre del arreglo y los corchetes, ni array [0][0] o array [0] [0] están permitidos. Aunque JavaScript pueda procesar esto correctamente, puedes confundir a otros programadores al leer tu código. Usa la notación de corchetes para seleccionar un elemento de myArray de tal manera que myData sea igual a 8.

accede-a-arreglos-multidimensionales-con-ndices-

Se puede pensar que un arreglo multidimensional es como un arreglo de arreglos. Cuando usas corchetes para acceder a tu arreglo, el primer par de corchetes se refiere a las entradas en el arreglo externo (el primer nivel) y cada par adicional de corchetes se refiere al siguiente nivel de entradas. Ejemplo const arr = [ [1, 2, 3], [4, 5, 6], [7, 8, 9], [[10, 11, 12], 13, 14] ]; arr[3]; arr[3][0]; arr[3][0][1]; arr[3] es [[10, 11, 12], 13, 14], arr[3][0] es [10, 11, 12] y arr[3][0][1] es 11. Nota: No debe haber ningún espacio entre el nombre del arreglo y los corchetes, ni array [0][0] o array [0] [0] están permitidos. Aunque JavaScript pueda procesar esto correctamente, puedes confundir a otros programadores al leer tu código. Usa la notación de corchetes para seleccionar un elemento de myArray de tal manera que myData sea igual a 8.

accede-a-los-contenidos-de-un-arreglo-utilizando-la-notaci-n-de-corchetes

accede-a-los-datos-de-un-arreglo-con-ndices

Podemos acceder a los datos dentro de un arreglo usando índices. Los índices de los arreglos se escriben en la misma notación de corchetes que usan las cadenas de texto, con la excepción que en vez de especificar un carácter, se especifica una entrada en el arreglo. Así como las cadenas de texto, los arreglos usan indexación empezando desde cero, en donde el primer elemento de un arreglo tiene como índice 0. Ejemplo const array = [50, 60, 70]; array[0]; const data = array[1]; array[0] ahora es 50 y data tiene el valor 60. Nota: No debe haber espacios entre el nombre del arreglo y los corchetes, como array [0]. Aunque JavaScript pueda procesar esto correctamente, puedes confundir a otros programadores al leer tu código. Crea una variable llamada myData e iguálala al primer valor de myArray usando notación de corchetes.

accede-a-objetos-anidados

Se puede acceder a las sub propiedades de objetos encadenando la notación de puntos o corchetes. Aquí hay un objeto anidado: const ourStorage = { "desk": { "drawer": "stapler" }, "cabinet": { "top drawer": { "folder1": "a file", "folder2": "secrets" }, "bottom drawer": "soda" } }; ourStorage.cabinet["top drawer"].folder2; ourStorage.desk.drawer; ourStorage.cabinet["top drawer"].folder2 sería la cadena secrets y ourStorage.desk.drawer sería la cadena stapler. Accede al objeto myStorage y asigna el contenido de la propiedad glove box a la variable gloveBoxContents. Utiliza la notación de puntos para todas las propiedades cuando sea posible, de lo contrario utiliza la notación de corchetes.

accede-a-propiedades-de-objetos-con-notaci-n-de-corchete

La segunda manera de acceder a las propiedades de un objeto es con la notación de corchetes ([]). Si la propiedad del objeto al que intentas acceder tiene un espacio en el nombre, necesitarás usar notación de corchetes. Sin embargo, también puedes utilizar la notación de corchetes en las propiedades de objeto sin espacios. Aquí hay un ejemplo de cómo usar la notación de corchetes para leer la propiedad de un objeto: const myObj = { "Space Name": "Kirk", "More Space": "Spock", "NoSpace": "USS Enterprise" }; myObj["Space Name"]; myObj['More Space']; myObj["NoSpace"]; myObj["Space Name"] sería la cadena Kirk, myObj['More Space'] sería la cadena Spock, y myObj["NoSpace"] sería la cadena USS Enterprise. Ten en cuenta que los nombres de las propiedades con espacios deben estar entre comillas (simples o dobles). Lee los valores de las propiedades an entree y the drink de testObj usando la notación de corchetes y asígnalos a entreeValue y drinkValue respectivamente.

accede-a-propiedades-de-objetos-con-notaci-n-de-puntos

Hay dos maneras de acceder a las propiedades de un objeto: notación de puntos (.) y notación de corchetes ([]), similar a un arreglo. La notación de puntos es lo que se usa cuando conoces el nombre de la propiedad a la que intentas acceder con antelación. Aquí hay un ejemplo de cómo usar la notación de puntos (.) para leer la propiedad de un objeto: const myObj = { prop1: "val1", prop2: "val2" }; const prop1val = myObj.prop1; const prop2val = myObj.prop2; prop1val tendrá una cadena con valor val1 y prop2val tendrá una cadena con valor val2. Lee los valores de las propiedades de testObj utilizando la notación de puntos. Asigna la variable hatValue igual a la propiedad hat del objeto y asigna la variable shirtValue igual a la propiedad shirt del objeto.

accede-a-propiedades-de-objetos-con-notaci-n-de-puntos-

Hay dos maneras de acceder a las propiedades de un objeto: notación de puntos (.) y notación de corchetes ([]), similar a un arreglo. La notación de puntos es lo que se usa cuando conoces el nombre de la propiedad a la que intentas acceder con antelación. Aquí hay un ejemplo de cómo usar la notación de puntos (.) para leer la propiedad de un objeto: const myObj = { prop1: "val1", prop2: "val2" }; const prop1val = myObj.prop1; const prop2val = myObj.prop2; prop1val tendrá una cadena con valor val1 y prop2val tendrá una cadena con valor val2. Lee los valores de las propiedades de testObj utilizando la notación de puntos. Asigna la variable hatValue igual a la propiedad hat del objeto y asigna la variable shirtValue igual a la propiedad shirt del objeto.

accede-a-propiedades-de-objetos-con-variables

Otro uso de la notación de corchetes en objetos es acceder a una propiedad que está almacenada como el valor de una variable. Esto puede ser muy útil para iterar a través de las propiedades de un objeto o para acceder a una tabla de búsqueda. Aquí hay un ejemplo del uso de una variable para acceder a una propiedad: const dogs = { Fido: "Mutt", Hunter: "Doberman", Snoopie: "Beagle" }; const myDog = "Hunter"; const myBreed = dogs[myDog]; console.log(myBreed); La cadena Doberman se mostrará en la consola. Otra forma de usar este concepto es cuando el nombre de la propiedad se recoge dinámicamente durante la ejecución del programa, de la siguiente manera: const someObj = { propName: "John" }; function propPrefix(str) { const s = "prop"; return s + str; } const someProp = propPrefix("Name"); console.log(someObj[someProp]); someProp tendrá una cadena con un valor propName y la cadena John se mostrará en la consola. Ten en cuenta que no usamos comillas alrededor del nombre de la variable cuando la usamos para acceder a la propiedad porque utilizamos el valor de la variable, no el nombre. Establece la variable playerNumber a 16. Luego, usa la variable para buscar el nombre del jugador y asignarlo a player.

accede-a-propiedades-de-objetos-con-variables-

Otro uso de la notación de corchetes en objetos es acceder a una propiedad que está almacenada como el valor de una variable. Esto puede ser muy útil para iterar a través de las propiedades de un objeto o para acceder a una tabla de búsqueda. Aquí hay un ejemplo del uso de una variable para acceder a una propiedad: const dogs = { Fido: "Mutt", Hunter: "Doberman", Snoopie: "Beagle" }; const myDog = "Hunter"; const myBreed = dogs[myDog]; console.log(myBreed); La cadena Doberman se mostrará en la consola. Otra forma de usar este concepto es cuando el nombre de la propiedad se recoge dinámicamente durante la ejecución del programa, de la siguiente manera: const someObj = { propName: "John" }; function propPrefix(str) { const s = "prop"; return s + str; } const someProp = propPrefix("Name"); console.log(someObj[someProp]); someProp tendrá una cadena con un valor propName y la cadena John se mostrará en la consola. Ten en cuenta que no usamos comillas alrededor del nombre de la variable cuando la usamos para acceder a la propiedad porque utilizamos el valor de la variable, no el nombre. Establece la variable playerNumber a 16. Luego, usa la variable para buscar el nombre del jugador y asignarlo a player.

actualizando-las-propiedades-de-un-objeto

Después de haber creado un objeto de JavaScript, puedes actualizar sus propiedades en cualquier momento tal y como actualizarías cualquier otra variable. Puedes utilizar tanto la notación de puntos como la notación de corchetes para actualizar. Por ejemplo, veamos ourDog: const ourDog = { "name": "Camper", "legs": 4, "tails": 1, "friends": ["everything!"] }; Puesto que es un perro particularmente feliz, vamos a cambiar su nombre por la cadena Happy Camper. Así es como actualizamos la propiedad del nombre del objeto: ourDog.name = "Happy Camper"; o ourDog["name"] = "Happy Camper";. Ahora cuando evaluamos ourDog.name, en lugar de obtener Camper, vamos a obtener su nuevo nombre, Happy Camper. Actualiza la propiedad nombre del objeto myDog. Cambiemos su nombre de Coder a Happy Coder. Puedes utilizar tanto la notación de puntos como la notación de corchetes.

adivina_numero

Practica Bucle While

affiliations

Nonprofit Success Pack Affiliations Package

agrega-un-valor-de-respaldo-fallback-a-una-variable-css

Cuando utilices tu variable como valor de una propiedad CSS, puedes adjuntar un valor de respaldo o "fallback", que será utilizado por el navegador si la variable dada no es válida. Nota: Este valor de respaldo no se utiliza para aumentar la compatibilidad con otras versiones de navegadores y no funcionará en navegadores IE (Internet Explorer). Más bien, se utiliza para que el navegador tenga un color para mostrar si no encuentra tu variable. A continuación te mostramos como se hace: background: var(--penguin-skin, black); Esto establecerá el "background" (color de fondo) a black (negro) si tu variable no está establecida. Fíjate que esto puede ser útil para la depuración de errores. Aparentemente hay un problema con las variables proporcionadas a las clases .penguin-top y .penguin-bottom. En lugar de corregir el error de tipeo, añade black como un valor de reserva o "fallback" a la propiedad background de las clases .penguin-top y .penguin-bottom.

agrega-una-opci-n-predeterminada-en-las-declaraciones-switch

/*En una declaración switch puede que no seas capaz de especificar todos los valores posibles como declaraciones de case (caso). En su lugar, se puede añadir la declaración default, la cual se ejecutará si no se encuentran declaraciones case. Piensa en ella como la última sentencia else en una cadena if/else. Una declaración default debe ser el último caso. switch (num) { case value1: statement1; break; case value2: statement2; break; ... default: defaultStatement; break; } Escribe una declaración switch para establecer answer con las siguientes condiciones: a - apple b - bird c - cat default - stuff*/

agrega-variables-a-cadenas

Al igual que podemos construir una cadena sobre múltiples líneas a partir de las cadenas literales, también podemos añadir variables a una cadena usando el operador "más igual" (+=). Ejemplo: const anAdjective = "awesome!"; let ourStr = "freeCodeCamp is "; ourStr += anAdjective; ourStr tendrá el valor de freeCodeCamp is awesome!. Establece someAdjective a una cadena de al menos 3 caracteres y añádelo a myStr usando el operador +=.