28:null 29:["$","title",null,{"children":"Dia 3 — JavaScript, Arrays i Fitxers de Dades | Visualization for Transparency Foundation (Fundació ViT) | Observable"}] 2e:[{"id":"f792ee469606ce2c86eb969415b159069e448fad62391dcb00bd6210a556dd56be790633dca05fba188d06736c575aa1fbf00f6e5c1d455d243954737c30ddc4","href":"https://static.observableusercontent.com/files/f792ee469606ce2c86eb969415b159069e448fad62391dcb00bd6210a556dd56be790633dca05fba188d06736c575aa1fbf00f6e5c1d455d243954737c30ddc4","name":"Avaluaci__de_sis__d_educaci__prim_ria_20250626 (2).csv","type":"text/csv","lastModified":1750924948432.408,"size":5036228}] 2c:{"id":"96ab9aeb8ce6b406","slug":null,"title":"Dia 3 — JavaScript, Arrays i Fitxers de Dades","thumbnail":"6cd6145380961d37e9e968d0579ee4019c5e8034807a8baaf946cb9fe5808dc4","access_level":"public","create_time":"$D2025-06-18T13:52:04.828Z","update_time":"$D2025-07-03T08:03:25.817Z","view_time":null,"first_public_time":"$D2025-07-03T08:03:43.855Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"4bce174a609780f2","login":"fndvit","name":"Visualization for Transparency Foundation (Fundació ViT)","avatar_url":"https://avatars-next.observableusercontent.com/754d2d5dd6f85a7606d03844ce81907501d4d8a384ffa6111f47cb5e91b16b8a","tier":"pro_2024"},"version":227,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"0e84a18974fa439f","login":"laia","name":"Laia Verdaguer","avatar_url":"https://avatars-next.observableusercontent.com/bb14ccce353f5179ee04603be9238f8225908c8faa211dfb96bc93418084f4f6","tier":null}],"members":[{"type":"team","id":"4bce174a609780f2","login":"fndvit","name":"Visualization for Transparency Foundation (Fundació ViT)","avatar_url":"https://avatars-next.observableusercontent.com/754d2d5dd6f85a7606d03844ce81907501d4d8a384ffa6111f47cb5e91b16b8a","tier":"pro_2024","role":"editor"},{"type":"individual","id":"0e84a18974fa439f","login":"laia","name":"Laia Verdaguer","avatar_url":"https://avatars-next.observableusercontent.com/bb14ccce353f5179ee04603be9238f8225908c8faa211dfb96bc93418084f4f6","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":4,"collection":{"id":"24ed33e539e5f14f","slug":"retech","title":"30-Day Women Dataviz Workshop","owner":{"id":"4bce174a609780f2","login":"fndvit","name":"Visualization for Transparency Foundation (Fundació ViT)"}},"type":"notebook","body":{"titling":"auto","title":"Dia 3 — JavaScript, Arrays i Fitxers de Dades","cells":[{"id":0,"value":"# Dia 3 — JavaScript, Arrays i Fitxers de Dades","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"## 🎯 Objectiu de la sessió\nAprendre a utilitzar JavaScript dins d’Observable per manipular dades. Descobrir com funcionen les variables, les funcions, els arrays i com llegir fitxers CSV per preparar visualitzacions a partir d’informació real.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":8,"value":"
","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":10,"value":"### 🧠 Introducció a JavaScript\nJavaScript és el llenguatge principal que s'utilitza a Observable. Es pot escriure codi dins de cèl·les i definir variables o funcions. Cada cèl·la funciona de manera independent però reactiva: si una variable canvia, totes les altres que la utilitzen també s’actualitzen automàticament.\n\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":14,"value":"
","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":16,"value":"### Variables i operacions bàsiques\nEs pot declarar variables amb números, textos o booleans.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":18,"value":"x = 4","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"y = 6","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":22,"value":"z = x + y","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"dia = \"dissabte\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":26,"value":"missatge = `El meu dia preferit de la setmana és el ${dia}`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":30,"value":"
","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":32,"value":"### Funcions\nLes funcions ens ajuden a reutilitzar i/o encapsular codi.\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":37,"value":"function sumar(a, b) {\n return a + b;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":39,"value":"sumar(5, 19)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":183,"value":"function saluda(nom) {\n return `Hola, ${nom}! Com estàs?`;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":185,"value":"saluda(\"profe\") ","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":187,"value":"saluda(\"alumna\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":41,"value":"
","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":43,"value":"### Arrays – Llistes de dades\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":46,"value":"persones = [\n {\n nom: \"Anna\",\n edat: 24,\n pais: \"United Kingdom\"\n },\n {\n nom: \"Bea\",\n edat: 26,\n pais: \"Switzerland\"\n },\n {\n nom: \"Maria\",\n edat: 45,\n pais: \"Spain\"\n }\n]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":48,"value":"map: transformar cada element","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":50,"value":"nomsMajuscules = persones.map((persona) => persona.nom.toUpperCase())","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":54,"value":"// filter: filtrar segons una condició","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":59,"value":"paisos = persones.filter((persona) => persona.pais.includes(\"a\"))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":57,"value":"// sort: ordena els elements\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":52,"value":"ordenarEdat = persones.sort((a, b) => b.edat < a.edat)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":116,"value":"// find: troba el primer resultat que compleixi amb la condició\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":119,"value":"maria = persones.find((d) => d.nom === \"Maria\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":192,"value":"// reduce: acumula tots els valors d’un array en un sol resultat.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":195,"value":"mitjana_edat = persones.reduce((acc, p) => acc + p.edat, 0) / persones.length","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":61,"value":"
","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":63,"value":"### 📂 Llegir fitxers de dades a Observable\nPodem pujar fitxers CSV i accedir-hi com a arrays d’objectes.\n\nPAS 1 — Pujar un fitxer\nFes clic a 📎 (a dalt a la dreta) i selecciona un fitxer .csv (per exemple, dades.csv).\n\nPAS 2 — Carregar el fitxer","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":65,"value":"PAS 3 — Visualitzar el contingut","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":68,"value":"
","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":70,"value":"## EXERCICI\n🎯 Objectiu: llegir un fitxer CSV i fer operacions amb arrays\n\n**Dades**: un array d’alumnes amb informació com l’any, codi, notes (PCAT, PCAST, PMAT, PANG), gènere, àrea territorial i naturalesa del centre (Públic/Privat).\n\nhttps://analisi.transparenciacatalunya.cat/Educaci-/Avaluaci-de-sis-d-educaci-prim-ria/rk5x-gny6/about_data\n\n*Documentació* : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":74,"value":"PAS 1 — Carrega i mostra el fitxer","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":105,"value":"avaluacio = await FileAttachment(\"Avaluaci__de_sis__d_educaci__prim_ria_20250626 (2).csv\").csv({typed: \"auto\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"avaluacio","database":"$undefined"},{"id":205,"value":"dades = FileAttachment(\n \"Avaluaci__de_sis__d_educaci__prim_ria_20250626 (2).csv\"\n).csv()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":207,"value":"Inputs.table(dades)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":76,"value":"
","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":79,"value":"PAS 2 — Extreure una llista de notes de matemàtiques","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":108,"value":"notes_matematiques = avaluacio.map((alumne) => alumne.PMAT)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":81,"value":"
","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":83,"value":"PAS 3 — Trobar les alumnes que han tret més de 90 en català (PCAT) i són noies (GENERE === \"D\")\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":132,"value":"noies_catala = avaluacio.filter(\n (alumne) => alumne.PCAT > 90 && alumne.GENERE === \"D\"\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":86,"value":"
","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":88,"value":"PAS 4 — Ordenar els alumnes per nota d’anglès (PANG) de més alta a més baixa","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":138,"value":"notes_angles = avaluacio.sort((a, b) => b.PANG - a.PANG)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":147,"value":"*⚠️ Aquest .sort() modifica l’array original. Si vols evitar-ho:*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":140,"value":"copia_notes_angles = [...avaluacio].sort((a, b) => b.PANG - a.PANG)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":149,"value":"PAS 5 — Trobar el primer alumne del Vallès Occidental que ha tret més de 80 en matemàtiques","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":151,"value":"alumne_valles = avaluacio.find(\n (alumne) =>\n alumne.AREA_TERRITORIAL === \"Vallès Occidental\" && alumne.PMAT > 80\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":155,"value":"**Repte final (Opcional) **\n\nPer a cada alumne, calcular la seva nota mitjana a partir de 4 assignatures i classificar-lo segons el seu rendiment acadèmic.\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":174,"value":"function mitjana(alumne) {\n const notes = [alumne.PCAT, alumne.PCAST, alumne.PMAT, alumne.PANG];\n const notesFiltrades = notes.filter((a) => !Number.isNaN(a));\n const mitjana =\n notesFiltrades.reduce((acc, n) => acc + n, 0) / notesFiltrades.length;\n\n return mitjana;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":157,"value":"function classificacio(nota) {\n if (nota >= 90) return \"Excel·lent\";\n if (nota >= 70) return \"Notable\";\n if (nota >= 50) return \"Suficient\";\n return \"Insuficient\";\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":167,"value":"nou_array = avaluacio.map((alumne) => ({\n ...alumne,\n mitjana: mitjana(alumne).toFixed(2),\n classificacio: classificacio(mitjana(alumne))\n}))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":90,"value":"
","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"}],"files":"$W2e","stdlib":"1"}} 2d:"$2c:body"