打字稿对象属性有数据，父对象显示相同的属性为空

Question

我看到一些奇怪的行为，当记录到控制台（并在其他地方使用）时，作为对象属性的数组出现填充，但是当记录父对象时，它显示该属性为空.当这个父对象返回给调用函数时，该属性保持为空。

这是菜单类：

import { MenuItem } from './menu-item';

export class Menu {
  category: string;
  label?: string;
  itemArray: MenuItem[] = [];
  displayArray: MenuItem[] = [];
  masterArray: MenuItem[] = [];
  singleChoice: boolean = false;
  isDisplaying: boolean = true;
  isCategory( s: string ) { return this.category = s; };
}

这里是 MenuItem 类（它可以以比这里显示的更复杂的方式使用）：

import { Menu } from './menu';

export class MenuItem {
  label: string;
  value: string;
  children: MenuItem[] = [];
  parentMenu: Menu;
  isSelected: boolean = false;
  isCategory( s: string ) { return this.parentMenu.category = s; };
  hideFromMenu: boolean = false;
}

下面是一些构造这些对象的代码。请注意，当类别为“日期”并且项目的属性是硬编码时，itemArray 会自行填充，并在通过控制台中的父对象查看时填充。它失败的所有其他类别。

initializeMenu(category: string, categoryName: string): Menu {
  let m = new Menu();
  m.category = category;
  m.label = this.categoryNameArray[this.categoryArray.indexOf(category)]? this.categoryNameArray[this.categoryArray.indexOf(category)]: category;
  switch( category ) {
    case "date":
      let propArray = [
                        {label:"Today",value:"today",hideFromMenu:false},
                        {label:"Day",value:"day",hideFromMenu:true},
                        {label:"This Week",value:"this week",hideFromMenu:false},
                        {label:"Next Week",value:"next week",hideFromMenu:false},
                        {label:"This Month",value:"this month",hideFromMenu:false},
                        {label:"Month",value:"month",hideFromMenu:true}
                      ];
      for(let p of propArray) {
        let i: MenuItem = new MenuItem();
        i.label = p.label;
        i.value = p.value;
        i.hideFromMenu = p.hideFromMenu;
        i.parentMenu = m;
        m.itemArray.push(i);
        // if( ! p.hideFromMenu ) m.displayArray.push(i);
      }
      m.isDisplaying = false;
      m.singleChoice = true;
      m.displayArray = this.getDisplayableDates(m.itemArray);
      m.masterArray = m.itemArray;
      return m;
      // break;
    default:
      let categoryIDs = this.makeContentSet(this.getMenuItemIDs(this.contentItems,category));
      for(let id of categoryIDs){
        let mi = new MenuItem();
        mi.parentMenu = m;
        mi.label = id;
        mi.value = id;
        m.itemArray.push(mi);
      }
      m.displayArray = m.itemArray;
      // m.displayArray = m.itemArray.filter(function(i){return ! i.hideFromMenu});
      m.isDisplaying = false;
      m.singleChoice = false;
      m.masterArray = m.itemArray;
// THIS IS WHERE IT GETS WEIRD. THE FIRST LOG SHOWS A POPULATED 
// m.displayArray, THE SECOND LOG SHOW A PARENT OBJECT WITH POPULATED   
// VALUES FOR EACH ARRAY, THE THIRD LOG SHOWS EMPTY VALUES FOR THE ARRAYS
// IN m. WEIRDER, m SHOWS POPULATED ARRAYS WHEN COLLAPSED IN THE CONSOLE, 
// BUT EMPTY ONES WHEN EXPANDED. SEE SCREENSHOT.
      console.log(m.displayArray);
      console.log(Object.values(m));
      console.log(m);
      return m;
      // break;
  }
}

Answer 1

我认为这实际上是 Chrome 中的一个错误。只是控制台很奇怪。我发现我的应用程序的问题是由其他原因引起的，但这个错误的调试信息隐藏了这一点。