考虑

var address = "foo";
var city;
var state = "bar";
var zip;

text = [address, city, state, zip].filter(Boolean).join(", ");
console.log(text)

.filter(Boolean)（与.filter(x => x)相同）删除所有“falsy”值（空值，未定义，空字符串等）。如果你对“空”的定义不同，那么你必须提供它，例如：

[...].filter(x => typeof x === 'string' && x.length > 0)

将只保留列表中的非空字符串。

（过时的jquery答案）

var address = "foo";
var city;
var state = "bar";
var zip;

text = $.grep([address, city, state, zip], Boolean).join(", "); // foo, bar

另一种不需要jQuery的单行解决方案：

var address = "foo";
var city;
var state = "bar";
var zip;

text = [address, city, state, zip].filter(function(val) {
  return val;
}).join(', ');

console.log(text);

Lodash解决方案：_.filter([address, city, state, zip]).join()

@阿加的解决方案很棒，但它在IE8等旧浏览器中不起作用，因为它们的JavaScript引擎中缺少Array.prototype.filter()。
对于那些有兴趣在广泛的浏览器（包括IE 5.5 - 8）中工作的高效解决方案并且不需要jQuery的人，请参阅下面：

var join = function (separator /*, strings */) {
    // Do not use:
    //      var args = Array.prototype.slice.call(arguments, 1);
    // since it prevents optimizations in JavaScript engines (V8 for example).
    // (See https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments)
    // So we construct a new array by iterating through the arguments object
    var argsLength = arguments.length,
        strings = [];

    // Iterate through the arguments object skipping separator arg
    for (var i = 1, j = 0; i < argsLength; ++i) {
        var arg = arguments[i];

        // Filter undefineds, nulls, empty strings, 0s
        if (arg) {
            strings[j++] = arg;
        }
    }

    return strings.join(separator);
};

它包括MDN here上描述的一些性能优化。
下面是一个使用示例：

var fullAddress = join(', ', address, city, state, zip);

试试看

function joinIfPresent(){
    return $.map(arguments, function(val){
        return val && val.length > 0 ? val : undefined;
    }).join(', ')
}
$("#addressDiv").append(joinIfPresent(address, city, state, zip));

演示：Fiddle

$.each([address,city,state,zip], 
    function(i,v) { 
        if(v){
             var s = (i>0 ? ", ":"") + v;
             $("#addressDiv").append(s);
        } 
    }
);`

这里有一个简单的，不带filter的IE6（可能更早）向后兼容解决方案。

TL;DR →查看最后第三个代码块

toString()习惯于将数组转换为CSV，并忽略所有非字符串的内容，所以为什么不利用这一点呢？

["foo", null, "bar", undefined, "baz"].toString()

→ foo,,bar,,baz

对于简单的CSV数据导出用例，这是一个非常方便的解决方案，因为列计数保持不变。
join()也有同样的习惯，但让我们选择连接分隔符：

['We built', null, 'this city', undefined, 'on you-know-what'].join(' 🤘🏼 ')

→**We built 🤘🏼 🤘🏼 this city 🤘🏼 🤘🏼 on you-know-what**
由于OP要求逗号后有一个漂亮的空格，并且可能不喜欢额外的逗号，他们在最后接受了replace-RegEx治疗：

["foo", null, "bar", undefined, "baz"].join(', ').replace(/(, ){2,}/g, ', ')

→ foo, bar, baz

警告：(, ){2,}是一个相当简单的RegEx，它匹配所有2+个逗号后跟一个空格的出现-因此，它可能会过滤数据开头或结尾处出现的任何, ,或,。
这一点并不重要，您在这里完成了一个整洁简单、向后兼容的一行程序。
如果这是一个问题，我们需要想出一个分隔符，它是如此遥远，它出现在你的数据项两次（或一次在开始或结束）的概率接近零。比如crazy-ſđ½ł⅞⅝⅜¤Ħ&Ł-delimiter，你怎么看？
你也可以使用字面上的 * 任何 * 字符，甚至可能是那些在你的本地字符集中不存在的字符，因为它只是我们算法的停止符号，所以你可以这样做：

["foo", null, "bar", undefined, "baz"]
  .join('emoji-✊🏻🙈🕺🤷🏼🧘🏽🎸🏆🚀-delimiter')
  .replace(/(emoji-✊🏻🙈🕺🤷🏼🧘🏽🎸🏆🚀-delimiter){2,}/g, ', ')

或者（在更DRY的版本中：

var delimiter = 'emoji-✊🏻🙈🕺🤷🏼🧘🏽🎸🏆🚀-delimiter'
var regEx = new RegExp('(' + delimiter + '){2,}', 'g')

["foo", null, "bar", undefined, "baz"].join(delimiter).replace(regex, ', ')

2023年答案

使用ternary operator的更简单的解决方案

let append = `${address || ''}, ${city || ''}, ${state || ''}, ${zip || ''}`;

$("#addressDiv").append(append);

它将评估var是否为false。如果是，将返回空字符串。