Javascript typescript对象属性有数据,父对象显示与空对象相同的属性
我看到一些奇怪的行为,当记录到控制台(并在其他地方使用)时,作为对象属性的数组出现填充,但当记录父对象时,它将属性显示为空。当此父对象返回到调用函数时,属性保持为空 这是菜单类:Javascript typescript对象属性有数据,父对象显示与空对象相同的属性,javascript,typescript,javascript-objects,Javascript,Typescript,Javascript Objects,我看到一些奇怪的行为,当记录到控制台(并在其他地方使用)时,作为对象属性的数组出现填充,但当记录父对象时,它将属性显示为空。当此父对象返回到调用函数时,属性保持为空 这是菜单类: import { MenuItem } from './menu-item'; export class Menu { category: string; label?: string; itemArray: MenuItem[] = []; displayArray: MenuItem[] = []
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类(它可以以比此处更复杂的方式使用):
下面是一些构造这些对象的代码。请注意,当类别为“date”且项的属性为硬编码时,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;
}
}
我认为这实际上是Chrome中的一个bug。只是控制台有点奇怪。我发现我的应用程序的问题是由于其他原因造成的,但这被错误的调试信息隐藏了。注意,这是Angular 2应用程序的一部分。不过,我认为这并不重要。我认为这实际上是Chrome中的一个bug。只是控制台有点奇怪。我发现我的应用程序的问题是由于其他原因造成的,但这被错误的调试信息隐藏了。请将鼠标悬停在菜单旁边的
I
。这不是一个错误,这是一个错误的切换箭头做什么。谢谢。我刚刚浏览了Chrome控制台文档,没有提到当你点击箭头时会显示什么。有一点是关于您可以让它以xml等形式显示它的事实,但没有关于何时计算该对象。为什么以后计算它意味着数组是空的?如果数组是空的,则应用程序将更新为这些效果,而事实并非如此。我建议记录类似于JSON.stringify(m)
(如果没有循环引用);这将使您获得日志发生时的对象结构。我没有调查问题发生的原因,只是想告诉您初始日志和对象中的值不同步。
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;
}
}