Question

假设值firsName和lastName来自某些数据源。该值有时可能为null或都未定义。 fullName将两者结合在一起。

let a = {};
let b = {
    fullName: a && a.firstName+' '+a.lastName
};
console.log("fullName is "+JSON.stringify(b.fullName)); // fullName is "undefined undefined"

a = {
    firstName: null,
    lastName: null
};
b = {
    fullName: a.firstName+' '+a.lastName
};
console.log("fullName is "+JSON.stringify(b.fullName)); // fullName is "null null"

b = {
    fullName: {...a.firstName, ...' ', ...a.lastName}
};
console.log("fullName is "+JSON.stringify(b.fullName)); // fullName is {"0":" "}

b = {
    fullName: {...a.firstName, ...a.lastName}
};
console.log("fullName is "+JSON.stringify(b.fullName)); // fullName is {}

我当前的解决方案是

const getFullName = (firstName, lastName ) => {
    if ((typeof firstName == "undefined" || firstName === null) && (typeof lastName == "undefined" || lastName === null)) {
            return null;
    }
    else { 
        return firstName+' '+lastName
    }
}

b = {
    fullName: getFullName(a.firstName, a.lastName)
};
console.log("fullName with function is "+JSON.stringify(b.fullName)); // fullName with function is null

a = {};
console.log("fullName with function is "+JSON.stringify(b.fullName)); // fullName with function is null

是否有更好的方法使b.fullName的值为null（无需编写函数）？

Answer 1

以下是更好的解决方案：

return [firstName, lastName].filter(it => !!it).join(" ") || null

请注意，这还将在空/未定义中包含“”，如果您提供一个而不提供另一个，则避免在字符串中包含“ null”。通常，这对于您正在编写的功能可能是理想的。

例如：getFullName("John", null)将返回“约翰”

Answer 2

这是使用宽松的相等运算符有益的少数情况之一，因为null和undefined是loosely equal to each other, but to nothing else。然后，您可以将条件简化为：

const getFullName = (firstName, lastName ) => {
    if (firstName == null && lastName == null) {
        return null;
    } else { 
        return firstName + ' ' + lastName
    }
}

Answer 3

这是使用三元数处理它的一种方法。

const fName = undefined;// undefined;
const lName = undefined;

const fullName = (fName || lName) ? `${fName||""} ${lName||""}`.trim() : null;

console.log(fullName);

在这里，我们将destructuring和default值一起使用。

const person1 = {
  firstName: undefined,
  lastName: undefined
}

const person2 = {
  firstName: "Bob",
  lastName: undefined
}

const displayName = ({firstName: f='', lastName: l=''}, {x: fn} = {x: f+' '+l}) => {
  fn = fn.trim();
  console.log((fn==='') ? undefined : fn);
}


displayName(person1);
displayName(person2);

Answer 4

不幸的是，没有一个很好的简单方法可以做到这一点。您可以缩短所需的代码：

let firstName = null;
let lastName = undefined;

let fullName = ((firstName || "") + " " + (lastName || "")).trim() || null;

console.log(fullName)

不是很漂亮。更好的代码可能是

let firstName = null;
let lastName = undefined;

let fullName = [firstName, lastName].filter(s => s != null).join(' ') || null;

console.log(fullName)

但是，重复很多次仍然很麻烦。

相反，您仍然可以使用函数并将其通用化为任意数量的参数，以便稍后可以在其他地方重用它：

const combine = (...strings) => strings.filter(s => s != null).join(" ") || null;

console.log(combine("Alice"))
console.log(combine("Bob", null))
console.log(combine("Fred", "Bloggs"))
console.log(combine("Samuel", "L", "Jackson"))

如果您还想泛化定界符，则可以通过部分应用轻松实现：

const combine = (delimiter = " ") => (...strings) => strings.filter(s => s != null).join(delimiter) || null;

const combineNames = combine();
const combineCSV = combine(",")

console.log("--- names ---")
console.log(combineNames("Alice"))
console.log(combineNames("Bob", null))
console.log(combineNames("Fred", "Bloggs"))
console.log(combineNames("Samuel", "L", "Jackson"))

console.log("--- comma separated values ---")
console.log(combineCSV("Alice"))
console.log(combineCSV("Bob", null))
console.log(combineCSV("Fred", "Bloggs"))
console.log(combineCSV("Samuel", "L", "Jackson"))

Answer 5

我认为您太难了，这很好。我总是自己做。但是，让我提出一个简单的解决方案：

const getFullName = (firstName, lastName ) => {
    firstName = firstName || "";
    lastName = lastName || "";
    if ( firstName != "" && lastName != "" ) {
        return firstName & " " & lastName;
    }
    else if ( firstName == "" && lastName == "" ) {
        return null;
    }
    else {
        return firstName || lastName;
    }
}

它基本上将undefined和null变成空字符串，然后只处理空字符串。您要么拥有两个名字，要么没有名字，要么只有一个。

Answer 6

return firstName?lastName?firstName+' '+lastName:null:null;

Answer 7

另一个单线可能是

const getFullName = (firstname, lastname) => (firstname || '' + ' ' + (lastname || '')).trim() || null

说明：

firstname || ''如果将firstname评估为可为空值（0, '', null, false, undefined, NaN...），它将打印一个空字符串。然后，我们将空格连接起来，然后执行相同的操作。小心，这次由于JS中的左右评估，我将括号之间的操作封装了修剪结果，如果它是一个空字符串，它将返回null，否则将返回名字或姓氏或两者都

Answer 8

这可能是最简单的格式。

您将两个值连接在一起。如果没有值，则默认为空字符串。然后修剪结果。如果没有剩余，请返回null。

这不允许名字和姓氏都为空字符串。

function makeName(f, l) {
  return `${f||''} ${l||''}`.trim() || null
}

console.log(`[${makeName()}]`);
console.log(`[${makeName('', '')}]`);
console.log(`[${makeName('John')}]`);
console.log(`[${makeName('John', 'Smith')}]`);

JavaScript如何连接两个null或undefined并返回null

8 个答案: