¿Hay alguna forma de obtener un valor clave del objeto principal de un objeto? En el siguiente ejemplo, quiero combinar urlParent con la section :
const linkItems = [ { id: 1, name: 'Home Page', urlParent: '/home', subItems: [ { subId: 1, name: 'Project 1', section: '#project1', get url() { //output /home#project1 } } ] } ]; console.log(linkItems[0].subItems[0].url) // /home#project1;No puede hacer referencia a un Objeto principal de esa manera (Objeto (valor) ← Matriz ← Objeto), y ni siquiera desde el Objeto principal de un Objeto.
Lo que puedes hacer en su lugar es:
parent , simplemente haga una "lista vinculada" , haciendo referencia a this propiedad principal del elemento secundario creado. class Child { constructor(data) { Object.assign(this, data); } get url() { return this.parent.urlParent + this.section } } class Parent { constructor(data) { Object.assign(this, data); this.subItems = []; } addChild(item) { this.subItems.push(new Child({...item, parent: this})); } } // Example: const parent = new Parent({id:1, name:"Home", urlParent:"/home"}); parent.addChild({subId:1, name:"Project 1", section:"#project1"}); console.log(parent.subItems[0].url) // /home#project1; Su idea original y la anterior utilizan demasiada complejidad.
Lo que sugeriría es tratar a todos los padres, hijos, lo que sea, como nodos de página .
class Page { constructor(data) { Object.assign(this, data); this.children = {}; } addChild(page) { page.parent = this; // Linked to parent! this.children[page.id] = page; } get url() { // Generate full URI by recursing the parents tree return this.parent ? `${this.parent.url}/${this.slug}` : this.slug; } } // Example: // 1. Create pages: const pageRoot = new Page({id:1, name:"Home page", slug:""}); const pageProj = new Page({id:3, name:"All projects", slug:"projects"}); const pageWebs = new Page({id:4, name:"Websites", slug:"websites"}); const pageStOv = new Page({id:6, name:"Stack Overflow", slug:"so"}); const pageSpec = new Page({id:9, name:"Stack Overflow Specs", slug:"specs"}); // 2. Create Tree: pageRoot.addChild(pageProj); pageProj.addChild(pageWebs); pageWebs.addChild(pageStOv); pageStOv.addChild(pageSpec); // 3. Test console.log(pageRoot.url); // ""; console.log(pageProj.url); // "/projects"; console.log(pageSpec.url); // "/projects/websites/so/specs"; console.log(pageRoot);const linkItems = [ { id: 1, name: 'Home Page', urlParent: '/home', get subItems(){ console.log(this.name); return ([ (() => { console.log(this); return { subId: 1, name: 'Project 1', section: '#project1', urlParentFromOuterScope: () => { return this.urlParent; }, sectionString(){ return this.section; }, url(){ console.log('url', this); return this.urlParentFromOuterScope() + this.sectionString(); } } })() ]) } } ]; const subItems = linkItems[0].subitems; console.log(linkItems[0].subItems[0].url());Siéntase libre de eliminar los 'console.log's innecesarios después de comprender el enfoque. Me tomé la libertad de agregar algunos métodos. Esta es complicada y tiene que ver con el alcance de esto en las funciones de matriz. PD: Supongo que esto se puede simplificar.