javascript中的链式三元运算符答案

【问题标题】：chained ternary operator in javascriptjavascript中的链式三元运算符
【发布时间】：2015-05-22 16:06:48
【问题描述】：

我想轻松地对其进行格式化，以便任何人都可以理解最终输出。否则我想使用 if 条件重新编码。任何人都可以帮助我理解以下代码并以更易于理解的方式对其进行格式化。

validate: function() {
    return this.getRequired() && 
   !this.getValue() ? 
        (this.showError("Required"), !1) 
        : this.getValue() ? 
        "email" != this.getType() || this.isValidEmail() ? 
            "email_username" != this.getType() || this.isValidEmail() || this.isValidUsername() ? 
                    "username" != this.getType() || this.isValidUsername() ?
                            "roomid" != this.getType() || this.isValidUsername() ? 
                                        "displayName" != this.getType() || this.isValidDisplayName() ? 
                                                    "phone" != this.getType() || this.isValidPhone() ? !0 
                                                    : (this.showError("Enter a valid phone number"), !1) 
                                        :(this.showError("Enter both first and last names"), !1)  
                            :(this.showError("Enter a valid meeting room ID"), !1) 
                    :(this.showError("Enter a valid username"), !1) 
            :(this.showError("Enter a valid email address or username"), !1) 
        :(this.showError("Enter a valid email address"), !1) 
    : !0
}

【问题讨论】：

在this.getType() 上使用开关似乎是一个更好的解决方案。（感谢@Barmar 纠正大脑放屁）。
无法将其格式化以使其易于理解。嵌套三元组本质上是令人困惑的，只是不要这样做。
是的，那段代码是一团乱七八糟的东西。您可以寻找在线 javascript 格式化程序。
我偶尔会在嵌套很短的时候进行一层嵌套，我永远不会做你正在尝试的事情。
那些!1 实例完全是超现实的。就好像这段代码被设计得尽可能令人讨厌。

标签： javascript

【解决方案1】：

不确定这是否可行？

var items = ['email', 'email_username', 'etc'];
for(var i=0;i<items.length;i++){
    switch(items[i]){
        case 'email':
            if(items[i] != this.getType || items[i].isValidEmail())
            this.showError('Enter a valid email address'), !1) 
            break;
        case 'email_username':
            if(items[i] != this.getType || items[i].isValidEmail() || this.isValidUsername())
            this.showError('Enter a valid email address'), !1) 
            break;
    }
}

【讨论】：

效率不高，但肯定更容易理解
在进行表单验证时，效率几乎不是问题。用户每秒可以执行多少次点击？半打？

【解决方案2】：

这是代码的一部分，我只为电子邮件做了。剩下的事情你需要做：

validate: function () {
    var type = this.getType();
    var isValid = true;
    if (this.getRequired() && !this.getValue()) {
        switch (type) {
            case "email":
                if (!this.isValidEmail()) {
                    isValid = false;
                    this.showError("Enter a valid email address")
                }
                break;
            case "email_username":
                break;
            case "username":
                break;
            case "roomid":
                break;
            case "displayName":
                break;
            case "phone":
                break;
        }
    }
    return isValid;

}

【讨论】：

【解决方案3】：

这实际上不是不可读的。就是格式不好。我会这样格式化它：

return this.getRequired() && !this.getValue()
    ? (this.showError("Required"), false) 
    : this.getValue() 
        ? "email" != this.getType() || this.isValidEmail() 
            ? "email_username" != this.getType() || this.isValidEmail() || this.isValidUsername() 
                ? "username" != this.getType() || this.isValidUsername() 
                    ? "roomid" != this.getType() || this.isValidUsername() 
                        ? "displayName" != this.getType() || this.isValidDisplayName()
                            ? "phone" != this.getType() || this.isValidPhone() 
                                ? true 
                                : (this.showError($L("Enter a valid phone number")), false) 
                            : (this.showError("Enter both first and last names"), false)  
                        : (this.showError("Enter a valid meeting room ID"), false) 
                    : (this.showError("Enter a valid username"), false) 
                : (this.showError("Enter a valid email address or username"), false) 
            : (this.showError("Enter a valid email address"), false) 
        : true

这确实看起来很粗糙，但它节省了大量单独的返回语句，例如“如果这个，那么返回这个，否则如果这个，返回这个......”等等。

另外，是的，!1 语法完全是多余的。

编辑：开关在这里不起作用的原因是因为逻辑是嵌套的。您要么得到替换三元组的嵌套 if 语句，要么必须重写逻辑。如果它工作....太好了。对其进行测试，看看是否可以重构。如果没有......我希望你有这件事的商业规则。

【讨论】：

【解决方案4】：

为什么不使用像这样更易读的格式：

validate: function () {
    var ok = false;
    switch (true) {
        case (this.getRequired() && !this.getValue()):
            this.showError("Required");
            break;
        case ("email" === this.getType() && !this.isValidEmail()):
            this.showError("Enter a valid email address");
            break;//                                         
        case ("email_username" === this.getType() && (!this.isValidEmail() || !this.isValidUsername())):
            this.showError("Enter a valid email address or username");
            break;
        case ("username" === this.getType() && !this.isValidUsername()):
            this.showError("Enter a valid username");
            break;
        case ("roomid" === this.getType() && !this.isValidUsername()):
            this.showError("Enter a valid meeting room ID");
            break;
        case ("displayName" === this.getType() && !this.isValidDisplayName()):
            this.showError("Enter both first and last names");
            break;
        case ("phone" !== this.getType() && !this.isValidPhone()):
            this.showError($L("Enter a valid phone number"));
            break;
        default: ok = true;
    }
    return ok;
}

【讨论】：