javascript - sacerdote - no a las cadenas de whatsapp

Unir cadenas con un delimitador solo si las cadenas no son nulas o están vacías

Question

Esto parece que debería ser simple, lo siento mucho si me falta algo aquí, pero estoy tratando de encontrar una manera sencilla de concatenar solo cadenas no nulas o no vacías.

Tengo varios campos de dirección distintos:

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

Los valores para estos se establecen en función de algunos campos de formulario en la página y algún otro código js.

Quiero enviar la dirección completa en un div , delimitado por comas + espacio, así que algo como esto:

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

El problema es que uno o todos estos campos podrían estar nulos / vacíos.

¿Hay alguna forma sencilla de unir todos los campos no vacíos en este grupo de campos, sin hacer una verificación de la longitud de cada uno individualmente antes de agregarlo a la cadena?

Answer 1

Considerar

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

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

$.grep(stuff, Boolean) descarta nulos, indefinidos, cadenas vacías y enteros 0 ''s.

En vainilla JS,

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

Answer 2

Otra solución de una línea, que no requiere jQuery :

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

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

Answer 3

Sólo:

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

Answer 4

Solución de Lodash : _.filter([address, city, state, zip]).join()

Answer 5

Tratar

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

Demo: Fiddle

Answer 6

La solución de @aga es excelente, pero no funciona en navegadores más antiguos como IE8 debido a la falta de Array.prototype.filter() en sus motores de JavaScript.

Para aquellos que estén interesados ​​en una solución eficiente que funcione en una amplia gama de navegadores (incluido IE 5.5 - 8) y que no requiera jQuery , consulte a continuación:

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

Incluye algunas optimizaciones de rendimiento descritas en MDN here .

Y aquí hay un ejemplo de uso:

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

Answer 7

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