在jQuery中检查null或未定义的值

Question

我真的被这个问题弄疯了。。。即使我读了很多我都想不通的话题。。。对于已经讨论过的话题，我很抱歉，但我需要一个具体的帮助。

我需要做的是：检查变量是否为空；在这种情况下，打印一个徽章。

远程框架是Codeigniter 3，我确信代码，服务器脚本以JSON格式返回一个空变量(infos(和一个未定义变量(crid(。

Jquery中打印徽章的文字模板如下：

$(`

<p class="badges">
${(() => {
if (data.pictures[i].status == '1'){
return `<span class="badge badge-success">Published</span>`
} else {
return `<span class="badge badge-warning">Hidden</span>`
}
})()}
${(() => {
if (data.pictures[i].infos){
console.log('Infos are ' + data.pictures[i].infos);
return `<span class="badge badge-info">Info</span>`
}
})()}
${(() => {
if (typeof data.pictures[i].crid !== 'undefined' && data.pictures[i].crid !== null){
return `<span class="badge badge-primary">Credit</span>`
}
})()}
</p>
`)

第一个条件代码运行良好(data.pictures[i].status(，第二个和第三个让我抓狂。第二个条件代码(data.pictures[i].infs(在浏览器中返回undefined。。。服务器脚本返回的JSON代码中不存在该变量。第三个条件代码(data.pictures[i].crid(在浏览器中返回undefined。。。JSON数据中的变量存在，但为空。

如果变量为空或不存在，我想在浏览器中删除未定义的。。。。如果它有值，我想打印徽章。

当然，我做了无休止的测试来替换条件代码。。。但有时我会得到徽章，即使JSON变量是空的。。。否则我就无法定义。

非常感谢的任何帮助或提示

Answer 1

您的函数只是一个if，如果它们不进入if，则不返回任何内容。这意味着它返回undefined。

您需要从函数中return ''。

${(() => {
if (data.pictures[i].infos){
console.log('Infos are ' + data.pictures[i].infos);
return `<span class="badge badge-info">Info</span>`
}
return '';
})()}

就我个人而言，我只会使用三元

const status = data.pictures[i].status == '1' ? 
'<span class="badge badge-success">Published</span>' : 
'<span class="badge badge-warning">Hidden</span>'
const info = data.pictures[i].infos ? 
'<span class="badge badge-info">Info</span>' : ''
const crid = (typeof data.pictures[i].crid !== 'undefined' && data.pictures[i].crid !== null) ? 
'<span class="badge badge-primary">Credit</span>' : ''
$(`<p class="badges">
${status}
${info}
${crid}
</p>`)