这两个涉及typeof的函数有什么区别

Question

我的 JavaScript 老师给了我一个掌握函数的任务。我试图解决要求我像第二个代码一样输出的任务：

function showDetails(name = "unknown", age = "unknown", booleanez = "unknown") {
  let name22ez,num22ez,bool22ez;

  typeof booleanez === 'boolean'
    ? (bool22ez = booleanez)
    : typeof booleanez === "number"
    ? (bool22ez = age)
    : (bool22ez = name);

  typeof name === "string"
    ? (name22ez = name)
    : typeof name === "number"
    ? (name22ez = age)
    : (name22ez = booleanez);

  typeof age === "number"
    ? (num22ez = age)
    : typeof age === "string"
    ? (num22ez = name)
    : (num22ez = booleanez);
  return `Hello ${name22ez}, Your Age Is ${num22ez}, You ${
    bool22ez === true ? bool22ez =`Are` : bool22ez = `Are Not`
  } Available For Hire`;
}

document.write(showDetails("Osama", 38, true));
document.write(`<hr>`);
document.write(showDetails(38, "Osama", true));
document.write(`<hr>`);
document.write(showDetails(true, 38, "Osama"));
document.write(`<hr>`);
document.write(showDetails(false, "Osama", 38));

输出是：

Hello Osama, Your Age Is 38, You Are Available For Hire
Hello Osama, Your Age Is 38, You Are Available For Hire
Hello Osama, Your Age Is 38, You Are Available For Hire
Hello 38, Your Age Is false, You Are Available For Hire 

我尝试了很多次，大概 4 个小时，来修复它，但我没有这样做，我从另一个学生那里得到了答案，他的答案是这样的：

function checkStatus(a, b, c) {
    let str, num, bool;
    typeof a === "string"
        ? (str = a)
        : typeof b === "string"
        ? (str = b)
        : (str = c);
    typeof a === "number"
        ? (num = a)
        : typeof b === "number"
        ? (num = b)
        : (num = c);
    typeof a === "boolean"
        ? (bool = a)
        : typeof b === "boolean"
        ? (bool = b)
        : (bool = c);
    return `Hello ${str}, Your Age Is ${num}, You ${
        bool ? "Are" : "Are Not"
    } Available For Hire`;
}

document.write(checkStatus("Osama", 38, true));
document.write(checkStatus(38, "Osama", true));
document.write(checkStatus(true, 38, "Osama"));
document.write(checkStatus(false, "Osama", 38));

输出正确：

Hello Osama, Your Age Is 38, You Are Available For Hire 
Hello Osama, Your Age Is 38, You Are Available For Hire 
Hello Osama, Your Age Is 38, You Are Available For Hire 
Hello Osama, Your Age Is 38, You Are Not Available For Hire

我的代码和我同事的代码有什么区别？

Answer 1

原始代码检查每个参数的类型。类型为string的参数作为名称，类型为number的参数作为年龄，类型为boolean的参数作为租用时间。

你的条件逻辑对我来说完全是神秘的。每个三元组中的第一个测试是正确的——如果booleanez 是布尔值，那么它应该用于bool22ez。但其余的毫无意义。如果booleanez是一个数字，为​​什么这意味着age参数应该分配给bool2ez？

您需要使用与原始逻辑相同的逻辑，针对特定类型测试每个参数，然后将其用作分配给需要该类型的变量的值。

  typeof booleanez === 'boolean'
    ? (bool22ez = booleanez)
    : typeof age === "boolean"
    ? (bool22ez = age)
    : (bool22ez = name);

而且由于您分配的是同一个变量，因此您应该只在赋值的值部分使用三元组，而不是重复要分配的变量。

bool22ez = 
    typeof booleanez === 'boolean'
        ? booleanez
        : typeof age === "boolean"
        ? age
        : name;

Answer 2

很抱歉破坏了您帖子的评论部分。我的观点是，编写此函数的更明智的方法是：

function showDetails(details) {
  // do some type checking up here for the existence of the values
  // because JavaScript is not a strongly typed language
  // ...
  // return the result if the details are provided
  return `Hello ${details.name}, Your Age Is ${details.age}, You ${details.forHire ? 'Are' : 'Are Not'} Available For Hire`;
}

console.log(showDetails({
  name: 'Osama',
  age: 38,
  forHire: true
}))

console.log(showDetails({
  name: 'Osama',
  age: 38,
  forHire: false
}))

不过，为了你的任务，请听@Barmar。

Answer 3

要添加到Barmar's answer，这是正确的代码：

function showDetails(name = "unknown", age = "unknown", booleanez = "unknown") {
  let name22ez,num22ez,bool22ez;

  typeof name === "string"
    ? (name22ez = name)
    : typeof age === "string"
    ? (name22ez = age)
    : (name22ez = booleanez);
  typeof age === "number"
    ? (num22ez = age)
    : typeof name === "number"
    ? (num22ez = name)
    : (num22ez = booleanez);
  typeof booleanez === 'boolean'
    ? (bool22ez = booleanez)
    : typeof name === "boolean"
    ? (bool22ez = name)
    : (bool22ez = age);
  return `Hello ${name22ez}, Your Age Is ${num22ez}, You ${
    bool22ez === true ? bool22ez =`Are` : bool22ez = `Are Not`
  } Available For Hire`;
}

Answer 4

即使我非常同意 Barmar 的说法，这完全是愚蠢的。没有人会写出这样的代码。，我只是喜欢这些挑战。

如果我是你，看看我建议的解决方案：

function showDetails(name = "unknown", age = "unknown", booleanez = "unknown") {
  
  // Accept specific types and one of each
  let acceptedTypes = ["string", "number", "boolean"];
  let typeSet = Array.from(new Set([typeof name, typeof age, typeof booleanez]));
  if (typeSet.length != 3) {
    return "ERROR - I need 3 different types of argument.";
  }
  for (let i = 0; i < typeSet.length; i++) {
    if (acceptedTypes.indexOf(typeSet[i]) == -1) {
      return "ERROR - At least one argument is not accepted.";
    }
  }
  
  // Beyond this point, proceed!
  let args = [
    { type: typeof name, value: name },
    { type: typeof age, value: age },
    { type: typeof booleanez, value: booleanez }
  ];

  // Expecting in this order: "string", "number", "boolean"
  // which are in the reversed alphabetical order...
  // So use sort b-a on the types ;)
  args.sort((a, b) => b.type.localeCompare(a.type))

  return `Hello ${args[0].value}, Your Age Is ${args[1].value}, You Are ${args[2].value ? `` : `Not `}Available For Hire`;
}

console.log(showDetails("Osama", 38, true));
console.log(showDetails(38, "Osama", true));
console.log(showDetails(true, 38, "Osama"));
console.log(showDetails(false, "Osama", 38));
console.log(showDetails(0, "Osama", 38));
console.log(showDetails(0, "Osama", { age: 38 }));
console.log(showDetails());