Tengo problemas para entender lo que sucede en el código de apertura del Capítulo 7 de Eloquent Javascript.
const roads = [ "Alice's House-Bob's House", "Alice's House-Cabin", "Alice's House-Post Office", "Bob's House-Town Hall", "Daria's House-Ernie's House", "Daria's House-Town Hall", "Ernie's House-Grete's House", "Grete's House-Farm", "Grete's House-Shop", "Marketplace-Farm", "Marketplace-Post Office", "Marketplace-Shop", "Marketplace-Town Hall", "Shop-Town Hall" ]; function buildGraph(edges) { let graph = Object.create(null); function addEdge(from, to) { if (graph[from] == null) { graph[from] = [to]; } else { graph[from].push(to); } } for (let [from, to] of edges.map(r => r.split("-"))) { addEdge(from, to); addEdge(to, from); } return graph; } const roadGraph = buildGraph(roads);La siguiente explicación, tal como se proporciona en esta publicación , tiene sentido en sí misma:
Por ejemplo, las tres primeras iteraciones crearán conexiones desde la Casa de Alicia. El primero en llegar es Bob's House. Así que el gráfico ["Alice's House"] no está definido, y ponemos ["Bob's House"] allí. En la próxima iteración, es de la casa de Alice a la cabaña; pero ahora el gráfico ["Alice's House"] no está vacío, por lo que lo agregamos, lo que da como resultado ["Bob's House", "Cabin"]. Al final de la carrera, sabremos que si estamos en la casa de Alice, hay tres posibles lugares a los que podemos ir (la casa de Bob, la cabaña y la oficina de correos).
Estoy seguro de que entiendo la lógica detrás de cómo se llena la matriz. Pero esto es lo que no entiendo:
¿Podría alguien, por favor, guiarme a través de las primeras dos iteraciones con más detalle? He pasado mucho tiempo tratando de resolver esto, pero siento que he llegado a un callejón sin salida.
En este fragmento se imprimen los pasos del flujo. Consulte los comentarios en el fragmento para obtener alguna explicación.
Para jugar con este código, he creado un proyecto Stackblitz .
const log = Log(); const roads = [ "Alice's House-Bob's House", "Alice's House-Cabin", "Alice's House-Post Office", "Bob's House-Town Hall", ]; const connections = buildGraph(roads); log(` `, `**Result**`, JSON.stringify(connections, null, 2)); function buildGraph(edges) { const graph = {}; /* [from] and [to] are strings sent from the (for) loop if [graph] contains a key [from], its value is an array, so [to] is concatted to it. Otherwise graph[from]'s value will be a new array, with first value [to] In other words: [from] is always the key (a string), added if non existent in [graph], or supplemented with the value of [to] */ const addEdge = (from, to) => { const exists = from in graph; log(`<code>graph['${from}']</code> exists?${ exists ? ` yep.` : ` nope. (graph['${from}'] will be added with ["${to}"] as value.`}`); graph[from] = graph[from] ? graph[from].concat([to]) : [to]; log(` <code>graph['${from}']</code> value now ${JSON.stringify(graph[from])}`); } // for every pair of strings from the splitted value of every element // of [roads] ... for (let [from, to] of edges.map(r => r.split(`-`))) { addEdge(from, to); addEdge(to, from); } return graph; } // for demo function Log() { const res = document.querySelector('#result'); return (...args) => { args.forEach(arg => res.appendChild( Object.assign(document.createElement(`div`), { innerHTML: `${arg}`, className: `logEntry` }) )) }; } body { font: normal 12px/16px verdana, arial; } .logEntry { margin: 5px 0; } code { background-color: #eee; color: green; padding: 1px 2px; } <pre id="result"></pre>