如果 JSON 数据包含 undefined

如何解决如果 JSON 数据包含 undefined

我正在将一个 excel 文件解析为 JSON，总体上运行良好。但是，如果变量包含来自 JSON 的特定文本，我正试图弄清楚如何附加不同的 HTML。

到目前为止，这是我所拥有的：

/* This is part of the Excel conversion. Added for reference */
var workbook = XLSX.read(bstr,{ type: "binary" });
var first_sheet_name = workbook.SheetNames[0];
var worksheet = workbook.Sheets[first_sheet_name];

  var jData = XLSX.utils.sheet_to_json(worksheet,{ raw: false });

  $.each(jData,function (i,f) {
    var hide = f.Hidden;
    var el =
     "<div class='thing'>" +
      "<h2>" +
      f["First Name"] +
      "&nbsp;" +
      f["Last Name"] +
      "</h2>" +
      "<h3>" +
      f.Title +
      "</h3>" +
      "<p>" +
      f.Comment +
      "</p>" +
      "</div>";
    $(el).appendTo("#wrapper");
  });

但我很好奇的是确保这是有效的：

$.each(jData,f) {
    var hide = f.Hidden;
    var el =
     "<div class='thing'>" +
      "<h2>" +
      f["First Name"] +
      "&nbsp;" +
      f["Last Name"] +
      "</h2>" +
      "<h3>" +
      f.Title +
      "</h3>" +
      "<p>" +
      f.Comment +
      "</p>" +
      "</div>";
    var other =
     "<div class='thing'>" +
      "<h2>" +
      f["First Name"] +
      "&nbsp;" +
      f["Last Name"] +
      "</h2>" +
      "<h3>" +
      f.Title +
      "</h3><p>Comment Hidden</p></div>";
    if (hide === undefined) {
       $(el).appendTo("#wrapper");
    } else {
      $(other).appendTo("#wrapper");
    }
  });

总的来说，如果 hide 变量作为 undefined 从 JSON 数据返回，那么它似乎正在工作，然后从 {{1} } 多变的。但如果它返回为 not 未定义，则从 el 变量附加 HTML。我只是想确保我没有遗漏任何东西。另外，如果可能有更好的方法来解决这个问题。对我来说感觉有点“笨重”，但奇怪的是它似乎在表面上工作。

解决方法

如果 f.Hidden 没有返回 undefined 则追加 el

在这种情况下，您可以使用 typeof 来确定 f.Hidden 值的状态。另请注意，在定义 p 属性时，我通过从 Hidden 中删除注释文本来避免代码中的重复。

$.each(jData,function(i,f) {
  var $el = $(`<div class="thing"><h2>${f["First Name"]}&nbsp;${f["Last Name"]}</h2><h3>${f.Title}</h3><p>${f.Comment}</p></div>`);
  if (typeof f.Hidden !== 'undefined')         
    $el.find('p').text('Comment hidden');

  $('#wrapper').append($el);
});

这里要注意的一点是，如果 f.Hidden 是 true OR false，这将显示评论 - 这似乎违反直觉。

如果您想在 f.Hidden 为 undefined 或 true（这似乎更有意义）时隐藏评论，代码将如下所示：

$.each(jData,f) {
  var $el = $(`<div class="thing"><h2>${f["First Name"]}&nbsp;${f["Last Name"]}</h2><h3>${f.Title}</h3><p>${f.Comment}</p></div>`);
  if (f.Hidden || true)
    $el.find('p').text('Comment hidden');

  $('#wrapper').append($el);
});

|| true 会将任何虚假值（例如 undefined）强制转换为 true。