如何删除是不确定的JSON对象

问题描述：

我打电话给他们使用

categories.map((i,j) =>{ 
    return (<Tab label={'' + i.Name} key={j}/>); 
})

它显示为时尚，健康，不确定的，不确定的，不确定的，因为从141到321的数字是不确定的。

如何防止undefined在答案中打印？谢谢。

你想，而不是打印呢？空字符串的名称或根本没有标签？ – Chris

根本没有标签。只是时尚健康。 – PremKumar

有人在没有任何解释的情况下低估了每一个答案......很好。 – Chris

答

可以有条件地返回它：

categories.map((i,j) =>{ 
    return (i.svcName && <Tab label={'' + i.svcName} key={j}/>); 
})

UPDATE
阵营例如：

const arr = [{ 
 
    val: 1 
 
    }, 
 
    { 
 
    val: 2 
 
    }, 
 
    { 
 
    val: false 
 
    }, 
 
    { 
 
    val: '' 
 
    }, 
 
    { 
 
    noval: 'blahh' 
 
    }, 
 
    { 
 
    val: 3 
 
    }, 
 
    { 
 
    val: undefined 
 
    }, 
 
    { 
 
    val: 4 
 
    }, 
 
] 
 

 
const Tab = ({ value }) => <div className="tab">{value}</div>; 
 

 
class App extends React.Component { 
 
    render() { 
 
    return(
 
     <div> 
 
     { 
 
     arr.map((obj, i) => obj.val && <Tab value={obj.val} key={i} />) 
 
     } 
 
     </div> 
 
    ); 
 
    } 
 
} 
 
ReactDOM.render(<App/>, document.getElementById('root'));

.tab{ 
 
    height: 50px; 
 
    width: 100px; 
 
    display:inline-block; 
 
    background-color: #333; 
 
    color:#fff; 
 
    text-align:center; 
 
    border: 1px solid #fff; 
 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> 
 
<div id="root"></div>

编辑
0在他的回答中提到作为@克里斯，我的做法会排除falsy values如null，undefined，""，0，NaN等

这应该是被接受的答案。 – Chris

答

您必须首先检查是否值不是未定义的阵列中的每个项目：

categories.map((i,j) =>{ 
    return (i.svcName !== undefined && <Tab label={'' + i.svcName} key={j}/>); 
});

这明确地将检查svcName不undefined，但是null，空字符串或任何其他falsy值将通过评估。

如果你想检查falsy值，去@ Sag1v的建议。

是的，我做了检查虚假，因为这个属性名称'svcName'意味着它应该持有一个字符串（不是空的），并通过OP的例子，我想他想要呈现一个带有标题的标签。所以渲染falsy值没有意义。但你写了一个关于它的重要解释。我想我应该把它加在我的回答上 –

是的，它说。 TypeError：无法读取null – PremKumar

@ Sag1v的属性'props'，正确。但考虑到OP的问题，我想我会添加一个答案，明确检查“undefined”，因为你已经覆盖了伪造值。未来可能的读者可能会在寻找未定义的而不是错误的，因此我发布了这个。 – Chris

答

如果你不想地图功能的结果一样[el, el, el, false, el, el]你应该使用前过滤：

categories.filter(el => el.svcName !== undefined).map((i,j) =>{ 
    return (<Tab label={'' + i.svcName} key={j}/>); 
})

虽然这会产生所需的输出，但您实际上正在循环阵列两次，这可能不合需要。 – Chris

但是你不会有像'[el，el，el，false，el，el]这样的地图的结果' – Andrew

你会返回像'false'这样的虚假值和空字符串等等+你正在进行双重迭代 –

答

随着Array#Filter & Array#Map

categories.filter(i => i.svcName !== undefined).map((x,i) => <Tab label={'' + x.svcName} key={i}/>);

您将返回像空字符串等falsy值+您正在进行双重迭代 –

@ Sag1v。好，谢谢。你是对的。但仍然不明白为什么我的答案是dvoted？ –

我不知道，反正也不是我。 –

如何删除是不确定的JSON对象

相关推荐