42:null 43:["$","title",null,{"children":"Basic Javascript Concepts for Data | datavizstudio | Observable"}] 49:T8b3,--- To create an array of objects with the structure `{lang: "HTML", count: "3"}` from the given data, you'll need to extract and count the programming languages mentioned in the "Please select all the coding languages you know of." field of each object. Here's how you can do it in JavaScript: ```javascript const data = [ { "Timestamp": "2023/10/27 2:22:16 PM AST", "Please select all the coding languages you know of.": "HTML;CSS;Javascript;SQL;Python;C#" }, { "Timestamp": "2023/10/27 3:08:44 PM AST", "Please select all the coding languages you know of.": "HTML;CSS" }, { "Timestamp": "2023/10/27 4:08:40 PM AST", "Please select all the coding languages you know of.": "None" }, { "Timestamp": "2023/10/27 7:45:00 PM AST", "Please select all the coding languages you know of.": "HTML;CSS;Javascript;SQL;Python;Basic, C++ (are you asking if we know how to use all of …orly—but I know of more languages than those two)" } ]; // Create an object to count language frequencies const languageFrequencies = {}; // Iterate through the data and count frequencies data.forEach(entry => { const languages = entry["Please select all the coding languages you know of."].split(';'); languages.forEach(language => { if (languageFrequencies[language]) { languageFrequencies[language]++; } else { languageFrequencies[language] = 1; } }); }); // Convert the frequencies into an array of objects const arrayOfObjects = Object.entries(languageFrequencies).map(([lang, count]) => ({ lang, count: count.toString() })); console.log(arrayOfObjects); ``` In this code: 1. We first create an object called `languageFrequencies` to count the frequencies of programming languages. 2. We iterate through the data array, split the "Please select all the coding languages you know of." field by semicolons to get an array of languages for each entry, and then count the frequencies of each language in the `languageFrequencies` object. 3. Finally, we convert the frequencies into an array of objects with the specified structure. The `arrayOfObjects` will contain an array of objects where each object represents a programming language and its count. ---4a:[{"id":"064b5705c0a355e28ec71b1b40d52e06876a6c4587565696cb39d2fd646842391be5de1690f1b39e8b0e061d72c07f0c68878d52d854a22022c5fc3a34c90725","href":"https://static.observableusercontent.com/files/064b5705c0a355e28ec71b1b40d52e06876a6c4587565696cb39d2fd646842391be5de1690f1b39e8b0e061d72c07f0c68878d52d854a22022c5fc3a34c90725","name":"Fifa_world_cup_matches.csv","type":"text/csv","lastModified":1698178320120.981,"size":19503},{"id":"891891b3de48d30249feb5496381ead842033489afedd0c6ff45346baf300b0b5a11f432d9d9a85cecee3c9143251a0ae6fa9b544bda5b6c2392b43d82813ee4","href":"https://static.observableusercontent.com/files/891891b3de48d30249feb5496381ead842033489afedd0c6ff45346baf300b0b5a11f432d9d9a85cecee3c9143251a0ae6fa9b544bda5b6c2392b43d82813ee4","name":"csvjson.json","type":"application/json","lastModified":1698269493764.362,"size":102928},{"id":"6832c70e29b71605579953e7b511666f084c8f67746de59a4184008153002629cc60b6e7901ec4fa06730c7ff26d1b22fe84e9ea54184651b77dea1339fa8a7a","href":"https://static.observableusercontent.com/files/6832c70e29b71605579953e7b511666f084c8f67746de59a4184008153002629cc60b6e7901ec4fa06730c7ff26d1b22fe84e9ea54184651b77dea1339fa8a7a","name":"List_of_municipalities_in_Massachusetts_1.csv","type":"text/csv","lastModified":1698269752134.558,"size":37744},{"id":"2d7a19a3b8ac11a50d6353b505de8050b5155d173e5d18d0f9fd7b273c1873bc8163c934199a701a9e640c5bc07ca96c77de3ad4ac5cb251512924eb613676c0","href":"https://static.observableusercontent.com/files/2d7a19a3b8ac11a50d6353b505de8050b5155d173e5d18d0f9fd7b273c1873bc8163c934199a701a9e640c5bc07ca96c77de3ad4ac5cb251512924eb613676c0","name":"tell_me_about_you@4.csv","type":"text/csv","lastModified":1698615058711.971,"size":3336}] 47:{"id":"2dc5f3fdd2d0c5c5","slug":"basic-javascript-concepts-for-data","title":"Basic Javascript Concepts for Data","thumbnail":"49e3b8e7b5c25c76853ac31b4ed41e895e2facb91573182f4e68e995d0ccb899","access_level":"public","create_time":"$D2023-10-18T17:56:23.999Z","update_time":"$D2025-11-02T17:35:05.678Z","view_time":null,"first_public_time":"$D2023-10-18T17:56:23.999Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"9d1923139c08a6e1","login":"datavizstudio","name":"datavizstudio","avatar_url":"https://avatars-next.observableusercontent.com/872d42f9dddf9f9bba5c6998f36838e11a5e0ae65bea52c8f1cf3f1583aa03e1","tier":"starter_2024","bio":"","following":false},"version":1250,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"6daf8c256c240f37","login":"clairesunstudio","name":"Minghua Sun","avatar_url":"https://avatars-next.observableusercontent.com/21939bae715c61b768db5f1c4ab756b8a508ba4ec6baed4c0bc111ef246a44da","tier":null,"bio":"","following":false}],"members":[{"type":"individual","id":"6daf8c256c240f37","login":"clairesunstudio","name":"Minghua Sun","avatar_url":"https://avatars-next.observableusercontent.com/21939bae715c61b768db5f1c4ab756b8a508ba4ec6baed4c0bc111ef246a44da","tier":null,"role":"editor"},{"type":"team","id":"9d1923139c08a6e1","login":"datavizstudio","name":"datavizstudio","avatar_url":"https://avatars-next.observableusercontent.com/872d42f9dddf9f9bba5c6998f36838e11a5e0ae65bea52c8f1cf3f1583aa03e1","tier":"starter_2024","role":"editor"}],"comments":[{"id":"23a71732900944eb","reply_to_id":null,"content":"Anonymised survey data. Reminder: Don't upload sensitive info","create_time":"$D2023-10-29T21:34:04.504Z","update_time":null,"resolved":true,"user":{"type":"individual","id":"6daf8c256c240f37","login":"clairesunstudio","name":"Minghua Sun","avatar_url":"https://avatars-next.observableusercontent.com/21939bae715c61b768db5f1c4ab756b8a508ba4ec6baed4c0bc111ef246a44da","tier":null}}],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":9,"collection":{"id":"6330313d0708a590","slug":"the-art-of-data-visualization","title":"The Art of Data Visualization (Fall 2023)","owner":{"id":"9d1923139c08a6e1","login":"datavizstudio","name":"datavizstudio"}},"type":"notebook","body":{"titling":"auto","title":"Basic Javascript Concepts for Data","cells":[{"id":0,"value":"# Basic Javascript Concepts for Data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":35,"value":"hello world","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":23,"value":"md`**hello world**`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"html`hello world`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"\"hello world!\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":40,"value":"## Data(Value) Types\nJavaScript has dynamic typing, meaning you don't explicitly declare the data type.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":51,"value":"### Primative Data Types\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":724,"value":"#### String\nRepresents a sequence of characters, wrapped in single or double quotes.\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":726,"value":"name = \"John\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":728,"value":"#### Number\nRepresents both integer and floating-point numbers.\n","pinned":true,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":731,"value":"age = 25; ","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":734,"value":"#### Boolean \nRepresents true or false values.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":736,"value":"isStudent = true;","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":128,"value":"typeof name","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1203,"value":"typeof age","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1207,"value":"typeof isStudent","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":165,"value":"### Null and Undefined\nBoth represent the absence of value.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":596,"value":"null","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":171,"value":"### Undefined\nDefault value when a variable is declared but no value is assigned.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":167,"value":"{\n var name;\n return name\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":80,"value":"### Changing types between number and string","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":83,"value":"Number('123')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":85,"value":"String(123)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":87,"value":"parseInt(123.4) // base 10","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":89,"value":"parseInt('123.4', 10) // decimal part is truncated","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":600,"value":"+\"123\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":605,"value":"+\"this is not a number\" // NaN stands for \"Not a Number\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":609,"value":"### Calculations\n\nJavascript can perform all basic mathematical calculations directly, and additional ones require [Math helper functions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math).\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":613,"value":"(1+2)*3/4","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":618,"value":"2**3 === Math.pow(2,3)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":620,"value":"Math.min(1,2,3)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":622,"value":"Math.max(1,2,3)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":624,"value":"Math.random() // returns a random number greater than or equal to 0 and less than 1","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1016,"value":"### Concatenate Strings","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1018,"value":"\"news\"+\"paper\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1022,"value":"`${name} is ${age}.` //template strings","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":48,"value":"### Reference Data Types","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":566,"value":"\n#### Array\nRepresents an ordered list of values.\nThe Array object, as with arrays in other programming languages, enables storing a collection of multiple items under a single variable name, and has members for performing common array operations.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":55,"value":"colors = [\"red\", \"green\", \"blue\"];","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":554,"value":"mixedArray = [1, \"Hello\", true, {name: \"John\"}, () => \"Function result\"];","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":742,"value":"A common use case in JavaScript are arrays of objects.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":545,"value":"students = FileAttachment(\"tell_me_about_you@4.csv\").csv()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":559,"value":"#### Object\nRepresents a collection of key-value pairs and is used for complex data structures.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":752,"value":"myObject = ({name: \"Paul\", age: 25, city: \"Boston\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":753,"value":"In Observable, we add parenthesis to objects defined in a cell. This is a slight twist from vanilla JavaScript, i.e. standard JavaScript. That's because Observable cells are unique, and you can read more about that here. Other than that slight syntax difference, it functions exactly the same.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1014,"value":"myObject.name === myObject[\"name\"]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1042,"value":"Note: = is assignment, == is a conditional","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":654,"value":"## Data Operations and Transformation","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":671,"value":"students[0] // the first array - indices starting at 0","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":678,"value":"students.length","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":675,"value":"columns = students[\"columns\"]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":680,"value":"columns.indexOf(\"Do you live in Massachusetts?\") // returns the index of the first matching item","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":686,"value":"students.concat({\"Timestamp: \": new Date()}) // combine values into a new array","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":771,"value":"```students.push({\"Timestamp: \": new Date()}) // appending values into the existing array```","pinned":true,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":763,"value":"### String","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":711,"value":"#### Convert Strings and Arrays","pinned":true,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":715,"value":"fruits = \"apple,orange,pear\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":716,"value":"fruitsArray = fruits.split(',')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":849,"value":"newFruits = fruitsArray.join('/')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":859,"value":"fruits.replaceAll(',', '/')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":862,"value":"fruits.replace(',', '/') // only replace the first match","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":628,"value":"### Function","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":694,"value":"JavaScript is functional. It likes to bundle up operations for reuse.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":632,"value":"getRandomInt = (max) => (Math.floor(Math.random() * max) + 1)\n// name of the function = (input) => return the output","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":650,"value":"The function above can also be written as:\n```js\nfunction getRandomInt(max) {\n return Math.floor(Math.random() * max) + 1;\n}\n```","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":696,"value":"We can then invoke the function and pass it arguments:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":636,"value":"getRandomInt(10) //returns integer 1-10","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":592,"value":"### Map","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1194,"value":"Map is function that takes in an array and through a \"mapping\" function, returns a different array.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":548,"value":"student_data = students.map((student, i) => ({...student, name: `student ${i+1}`}));\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":705,"value":"### More on Array Operations\n- [Common array operations](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array#examples) included in plain Javascript\n- Additional array manipulation, ordering, searching, summarizing provided by the [D3 library](https://d3js.org/d3-array)\n- Ask Google or ChatGPT","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1197,"value":"## Conditionals and Loops\n- [MDN docs on Conditionals](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/conditionals)\n- [MDN docs on Loops](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Looping_code)\n- [Observable JS Intro](https://observablehq.com/@observablehq/learn-javascript-introduction)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":586,"value":"## Exercise: Transform the coding languages data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":588,"value":"Goal: visualize the coding languages data in a bar chart","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":819,"value":"### Sample barchart data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":779,"value":"Plot.plot({\n marks: [\n Plot.barX(alphabet.slice(0,5), {x: \"frequency\", y: \"letter\", sort: {y: \"x\", reverse: true}}),\n Plot.ruleX([0])\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":552,"value":"alphabet.slice(0,5)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":822,"value":"### Transform values to structured/quantitative data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":824,"value":"student_data","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":826,"value":"We want to construct a new array - this array will contain Objects structured, like such:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":832,"value":"({ lang: \"HTML\", count: \"3\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":868,"value":"Let's consult ChatGPT!","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":949,"value":"> You can ask like this: create an array of objects like such [expected output] from [input]","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1243,"value":"ChatGPT response:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1241,"value":"$49","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":952,"value":"Tada! You just need to copy and adjust the code snippet. Remember to add {} around the snippet and add a return to invoke the code block, and assign a name for reference","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":931,"value":"langData = {// Create an object to count language frequencies\nconst languageFrequencies = {};\n\n// Iterate through the data and count frequencies\nstudent_data.forEach(entry => {\n const languages = entry[\"Please select all the coding languages you know of.\"].split(/[;,(]/);\n languages.forEach(language => {\n if (languageFrequencies[language]) {\n languageFrequencies[language]++;\n } else {\n languageFrequencies[language] = 1;\n }\n });\n});\n\n// Convert the frequencies into an array of objects\nconst arrayOfObjects = Object.entries(languageFrequencies).map(([lang, count]) => ({\n lang,\n count: count.toString()\n}));\n return arrayOfObjects\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":955,"value":"Plot.plot({\n marginLeft: 120,\n marks: [\n Plot.barX(langDataClean, {x: \"count\", y: \"lang\", sort: {y: \"x\", reverse: true}}),\n Plot.ruleX([0])\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":996,"value":"Cleanup category data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":965,"value":"langDataClean = langData.filter((el) => el.lang !== 'None' && el.lang.length < 20)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1007,"value":"The filter() method of Array instances creates a shallow copy of a portion of a given array, filtered down to just the elements from the given array that pass the test implemented by the provided function. [Array filter](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1009,"value":"Let's plot the data in a different way","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":813,"value":"Plot.plot({\n marginLeft: 100,\n grid: true,\n marks: [\n Plot.dot(students_data_clean, {x: \"name\", y: \"langs\"})\n ]\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":720,"value":"student_data_new = student_data.map((student) => ({\n name: student.name,\n langs: student[\"Please select all the coding languages you know of.\"]\n}))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":786,"value":"students_data_array = student_data_new.map((student) => ({\n name: student.name,\n langs: student.langs.split(/[;,(]/)\n}))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":798,"value":"students_data_flat = students_data_array.flatMap((student) => (student.langs.map((lan) => ({\n name: student.name,\n langs: lan\n}))))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1001,"value":"students_data_clean = students_data_flat.filter((el) => el.langs !== 'None' && el.langs.length < 20)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":901,"value":"The flat() method of Array instances creates a new array with all sub-array elements concatenated into it recursively up to the specified depth. [flatMap](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flatMap) chains map() and flat()","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1248,"value":"","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"}],"files":"$W4a","stdlib":"1"}} 48:"$47:body"