Javascript Firebase到HTML页面：如何不打印'；未定义'；当数据库中没有值时

我希望我能提供所有必要的信息来解释我的问题。我完全不擅长脚本，所以请原谅我的愚蠢。。。请教我变得更好。ˆˆ

所以你可以在这里找到我的脚本

我想显示所有符合“今天或将来”日期的记录。 目前进展顺利

现在有些唱片没有现场艺人。然后输出为“未定义”。有什么方法可以覆盖这个。。。只是当值和字段不存在时不打印任何内容

    <script src="https://www.gstatic.com/firebasejs/7.2.0/firebase.js"></script>


    <script>
    // Set the configuration for your app

    var config = {
      apiKey: "xxx",
      authDomain: "xxx",
      databaseURL: "xxx",
      storageBucket: "xxx"
      };
      firebase.initializeApp(config);

    // Get a reference to the database service

    //var db = firebase.database();
    const preObject = document.getElementById('Agenda');
    const ulList = document.getElementById('AgendaList');

    // Create references

    const dbRefObject = firebase.database().ref().child('Event');

    // Synch object changes

    dbRefObject.orderByChild("Date").startAt(new Date().toISOString().slice(0,10)).on('child_added', snap => {

    var data = [];
    const li = document.createElement('li');
    var JSONValue = snap.val();

    // create a variable that checks wheater or not there is a picture. If there is a picture print the picture if not do not print anything
    var photo = "";
    if (JSONValue['Photo']!==undefined) {
      photo='<img class="photo" src="'+JSONValue['Photo']+'">'; 
    }

    // check the value of the status field. If the status is Cancelled, print the status. else do not print anything
    var status = ""; 
    if (JSONValue['Status']==='Geannuleerd') {
      status='<span class="status">'+JSONValue['Status']+'</span>';
    }

    // check the value of the message field. If the message is nieuwsbericht then do not print the date. Else print the date.
    var date = "";
    if (JSONValue['Message']==='Concert') {
      date=JSONValue['FullDate'] + '-' + JSONValue['ShortTime']; 
    }

    // check the value of the message field. If the message is nieuwsbericht then do not print the date. Else print the date.
    var title = "";
    if (JSONValue['Message']==='Concert') {
      title=JSONValue['Concert']; 
    }   

    li.innerHTML = '<div class="event">'+photo+'<h3>' +date+ '</h3>' + '<h1>' +title+ '</h1>' + JSONValue['Artists'] + '</div>';
    li.id = snap.key;
    ulList.appendChild(li);

    });
    </script>

//设置应用程序的配置
变量配置={
apiKey：“xxx”，
authDomain:“xxx”，
数据库URL:“xxx”，
存储桶：“xxx”
};
firebase.initializeApp（配置）；
//获取对数据库服务的引用
//var db=firebase.database（）；
const preObject=document.getElementById（'Agenda'）；
const ulList=document.getElementById（'AgendaList'）；
//创建引用
const dbreObject=firebase.database（）.ref（）.child（'Event'）；
//同步对象更改
dbreObject.orderByChild（“日期”）.startAt（新日期（）.toISOString（）.slice（0,10））.on（'child_added'，snap=>{
var数据=[]；
const li=document.createElement（'li'）；
var JSONValue=snap.val（）；
//创建一个变量，用于检查是否有图片。如果有图片，请打印图片。如果没有，则不打印任何内容
var photo=“”；
如果（JSONValue['Photo']！==未定义）{
照片=''；
}
//检查状态字段的值。如果状态被取消，则打印状态。否则，不打印任何内容
var status=“”；
如果（JSONValue['Status']='GEANNULERD'）{
status=''+JSONValue['status']+''；
}
//检查消息字段的值。如果消息是nieuwsbericht，则不打印日期。否则打印日期。
var日期=”；
如果（JSONValue['Message']='Concert'）{
date=JSONValue['FullDate']+'-'+JSONValue['ShortTime']；
}
//检查消息字段的值。如果消息是nieuwsbericht，则不打印日期。否则打印日期。
var title=“”；
如果（JSONValue['Message']='Concert'）{
title=JSONValue['Concert']；
}   
li.innerHTML=''+photo+''+date+''+title+''+JSONValue['Artists']+''；
li.id=snap.key；
ulList.appendChild（li）；
});

如果未定义

JSONValue['Artists']

，您可以使用逻辑“OR”运算符（写为

|

）有条件地显示其他内容

JSONValue['Artists']|

这基本上意味着“获取

JSONValue['Artists']

的值，或者如果它的值是falsy（未定义，null，empty，zero，false），则使用空字符串代替”

代码中的相关行为：

li.innerHTML=''+照片+''+日期+''+''+标题+''+（JSONValue['Artisters'].| | |+''）+''；

我在

JSONValue['Artists']| |“

周围添加了括号，以明确操作顺序

您还可以使用其他内容作为后备：

JSONValue['Artists']| |“这场音乐会没有艺人”

您可以在此处阅读有关逻辑运算符的更多信息：