如何让JavaScript执行&&比较中的所有方法而非短路判断？

JavaScript 的 && 运算符存在短路判断特性：如果第一个表达式返回 false，就不会再执行后续表达式。当表达式是带有副作用（比如修改状态、显示错误提示）的方法时，我们需要先执行所有验证方法，再判断它们的结果是否都为 true。

比如有两个验证用户输入的方法：

const validateEmail = value => {
    if(value.includes('@')){
        setShowEmailError(false);
        return true;
    }
    setShowEmailError(true);
    return false;
};

const validatePswd = value => {
    if(value !== ''){
        setShowPswdError(false);
        return true;
    }
    setShowPswdError(true);
    return false;
};

如果用 && 判断，当 validateEmail(email) 返回 false 时，validatePswd(pswd) 不会执行，导致密码的错误状态无法更新：

if(validateEmail(email) && validatePswd(pswd)){
    // 仅当两个验证都通过时执行逻辑
}

如何实现既执行所有验证方法，又判断它们的结果都为 true？

解决方案 #

1. 先分别调用所有方法，保存结果后再判断 #

最直接的方式：先执行所有验证方法，把结果存到变量里，最后用 && 判断结果。不管前面的结果是 true 还是 false，所有方法都会执行。

const isEmailValid = validateEmail(email);
const isPswdValid = validatePswd(pswd);

if(isEmailValid && isPswdValid){
    // 两个验证都通过时执行逻辑
}

2. 使用数组存储结果，再用 every() 方法判断 #

如果验证方法较多，可把结果放到数组里，用数组的 every() 方法判断所有结果是否为 true。这种方式扩展性更好，新增验证方法时只需添加到数组中即可。

const validations = [
    validateEmail(email),
    validatePswd(pswd)
    // 可添加更多验证方法
];

if(validations.every(result => result)){
    // 所有验证都通过时执行逻辑
}

3. 使用位运算符 &（不推荐，但可行） #

逻辑与的位运算版本 & 不会短路，会执行所有表达式后再计算结果。注意：位运算会把布尔值转为数字（true 对应1，false对应0），最终结果是0或1，需转为布尔值判断。

if(validateEmail(email) & validatePswd(pswd)){
    // 两个验证都通过时执行逻辑
}

提示：这种方式虽然能实现需求，但代码可读性较差，不建议在业务代码中使用，优先选择前两种方法。

内容的提问来源于stack exchange，提问作者Schnitzler