文字列がnullまたは空でない場合にのみ、区切り文字で文字列を結合します

これは単純なように思えるので、ここで何か不足している場合は申し訳ありませんが、私はnull以外または空でない文字列のみを連結する簡単な方法を見つけようとしています。

いくつかの個別の住所フィールドがあります。

var address;
var city;
var state;
var zip;

これらの値は、ページのいくつかのフォームフィールドと他のいくつかのjsコードに基づいて設定されます。

divカンマ+スペースで区切られた完全なアドレスをに出力したいので、次のようにします。

$("#addressDiv").append(address + ", " + city + ", " + state + ", " + zip);

問題は、これらのフィールドの1つまたはすべてがnull /空になる可能性があることです。

文字列に追加する前にそれぞれの長さを個別にチェックせずに、このフィールドのグループ内の空でないすべてのフィールドを結合する簡単な方法はありますか？

検討する

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)）すべての「偽の」値（null、未定義、空の文字列など）を削除します。「空」の定義が異なる場合は、次のように指定する必要があります。

 [...].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

必要としないさらに別の1行ソリューションjQuery：

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

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

Lodashソリューション：_.filter([address, city, state, zip]).join()

ただ：

[address, city, state, zip].filter(Boolean).join(', ');

@agaのソリューションはすばらしいですが、JavaScriptエンジンにArray.prototype.filter（）がないため、IE8などの古いブラウザーでは機能しません。

幅広いブラウザー（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 で説明されているいくつかのパフォーマンス最適化が含まれています。

そしてここに使用例があります：

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));

デモ：フィドル

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