JavaScript内联替换undefined为空字符串

Question

I have this function:

function callWS(input) {
    var output = {
        "type"  : input["type"]  || "",
        "mark"  : input["mark"]  || "",
        "model" : input["model"] || "",
        "year"  : input["year"]  || ""
    };

    return output;
}

我希望用户可以使用多种方式调用这个函数：

callWS(); ==> {"type":"","mark":"","model":"","year":""}
callWS({"type":"moto"}); ==> {"type":"moto","mark":"","model":"","year":""}
callWS({"type":"moto","mark":"audi"}); ==> {"type":"moto","mark":"audi","model":"","year":""}

如果某个参数未定义，将其初始化为空字符串。目前我的函数在第一种情况下不起作用，但在其他情况下可以正常工作。

当我像callWS()这样调用它时，我会得到：

Uncaught TypeError: Cannot read property 'type' of undefined

说实话，我不知道为什么对于第二和第三种情况可以正常工作，但我也需要让它对于第一种情况也能正常工作。我知道如果我使用：

if (input["type"])

使用will do the trick，但我需要一种内联解决方案。这可行吗？

- paulalexandru

---

在 callWS 函数的开头添加 input = input || {}，以便为 input 变量提供默认值。请注意，这不会更改原始意思，只是使语言更加通俗易懂。 - hindmost

将您的函数定义为 function callWS(input = {})。 - user663031

@torazaburo - 该项目不包括ES6。 - paulalexandru

@François Wahl - 不幸的是，该项目没有使用jQuery，也没有使用任何外部库。 - paulalexandru

@paulalexandru 因此，如果您不使用jQuery，您可以轻松编写自己的代码 :) 我在我的示例中只使用了JavaScript，但是您已经解决了这个问题 :) - Nope

@FrançoisWahl - 确实。谢谢您的解决方案，只是我在寻找最简单的解决方案，以尽可能少的代码添加。但您的解决方案也可能有助于其他人。 - paulalexandru

Answer 1

您必须同时为 input 变量本身提供默认值。

function callWS(input) {
   input = input || {};
   ...
}

否则您将访问不存在（未定义）的对象的属性，这将导致错误（目前的情况）。

另一方面，在现有对象上访问不存在的属性在JS中不被视为错误。

- hindmost

---

是的@torazaburo，但他想要具有属性创建的对象，而不是未定义的对象。 - LellisMoon

@torazaburo 好的，现在我明白了。抱歉，三个点让我犯了错误。 - LellisMoon

Answer 2

你可以编写自己的extend方法并使用它。这样，您就可以拥有一个默认对象，给它任何默认值，然后将其与传递到函数中的对象合并。

function extend(a, b){
    for(var key in b){
        if(b.hasOwnProperty(key)){
            a[key] = b[key];
        }
    }

    return a;
}

function callWS(input) {
    var defaultInput = {
        "type": "",
        "mark": "",
        "model":"",
        "year": ""
    }
    
    var output = extend(defaultInput, input);

    return output;
}

console.log(callWS());
console.log(callWS({"type":"moto"}));
console.log(callWS({"type":"moto","mark":"audi"}));

- Nope

Answer 3

在ES6中，可以这样写：

function callWS({type = "", mark = "", model = "", year = ""} = {}) {
  return {type, mark, model, year};
}

这里有另一种不涉及ES6的方法。许多库都包含一个名为default的实用工具，如果某些属性缺失，它将会将这些属性应用到另一个对象上。

function deflt(obj, defaults) {
  var keys = Object.keys(defaults);
  for (var i = 0; i < keys.length: i++) {
    var key = keys[i];
    if (!(key in obj)) obj[key] = defaults[key];
  }
  return obj;
}

您可以按照以下方式使用：

function callWS(input) {
  input = input || {};
  deflt(input, {type: "", mark: "", model: "", year: ""});
  return input;
}

注意：按照当前的写法，这将返回输入的修改版本。如果这不是您想要的，请进行相应的调整。

- user663031

---

很遗憾，该项目不使用ES6。 - paulalexandru