30:[] 2e:{"title":"Method essentials","cells":[{"id":0,"value":"# Method essentials\n\nAssorted functions and methods.","pinned":false,"hidden":false,"mode":"md"},{"id":1232,"value":"___\n\n### Basics","pinned":false,"hidden":false,"mode":"md"},{"id":36,"value":"n = 64","pinned":true,"hidden":false,"mode":"ojs"},{"id":15,"value":"___\n\nGenerate array of numbers","pinned":false,"hidden":false,"mode":"md"},{"id":5,"value":"nums = [ ...Array( n ).keys() ]\n .map( d => (( d/10 ) - 0.5 )\n .toFixed(1)).map(parseFloat)","pinned":false,"hidden":false,"mode":"ojs"},{"id":156,"value":"___\n\nGenerate random array","pinned":false,"hidden":false,"mode":"md"},{"id":153,"value":"rand = Array.from({length: n}, () => Math.random()) // .map(d => ({val: d})) for maps","pinned":false,"hidden":false,"mode":"ojs"},{"id":87,"value":"___\n\nMap function to array","pinned":false,"hidden":false,"mode":"md"},{"id":66,"value":"keys = nums.map(num => cyrb53(num.toLocaleString(),1))","pinned":false,"hidden":false,"mode":"ojs"},{"id":25,"value":"___ \n\nMap custom function to single value/array","pinned":false,"hidden":false,"mode":"md"},{"id":30,"value":"transform = {\n \n let input = nums; \n if (!Array.isArray(input)) \n { input = [input]}\n \n let transform = (item) => item * 10\n \n return input.map(transform);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":76,"value":"___\n\nMap arrays to tidy object","pinned":false,"hidden":false,"mode":"md"},{"id":52,"value":"tidy = { \n \n const array = \n keys.map((id, index) => {\n \n return { \n key: id,\n nums1: nums[index],\n nums2: nums[index]/2,\n static: \"text\" }\n });\n \n return array }\n\n// from: https://stackoverflow.com/questions/40539591/\n// how-to-create-an-array-of-objects-from-multiple-arrays\n\n// mapping column like data\n// https://riptutorial.com/javascript/example/8628/\n// merge-two-array-as-key-value-pair","pinned":false,"hidden":false,"mode":"ojs"},{"id":198,"value":"___\n\nFlatten objects to array","pinned":false,"hidden":false,"mode":"md"},{"id":189,"value":"flat = tidy.map(d => Object.entries(d)).flat() // (d) can be pointed to nested arrays","pinned":false,"hidden":false,"mode":"ojs"},{"id":251,"value":"___\n\nFlatten specific entries","pinned":false,"hidden":false,"mode":"md"},{"id":246,"value":"pick = tidy.map(d => \n [ Object.entries(d)[0][1],\n Object.entries(d)[1][1]])","pinned":false,"hidden":false,"mode":"ojs"},{"id":282,"value":"___\n\nNamed object or array reduce","pinned":false,"hidden":false,"mode":"md"},{"id":272,"value":"name = \n ['a','b','c','c'].reduce( \n \n // use (key) or access [i]ndex\n ( acc, key, i ) => \n ( acc[key] = \n \n // [i]ndex array or input, e.g. 'nums'\n [i].map(d => [d]), acc ),\n \n // {obj} or [arr]\n {} )","pinned":false,"hidden":false,"mode":"ojs"},{"id":362,"value":"___\n\nJoin key/value arrays to objects using reduce","pinned":false,"hidden":false,"mode":"md"},{"id":318,"value":"join = \nArray.from([nums,rand,[1,2,3]], data => \n keys.reduce( ( obj, key, index ) => \n ( { ...obj, ['id'+key]: data[index] }), \n { static: 'string' } ) )","pinned":false,"hidden":false,"mode":"ojs"},{"id":232,"value":"___\n\nN-dimensional sequence","pinned":false,"hidden":false,"mode":"md"},{"id":228,"value":"nseq = aq\n .table({ index: [0]})\n .derive({index: op.sequence(1,16,1),\n rank: op.sequence(1,8,1),\n pos: op.sequence(1,4,1)})\n \n .unroll('index')\n .unroll('rank')\n .unroll('pos')\n .objects()","pinned":true,"hidden":false,"mode":"ojs"},{"id":703,"value":"___\n\nReduce search","pinned":false,"hidden":false,"mode":"md"},{"id":707,"value":"find = tidy.reduce( (pool,d,i) => { if(d.nums1 > 0.2 && d.nums1 <= 0.5) { pool.push(d/*i for index*/)} return pool }, [])","pinned":false,"hidden":false,"mode":"ojs"},{"id":1237,"value":"___\n\n### Functions","pinned":false,"hidden":false,"mode":"md"},{"id":1239,"value":"zipf = Array.from({length:512}, (_,x,s = 0.5, R = 512, b = 0)=>((1/((x+1)**s))*R)-b)","pinned":false,"hidden":false,"mode":"ojs"},{"id":420,"value":"___\n\nObserve events","pinned":false,"hidden":false,"mode":"md"},{"id":476,"value":"mutable element = []","pinned":true,"hidden":false,"mode":"ojs"},{"id":468,"value":"down = {\n\n document.\n addEventListener(\"keypress\", event => { \n if (event.key === 'Enter') {\n ++mutable element\n } \n }) \n\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":418,"value":"viewof over = {\n\n const div = html`\n

\n

event button

` // tabindex hack for div keypress\n \n div.value = true; // put anything here except undefined\n \n div.addEventListener(\"mousemove\", event => { \n div.dispatchEvent(new Event(\"input\"))\n }); \n\n div.addEventListener(\"keypress\", event => { \n if (event.key === 'Enter') {\n div.dispatchEvent(new Event(\"input\"))\n } \n })\n \n return div\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":430,"value":"move = over","pinned":false,"hidden":false,"mode":"ojs"},{"id":752,"value":"___\n\n### Trees\n\nRecursive type checker and iterator.","pinned":false,"hidden":false,"mode":"md"},{"id":751,"value":"function iterate(obj, out = []) {\n\n // recurse over keys \n Object.keys(obj).forEach((key) => { \n out.push(key);\n if (check(obj[key], {}, []) && obj[key] !== null) {\n iterate(obj[key], out) }});\n \n return out }","pinned":true,"hidden":false,"mode":"ojs"},{"id":781,"value":"check = (prop, ...types) =>\n types.some((type) =>\n Object.prototype.toString.call(prop) ===\n Object.prototype.toString.call(type));","pinned":true,"hidden":false,"mode":"ojs"},{"id":771,"value":"___\n\nFunctional generator-based tree reducer","pinned":false,"hidden":false,"mode":"md"},{"id":786,"value":"sourceTree = ({a:0, b:{c:{d:0}},e:[{i:1},{i:2},{i:3}]})","pinned":false,"hidden":false,"mode":"ojs"},{"id":788,"value":"targetTree = \nreduceTree( (pool, value, path) => \n [ ...pool, { p:path.join('.'), value } ], [] , sourceTree )","pinned":true,"hidden":false,"mode":"ojs"},{"id":775,"value":"// https://stackoverflow.com/questions/52807498/\n// nested-reduce-functions-recursion-functional-programming-tree-traversal/52822287#52822287\n\nfunction* traverse (tree = {}, path = []) { \n for (const [ key, value ] of Object.entries (tree))\n if (check(value, {},[])) {\n yield* traverse (value, append (path, key))}\n else\n yield [ append (path, key), value ]\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":790,"value":"reduceTree = (proc, state, tree) =>\n reduce\n ( (acc, [ path, value ]) =>\n proc (acc, value, path)\n , state\n , Array.from (traverse (tree))\n )","pinned":true,"hidden":false,"mode":"ojs"},{"id":777,"value":"reduce = (proc, state, arr) =>\n arr .reduce (proc, state)","pinned":true,"hidden":false,"mode":"ojs"},{"id":779,"value":"append = (xs, x) =>\n xs .concat ([ x ])","pinned":true,"hidden":false,"mode":"ojs"},{"id":856,"value":"pathGen(sourceTree)","pinned":true,"hidden":false,"mode":"ojs"},{"id":852,"value":"function pathGen(obj) {\n \n let acc = {};\n for (let [path, value] of pathGen(obj)) {\n //acc[value] = acc[value] || [];\n acc[path] = value; //path.split('.').reverse()[0] ;\n }\n\n function* pathGen(obj) {\n for (let k in obj) {\n if (check(obj[k], {}, [])) {\n for (let [childPath, value] of pathGen(obj[k])) {\n yield [`${k}.${childPath}`, value];\n \n }\n } else {\n yield [k];\n }\n }\n }\n return acc;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":938,"value":"// https://stackoverflow.com/questions/60352470\n// get-all-paths-to-a-specific-key-in-a-deeply-nested-object\n\nfunction getAllPaths(obj, prev = '') {\n \n let result = []\n for (let k in obj) {\n let path = prev + (prev ? '.' : '') + k;\n\n result.push([path,k])\n if (check(obj[k],{},[])) {\n result.push(getAllPaths(obj[k], path))\n }\n } return result\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1205,"value":"___","pinned":false,"hidden":false,"mode":"md"},{"id":1213,"value":"integerTee = {\n \n let tree = {};\n \n index(1,tree)\n index(21,tree)\n index(301,tree)\n index(401,tree)\n index(2401,tree)\n \n return tree\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1208,"value":"function index(uint, tree) {\n \n let size = fastLen(uint);\n let last;\n\n for (let i = 0; i < size; ++i) {\n \n let digit = ((uint * 10 ** -i) | 0) % 10;\n if (last) {\n last = last[digit] ? last[digit] : last[digit] = {};\n } else if (tree[digit]) {\n last = tree[digit];\n } else {\n last = tree[digit] = {};\n }\n }\n last.freq ? last.freq++ : (last.freq = 1);\n}\n","pinned":true,"hidden":false,"mode":"ojs"},{"id":1211,"value":"fastLen = (input) =>\n (input < 10) ? 1 : \n (input < 100) ? 2 : \n (input < 1000) ? 3 : \n (input < 10000) ? 4 : \n (input < 100000) ? 5 : \n (input < 1000000) ? 6 : \n (input < 10000000) ? 7 : \n (input < 100000000) ? 8 : \n (input < 1000000000) ? 9 : \n (input < 10000000000) ? 10 : \n (input < 100000000000) ? 11 : \n (input < 1000000000000) ? 12 : \n (input < 10000000000000) ? 13 : \n (input < 100000000000000) ? 14 : \n (input < 1000000000000000) ? 15 : 16","pinned":true,"hidden":false,"mode":"ojs"},{"id":1110,"value":"___","pinned":false,"hidden":false,"mode":"md"},{"id":1227,"value":"### Observables","pinned":false,"hidden":false,"mode":"md"},{"id":955,"value":"a = html``","pinned":true,"hidden":false,"mode":"ojs"},{"id":957,"value":"b = html``","pinned":true,"hidden":false,"mode":"ojs"},{"id":1155,"value":"resolve()","pinned":true,"hidden":false,"mode":"ojs"},{"id":1114,"value":"async function* resolve(obj) { \n \n let a_ = Generators.input(a)\n let b_ = Generators.input(b) \n let sub = {sub:{a_,b_}}\n let out = {}\n \n for await (let [key,val] of Object.entries(sub) ) {\n if(key == 'sub'){\n out[key] = {}; resolve(val)\n \n } else { out[key] = 0; }\n\n yield out\n \n }\n\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":952,"value":"Promise.allDeep = function (entity) {\n \n let keys = Object.keys(entity)\n return Promise.all(keys.map(key=>{\n \n let value = entity[key]\n if(check(value,{})&&!value.then){\n \n return Promise.allDeep(value)\n } return value\n }))\n .then(data => {\n return keys.reduce((pool, key, i) => { pool[key] = data[i]\n return pool }, \n Array.isArray(entity) ? [] : {})}\n )\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1184,"value":"___\n\nWalk comments / nodes in DOM","pinned":false,"hidden":false,"mode":"md"},{"id":1193,"value":"// https://stackoverflow.com/a/16152333\n{ \n let out = [];\n let tw = document.createTreeWalker(frag, NodeFilter.SHOW_COMMENT, null, null),\n comment;\n \n while ((comment = tw.nextNode())) {\n out.push(comment);\n } \n \n return out;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":1190,"value":"frag = html`

Hello

`","pinned":true,"hidden":false,"mode":"ojs"},{"id":523,"value":"___\n\n### Debugging","pinned":false,"hidden":false,"mode":"md"},{"id":527,"value":"// { for(var i in window) { return window[i] } }","pinned":false,"hidden":false,"mode":"ojs"},{"id":83,"value":"___\n\n### Imports","pinned":false,"hidden":false,"mode":"md"},{"id":1251,"value":"dynamicModule = { \n \n var src = `export class Data {}`\n var blob = new Blob([src], { type: \"text/javascript\",});\n var objectURL = URL.createObjectURL(blob);\n \n invalidation.then(()=>\n URL.revokeObjectURL(objectURL))\n \n return import(objectURL)\n \n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":61,"value":"cyrb53 = function(str, seed = 0) {\n let h1 = 0xdeadbeef ^ seed, h2 = 0x41c6ce57 ^ seed;\n for (let i = 0, ch; i < str.length; i++) {\n ch = str.charCodeAt(i);\n h1 = Math.imul(h1 ^ ch, 2654435761);\n h2 = Math.imul(h2 ^ ch, 1597334677);\n }\n h1 = Math.imul(h1 ^ (h1>>>16), 2246822507) ^ Math.imul(h2 ^ (h2>>>13), 3266489909);\n h2 = Math.imul(h2 ^ (h2>>>16), 2246822507) ^ Math.imul(h1 ^ (h1>>>13), 3266489909);\n return 4294967296 * (2097151 & h2) + (h1>>>0);\n} // from https://stackoverflow.com/a/52171480","pinned":false,"hidden":false,"mode":"ojs"},{"id":129,"value":"import {aq, op} from \"@uwdata/arquero\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":575,"value":"import {share} from '@tomlarkworthy/shareview@308'","pinned":true,"hidden":false,"mode":"ojs"},{"id":536,"value":"___\n\n### Resources","pinned":false,"hidden":false,"mode":"md"},{"id":540,"value":"* https://lage.us/Javascript-Watch-Variables-for-Change.html\n\n* https://stackoverflow.com/a/44640865\n\n* https://stackoverflow.com/questions/37949981/call-child-method-from-parent\n\n * https://stackoverflow.com/a/61674406\n \n* https://nestedsoftware.com/2018/04/23/asynchronous-generators-and-pipelines-in-javascript-1h62.26991.html\n\n* https://stackoverflow.com/questions/36258502/why-has-object-observe-been-deprecated\n\n* https://blog.logrocket.com/practical-use-cases-for-javascript-es6-proxies/\n\n* https://www.codersbistro.com/blog/understanding-the-javascripts-bind-method/\n\n* https://stackoverflow.com/a/38494334\n\n* https://github.com/observablehq/inputs/issues/73\n\n* https://stackoverflow.com/questions/60218309/creating-dynamic-getters-and-setters-from-a-base-object-in-javascript\n\n* https://stackoverflow.com/questions/7390426/better-way-to-get-type-of-a-javascript-variable","pinned":false,"hidden":false,"mode":"md"},{"id":553,"value":"viewof options = {\n const n = Inputs.range([1, 30], {value: 19, step: 1, label: \"size\"});\n const a = Inputs.range([0, 45], {value: 27.5, step: 0.1, label: \"angle\"});\n const x = Inputs.range([-100, 100], {value: 0, step: 1, label: \"x offset\"});\n const y = Inputs.range([-100, 100], {value: 0, step: 1, label: \"y offset\"});\n return Object.defineProperty(html`${[n, a, x, y]}`, \"value\", {\n get() {\n return {\n n: n.value,\n a: a.value,\n p: [x.value, y.value]\n };\n },\n set({n: _n, a: _a, p: _p}) {\n if (_n !== undefined) n.value = _n;\n if (_a !== undefined) a.value = _a;\n if (_p !== undefined) [x.value, y.value] = _p;\n }\n });\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":556,"value":"// viewof options.value = ({x: 9})","pinned":true,"hidden":false,"mode":"ojs"},{"id":578,"value":"share('nested', viewof options)","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W30","stdlib":"1","titling":"auto"}