Tako Schotanus
    • Create new note
    • Create a note from template
      • Sharing URL Link copied
      • /edit
      • View mode
        • Edit mode
        • View mode
        • Book mode
        • Slide mode
        Edit mode View mode Book mode Slide mode
      • Customize slides
      • Note Permission
      • Read
        • Only me
        • Signed-in users
        • Everyone
        Only me Signed-in users Everyone
      • Write
        • Only me
        • Signed-in users
        • Everyone
        Only me Signed-in users Everyone
      • Engagement control Commenting, Suggest edit, Emoji Reply
    • Invite by email
      Invitee

      This note has no invitees

    • Publish Note

      Share your work with the world Congratulations! 🎉 Your note is out in the world Publish Note

      Your note will be visible on your profile and discoverable by anyone.
      Your note is now live.
      This note is visible on your profile and discoverable online.
      Everyone on the web can find and read all notes of this public team.
      See published notes
      Unpublish note
      Please check the box to agree to the Community Guidelines.
      View profile
    • Commenting
      Permission
      Disabled Forbidden Owners Signed-in users Everyone
    • Enable
    • Permission
      • Forbidden
      • Owners
      • Signed-in users
      • Everyone
    • Suggest edit
      Permission
      Disabled Forbidden Owners Signed-in users Everyone
    • Enable
    • Permission
      • Forbidden
      • Owners
      • Signed-in users
    • Emoji Reply
    • Enable
    • Versions and GitHub Sync
    • Note settings
    • Note Insights New
    • Engagement control
    • Make a copy
    • Transfer ownership
    • Delete this note
    • Save as template
    • Insert from template
    • Import from
      • Dropbox
      • Google Drive
      • Gist
      • Clipboard
    • Export to
      • Dropbox
      • Google Drive
      • Gist
    • Download
      • Markdown
      • HTML
      • Raw HTML
Menu Note settings Note Insights Versions and GitHub Sync Sharing URL Create Help
Create Create new note Create a note from template
Menu
Options
Engagement control Make a copy Transfer ownership Delete this note
Import from
Dropbox Google Drive Gist Clipboard
Export to
Dropbox Google Drive Gist
Download
Markdown HTML Raw HTML
Back
Sharing URL Link copied
/edit
View mode
  • Edit mode
  • View mode
  • Book mode
  • Slide mode
Edit mode View mode Book mode Slide mode
Customize slides
Note Permission
Read
Only me
  • Only me
  • Signed-in users
  • Everyone
Only me Signed-in users Everyone
Write
Only me
  • Only me
  • Signed-in users
  • Everyone
Only me Signed-in users Everyone
Engagement control Commenting, Suggest edit, Emoji Reply
  • Invite by email
    Invitee

    This note has no invitees

  • Publish Note

    Share your work with the world Congratulations! 🎉 Your note is out in the world Publish Note

    Your note will be visible on your profile and discoverable by anyone.
    Your note is now live.
    This note is visible on your profile and discoverable online.
    Everyone on the web can find and read all notes of this public team.
    See published notes
    Unpublish note
    Please check the box to agree to the Community Guidelines.
    View profile
    Engagement control
    Commenting
    Permission
    Disabled Forbidden Owners Signed-in users Everyone
    Enable
    Permission
    • Forbidden
    • Owners
    • Signed-in users
    • Everyone
    Suggest edit
    Permission
    Disabled Forbidden Owners Signed-in users Everyone
    Enable
    Permission
    • Forbidden
    • Owners
    • Signed-in users
    Emoji Reply
    Enable
    Import from Dropbox Google Drive Gist Clipboard
       Owned this note    Owned this note      
    Published Linked with GitHub
    • Any changes
      Be notified of any changes
    • Mention me
      Be notified of mention me
    • Unsubscribe
    # JSON with Jeka ```javascript let datos1 = [ { "id": "0001", "type": "donut", "name": "Cake", "ppu": 0.55, "batters": { "batter": [ { "id": "1001", "type": "Regular" }, { "id": "1002", "type": "Chocolate" }, { "id": "1003", "type": "Blueberry" }, { "id": "1004", "type": "Devil's Food" } ] }, "topping": [ { "id": "5001", "type": "None" }, { "id": "5002", "type": "Glazed" }, { "id": "5005", "type": "Sugar" }, { "id": "5007", "type": "Powdered Sugar" }, { "id": "5006", "type": "Chocolate with Sprinkles" }, { "id": "5003", "type": "Chocolate" }, { "id": "5004", "type": "Maple" } ] }, { "id": "0002", "type": "donut", "name": "Raised", "ppu": 0.55, "batters": { "batter": [ { "id": "1001", "type": "Regular" } ] }, "topping": [ { "id": "5001", "type": "None" }, { "id": "5002", "type": "Glazed" }, { "id": "5005", "type": "Sugar" }, { "id": "5003", "type": "Chocolate" }, { "id": "5004", "type": "Maple" } ] }, { "id": "0003", "type": "donut", "name": "Old Fashioned", "ppu": 0.55, "batters": { "batter": [ { "id": "1001", "type": "Regular" }, { "id": "1002", "type": "Chocolate" } ] }, "topping": [ { "id": "5001", "type": "None" }, { "id": "5002", "type": "Glazed" }, { "id": "5003", "type": "Chocolate" }, { "id": "5004", "type": "Maple" } ] } ] ``` Así que cómo dije antes puedes ver el primer character del variable `datos`, que en este caso es un `[`, asíque es un array. Y como expliqué sacar elementos de un array se hace con `[número]`. Por ejemplo `datos1[0]` sacará el primer elemento. Cual es exactamente el primer elemento? ```javascript let datos2 = {"id": "0001", "type": "donut", "name": "Cake", "ppu": 0.55, "batters": { "batter": [ { "id": "1001", "type": "Regular" }, { "id": "1002", "type": "Chocolate" }, { "id": "1003", "type": "Blueberry" }, { "id": "1004", "type": "Devil's Food" } ] }, "topping": [ { "id": "5001", "type": "None" }, { "id": "5002", "type": "Glazed" }, { "id": "5005", "type": "Sugar" }, { "id": "5007", "type": "Powdered Sugar" }, { "id": "5006", "type": "Chocolate with Sprinkles" }, { "id": "5003", "type": "Chocolate" }, { "id": "5004", "type": "Maple" } ] } ``` Casi, es importante empezar con el primer character después del `[`. Entonces editalo. PErfecto! Y eso que es? J: *un objeto* Exacto. Y para sacar un elemento de un objeto se usa el nombre del elemento. Si el nombre es algo simple, como `id` o `name` se suele usar simplemente el nombre del variable seguido por `.` y el nombre del elemento, por ejemplo ```javascript datos2.name ``` Pero eso se puede encadenar! Entonces para sacar el nombre del primer elemento de los datos originales se escribe: ```javascript datos1[0].name ``` Ahora si queremos los toppings podemos escribir: ```javascript datos1[0].toppings ``` y eso nos dará un arreglo: ```javascript [ { "id": "5001", "type": "None" }, { "id": "5002", "type": "Glazed" }, { "id": "5005", "type": "Sugar" }, { "id": "5007", "type": "Powdered Sugar" }, { "id": "5006", "type": "Chocolate with Sprinkles" }, { "id": "5003", "type": "Chocolate" }, { "id": "5004", "type": "Maple" } ] ``` J: *Ahora veo el problema, no tengo tanto problema con la navegacion, si no mas con como es mi "json"* Si, tu JSON tiene un problema Y si queremos el tipo del terecer elemento hacemos: ```javascript datos1[0].toppings[2].type ``` Pero una cosa importante!! ```javascript datos1[0].toppings[2].type == "Sugar" ``` Pero si hago: ```javascript let toppings = datos1[0].toppings; toppings[2].type == "Sugar" ``` Es *exactamente* lo mismo! J: *guardas parte de la ruta en una variable* Sip. Lo que importa es la "ruta" total, los variables son solamente una manera de apuntarlo en una manera mas legible para nosotros los pobres humanos J: *ya, este problema no lo tengo... siempre creo muchas para que no falten ;)* Jeje, mientras entiendes que es lo mismo. Que por ejemplo hacer `datos1[0].toppings[2].type = "Queso"` cambiará tambien el contenido de `toppings[2].type` porque son realmente los mismos datos. J: *ya, esta parte mas o menos lo llevo bien* Ok, copiamos tus datos para ver que pasa con ellos: ```javascript let almacen = [ { departamento: "Joyeria", productos: [ { nombre: "Anillos", precio: 3, stock: 4 }, { nombre: "Collares", precio: 3, stock: 4 }, { nombre: "Pulseras", precio: 3, stock: 4 }, ], departamento: "drogeria", productos: [ { nombre: "Perfume", precio: 12, stock: 3 }, { nombre: "Champoo", precio: 12, stock: 3 }, { nombre: "Jabone", precio: 12, stock: 3 }, ], departamento: "farmacia", productos: [ { nombre: "Ibuprofeno", precio: 15, stock: 92 }, { nombre: "Paracetamol", precio: 15, stock: 92 }, { nombre: "Frenadol", precio: 15, stock: 92 } ] } ]; ``` J: *voy a probar ahora dame unos minutos para poder arreglarlo* Ok, adelante! J: *creo que deberia ser asi mas o menos* ```javascript datos3 = departamentos: { Joyeria: [ { nombre: "Anillos", precio: 3, stock: 4 }, { nombre: "Anillos", precio: 3, stock: 4 }, ], farmacia: [ { nombre: "Anillos", precio: 3, stock: 4} ] } ``` Ok, pero pon en palabras lo que es eso. **"Datos3 es un ....."** (pista: tu JSON original es casi casi correcto, sólo faltan 2 `}`, nada mas!) ```javascript let almacen = [ { id: "0001", departamiento: "Joyeria", productos: [ { nombre: "Anillos", precio: 3, stock: 4, }, { nombre: "Collares", precio: 3, stock: 4, }, { nombre: "Pulseras", precio: 3, stock: 4, }, ], }, { id: "0002", departamiento: "Carniceria", productos: [ { nombre: "Chuletas", precio: 3, stock: 4, }, { nombre: "Salchichas", precio: 3, stock: 4, }, { nombre: "Jamon", precio: 3, stock: 4, }, ], }, { id: "0003", departamiento: "Pescaderia", productos: [ { nombre: "Bacalao", precio: 3, stock: 4, }, { nombre: "Gambas", precio: 3, stock: 4, }, { nombre: "Salmon", precio: 3, stock: 4, }, ], }, ]; ``` Perfecto! Asi que "almacen es un array de tres objetos. Cada objeto tiene un `id`, un `departamiento` y un array de `productos`, donde cada producto es un objeto con `nombre`, `precio` y `stock`". Eso ya debería dar suficiente información para poder acceder cada elemento. Y como te enseñé la última vez, si tienes que hacer un bucle para cada elemento, lo puedes hacer así: - **Array:** ```javascript for (elemento of miarray) { console.log(elemento) } ``` ```javascript miarray.forEach(elemento => console.log(elemento)) ``` ```javascript for (i=0; i < miarray.length; i++) { console.log(miarray[i]) } ``` - **Objeto:** ```javascript for ([clave, valor] of Object.entries(miobjeto)) { console.log(clave, valor) } ``` ```javascript Object.entries(miobjeto).forEach(([clave, valor]) => console.log(clave, valor)) ``` ```javascript for (clave of Object.keys(miobjeto)) { console.log(clave, miobjeto[clave]) } ``` J: *linea 346 <---- no es Object.values?* Se puede usar tambien, pero "pierdes" la información de la clave, si no lo necesitas puedes usar `values()`. J: *Vale, lo he entendido, o esto creo jajaj siempre surgen preguntas despues. Voy a ponerme con la app que tengo que hacer, mi primer carrito de la compra con express :)* J: *Vale una duda mas, entre Object.entries y for...in, cual es la diferencia, poor que los dos me van a devolver lo mismo no?* Bueno, no, es bastante técnica la razón porque, pero `for..in` es "viejo" y está mal implementado. Te puede llevar sorpresas. Basicamente mejor _nunca_ usar `for..in`. J: *"Buenas practicas"* Algo asi, si. Por eso existe tambien un `for..of`, no por querer confundir, pero es la versión correcta de `for..in`. No podían "arreglar" el `for..in` porque hubiera roto basicamente todo el código del internet :-) J: *Me encanta esta pizarra... es brutal! Desde luego no aprendi una cosa... si no varias! No cansaré de darte las gracias!!!* *Deberias plantearte de hacer bootcamps... que hay gran diferencia entre como lo cuenta mi profe y como lo cuentas tu* Gracias :-) Pero no sé, enseñar nunca ha sido una ilusión mia. Contigo es más fácil porque me importas :-) Pues para no saber tio. Esta preocupacion la tenia yo cuando empezaba dar clases de patinaje, y claro primeras clases estaba perdido, pero despues. Saber trasmitir y saber responder es a la duda "tonta", no todos saben hacerlo. De echo mi profe sigue recomendando *for..in* No, no es no saber es más no querer ;-) Pero contigo lo estoy disfrutando :-) Bueno, voy a por ello, de nuevo GRACIAS Y estos herramientas como este sitio web... son una mina de oro. Los aprendo diariamente de mis compis. Es sorprendente do lo que hay por ahi. Por cierto, estoy pensando en compartir contigo algo que descubri otro dia: se trata de un truco de CSS, muy tonto, pero me ha ahorrado muchisimas lineas de codigo de *media queries* ```css .box { width: min(100% - 20px, 800px); margin-inline: auto; } ``` Ya esta! T: Y que hace? indica ancho maximo de una contenedor, en nuestro caso 800px y el viewport es mas pequeño que este ancho, nuestro contenedor ocupara 100% de ancho y dejara 10px a los lados *margin-inline*: son nuevas caracteristicas que permiten indicar margin solo vertical *margin-inline: val1:izq val2:derecha* ``` css margin-inline: 20px 40px; ``` es lo mimo que hacer: ```css margin-left: 20px; margin-right: 40px; ``` No sé si entiendo ese último ejemplo :-) Aaaah ok! NB: ya sabías escribir Markdown? # header 1 ## header 2 etc y poco mas. Es que en el curso tengo demaciada informacion. Y se que deberia aprender a dejar las cosas bonitas en presentaciones y todo esto. Pero ahoramismo no doy a mas quier que veas los ejercicios de hoy solo el primero y el ultimo **1.Crea una aplicación express con una llamada de tipo get que devuelva el siguiente HTML: "Hola mundo desde express"** **14. Crea una aplicación que simule una tienda online. Crea una variable almacén en la que guardes un array con objetos. Cada objeto será un departamento de la tienda y tendrás varios productos en cada uno. Cada uno de estos productos será un objeto con las siguientes propiedades: nombre, precio y stock. Crea también una variable cesta. Crea las siguientes rutas:** - Dos rutas diferentes para cada uno de los departamentos de la tienda. - Una ruta devolverá en la respuesta todos los productos que hay en ese departamento. Haz que se muestre en una tabla HTML. - La otra ruta servirá para comprar productos. Esta ruta recibirá dos parámetros: nombre del producto y cantidad. Añadir a la variable cesta el producto y la cantidad seleccionada Si la cantidad pedida es mayor que el stock, devolveremos un mensaje avisando de que no hay stock suficiente. - Una ruta para mostrar la cesta. - Una ruta para confirmar la compra. Esta ruta devolverá un mensaje de confirmación y vaciará la cesta. y empezamos con Express HOY! 🤣 Jejeje, entiendo que parece mucho. J: Supongo que me pongo con ello y en una o dos horas lo tengo. Pero agobia Si, me lo imagino. Te puedo decir que suena más complicado de lo que realmente es, pero la energia que tienes que gastar en entender el problema y como hacerlo no es poco! Sigo lamentando pasar tantas horas el fin de semana para terminar el proyecto y no tomarmelo con mas calma. Pero este gusano competidor que tengo dentro, me mata... Ya. Claro en este caso sabiendo que muy probable que hay gente mirando para ver como lo esta haciendo todo el mundo... y lo importante que es para ti que todo esto funciona y sigue adelante Ya lo han dejado tres personas :( hay mucha presion y mucho que ritmo muy intenso. Pero me da la esperanza que al terminarlo en un o dos meses encontrar trabajo. Aprte en diciembre empezamos practicas con emprezas que vienen de visita. Ahí si que no puedo fallar, ya que suelen llevar a uno o dos con contrato de 6 meses de prueba ^^ Eso! PD: Ida ya me ha dicho que en cualquier momento que quieres hablar con ella sobre entrevistas etc que ella encantada J: Dale las gracias, espero que a ella tambien le gust la cerveza, que de momento es lo unico que con lo que puedo pagar JAJAJA sto o un curso de preparacion de espresso en tu casa con tu cafetera ;) jajajaj cerveza si, café NO! jejeje Siiiii!! Hoy hablé con el chico que trabaja en el bar donde antes trabajaba ese amigo tuyo. Y me contó que conoce mucha gente que tiene la misma maquina que tengo yo. Que para tener algo en casa es bastante bueno. Ahora sólo me falta manejarlo bien jeje Lo es, lo es! Es mas facil de lo que creas ;) > Si, me lo imagino. Te puedo decir que suena más complicado de lo que realmente es, pero la energia que tienes que gastar en entender el problema y como hacerlo no es poco! Tako :L452 Obviamente ya estoy tomando cafe todos los días con la maquinia. Sólo que todavía no me sale café muy bueno. Sale "ok". Tomable. En todo esto, lo mas importante que sepas diferenciar entre, bueno, y bien echo. Me he tomado cafes de 93.75 puntos (la mas alta puntucion que he visto en mis 11 años), lo tomamos mal echo y sabian a gloria. y lo malo que estas cosas las consiguen en cantidades de 20g Esa puntuación es una indicación de la calidad del café? Si busca info sobre SCA points el 100 es el tope, comercial de alta gama es de menos de 80, bar manolo, suelen ser unos 40-70 puntos, los supermercados 3€ por medio kg de cafe molidoy paquete boonito... menos de 40. Los de especialidad se consideran todos de mas de 80p. 84 si el coffeeshop se respeta a si mismo. cafés con mas de 90% representan 0.1% de producion undial y encontrar cafés con mas de 93... es MUY MUY MUY MUY raro... es lo mismo que me digas que has echo un e-commerce sin abrir navegador, y al ponerlo en marcha no te ha dado ni un error 🤣🤣🤣🤣🤣 jajajajaj Bueno, me pongo con lo mio que si no... en 6 horas ya salgo de casa Gracias!!! Espero no entretenerte mas hoy, así que buenas noches! Buenas noches!!!! Un abrazo!

    Import from clipboard

    Paste your markdown or webpage here...

    Advanced permission required

    Your current role can only read. Ask the system administrator to acquire write and comment permission.

    This team is disabled

    Sorry, this team is disabled. You can't edit this note.

    This note is locked

    Sorry, only owner can edit this note.

    Reach the limit

    Sorry, you've reached the max length this note can be.
    Please reduce the content or divide it to more notes, thank you!

    Import from Gist

    Import from Snippet

    or

    Export to Snippet

    Are you sure?

    Do you really want to delete this note?
    All users will lose their connection.

    Create a note from template

    Create a note from template

    Oops...
    This template has been removed or transferred.
    Upgrade
    All
    • All
    • Team
    No template.

    Create a template

    Upgrade

    Delete template

    Do you really want to delete this template?
    Turn this template into a regular note and keep its content, versions, and comments.

    This page need refresh

    You have an incompatible client version.
    Refresh to update.
    New version available!
    See releases notes here
    Refresh to enjoy new features.
    Your user state has changed.
    Refresh to load new user state.

    Sign in

    Forgot password

    or

    By clicking below, you agree to our terms of service.

    Sign in via Facebook Sign in via Twitter Sign in via GitHub Sign in via Dropbox Sign in with Wallet
    Wallet ( )
    Connect another wallet

    New to HackMD? Sign up

    Help

    • English
    • 中文
    • Français
    • Deutsch
    • 日本語
    • Español
    • Català
    • Ελληνικά
    • Português
    • italiano
    • Türkçe
    • Русский
    • Nederlands
    • hrvatski jezik
    • język polski
    • Українська
    • हिन्दी
    • svenska
    • Esperanto
    • dansk

    Documents

    Help & Tutorial

    How to use Book mode

    Slide Example

    API Docs

    Edit in VSCode

    Install browser extension

    Contacts

    Feedback

    Discord

    Send us email

    Resources

    Releases

    Pricing

    Blog

    Policy

    Terms

    Privacy

    Cheatsheet

    Syntax Example Reference
    # Header Header 基本排版
    - Unordered List
    • Unordered List
    1. Ordered List
    1. Ordered List
    - [ ] Todo List
    • Todo List
    > Blockquote
    Blockquote
    **Bold font** Bold font
    *Italics font* Italics font
    ~~Strikethrough~~ Strikethrough
    19^th^ 19th
    H~2~O H2O
    ++Inserted text++ Inserted text
    ==Marked text== Marked text
    [link text](https:// "title") Link
    ![image alt](https:// "title") Image
    `Code` Code 在筆記中貼入程式碼
    ```javascript
    var i = 0;
    ```
    var i = 0;
    :smile: :smile: Emoji list
    {%youtube youtube_id %} Externals
    $L^aT_eX$ LaTeX
    :::info
    This is a alert area.
    :::

    This is a alert area.

    Versions and GitHub Sync
    Get Full History Access

    • Edit version name
    • Delete

    revision author avatar     named on  

    More Less

    Note content is identical to the latest version.
    Compare
      Choose a version
      No search result
      Version not found
    Sign in to link this note to GitHub
    Learn more
    This note is not linked with GitHub
     

    Feedback

    Submission failed, please try again

    Thanks for your support.

    On a scale of 0-10, how likely is it that you would recommend HackMD to your friends, family or business associates?

    Please give us some advice and help us improve HackMD.

     

    Thanks for your feedback

    Remove version name

    Do you want to remove this version name and description?

    Transfer ownership

    Transfer to
      Warning: is a public team. If you transfer note to this team, everyone on the web can find and read this note.

        Link with GitHub

        Please authorize HackMD on GitHub
        • Please sign in to GitHub and install the HackMD app on your GitHub repo.
        • HackMD links with GitHub through a GitHub App. You can choose which repo to install our App.
        Learn more  Sign in to GitHub

        Push the note to GitHub Push to GitHub Pull a file from GitHub

          Authorize again
         

        Choose which file to push to

        Select repo
        Refresh Authorize more repos
        Select branch
        Select file
        Select branch
        Choose version(s) to push
        • Save a new version and push
        • Choose from existing versions
        Include title and tags
        Available push count

        Pull from GitHub

         
        File from GitHub
        File from HackMD

        GitHub Link Settings

        File linked

        Linked by
        File path
        Last synced branch
        Available push count

        Danger Zone

        Unlink
        You will no longer receive notification when GitHub file changes after unlink.

        Syncing

        Push failed

        Push successfully