JSON新手求教：构建数组时如何按需添加JQuery获取的元素？

嘿，作为刚接触JSON和JS数组的新手，踩这种拼接的坑太正常啦～你原来用+=的写法不对，因为数组不是字符串，直接拼接会把对象转成[object Object]这种没用的字符串，根本没法得到正确的数组结构。我给你两种靠谱的实现方式：

方法一：用数组push()方法（新手友好，直观易懂） #

先初始化包含必填项的数组，然后判断条件满足时，用push()把对应的对象添加进去，这是JS操作数组的标准方式：

// 先创建包含thumbnail项的初始数组
var newsAttachInfo = [{ 
  "fkAttachmentID": attachmentID, 
  "enuAttachmentType": "thumbnail", 
  "fldDisplayText": getCaption(attachmentID) 
}];

// 处理feature-top：注意val()返回的是字符串，要和"0"比较，避免类型问题
var featureTopVal = $('#feature-top').val();
// 额外加个非空判断，防止输入框为空的情况
if (featureTopVal !== "0" && featureTopVal) {
  newsAttachInfo.push({ 
    "fkAttachmentID": featureTopVal, 
    "enuAttachmentType": "feature-top", 
    "fldDisplayText": getCaption(featureTopVal) 
  });
}

// 同理处理feature-bottom
var featureBottomVal = $('#feature-bottom').val();
if (featureBottomVal !== "0" && featureBottomVal) {
  newsAttachInfo.push({ 
    "fkAttachmentID": featureBottomVal, 
    "enuAttachmentType": "feature-bottom", 
    "fldDisplayText": getCaption(featureBottomVal) 
  });
}

关键要点： #

• 数组添加元素必须用push()（或者unshift()加在开头），不能用字符串拼接的方式
• 因为jQuery的val()返回的是字符串类型，所以直接和数字0比较会有类型不匹配的问题，要么转成数字（比如parseInt(featureTopVal, 10) !== 0），要么直接和字符串"0"比较
• 加个featureTopVal非空判断，能避免输入框为空时误添加无效元素

方法二：ES6展开运算符（简洁写法） #

如果你已经接触过ES6语法，可以用展开运算符...来实现更紧凑的代码，条件满足时展开包含对象的数组，否则展开空数组：

var newsAttachInfo = [
  { 
    "fkAttachmentID": attachmentID, 
    "enuAttachmentType": "thumbnail", 
    "fldDisplayText": getCaption(attachmentID) 
  },
  // 条件满足就添加对应对象，否则添加空数组（相当于啥也不加）
  ...($('#feature-top').val() !== "0" && $('#feature-top').val() ? [{
    "fkAttachmentID": $('#feature-top').val(), 
    "enuAttachmentType": "feature-top", 
    "fldDisplayText": getCaption($('#feature-top').val()) 
  }] : []),
  ...($('#feature-bottom').val() !== "0" && $('#feature-bottom').val() ? [{
    "fkAttachmentID": $('#feature-bottom').val(), 
    "enuAttachmentType": "feature-bottom", 
    "fldDisplayText": getCaption($('#feature-bottom').val()) 
  }] : [])
];

这种写法不用额外的变量和push操作，直接在数组初始化时完成条件判断，代码更简洁，但对新手来说可能需要一点时间理解展开运算符的用法。

内容的提问来源于stack exchange，提问作者xanabobana