Javascript 嵌套条件语句逻辑错误？

我正在尝试对我上传的文件进行验证我正在检查3件事

1） 文件提交了吗？ 2） 文件类型是否正确？ 3） 文件大小小于允许的大小

出于某种奇怪的原因，我的嵌套条件语句没有返回我所期望的结果

我希望它像：

如果用户输入文件，请检查文件类型。如果文件类型通过，请检查文件大小；如果文件大小通过，请将文件提交到服务器

当我在控制台中测试它时，如果我不提交一个文件，第一个if块通过了，但当我提交正确的文件类型和错误的文件类型时，第二个if块失败。此外，我检查了文件大小块，这两种情况下都失败了

这是我在控制台上的代码和输出。对于文件类型，我已经设置了真实文件类型的状态，以防用户试图欺骗该文件

异步提交（e）{
e、 预防默认值（）；
console.log（this.state）；
//文件大小字节（mb）
var fileCheck=Math.floor（Math.log（this.state.fileSize）/Math.log（1024））；
console.log（文件检查）；
//检查上传的照片是否已拍摄。
if（this.state.fileObject==“”）{
log（“未提交任何文件”）；
}else if（this.state.fileType！=“image/jpeg”| this.state.fileType！=“image/jpg”| this.state.fileType！=“image/png”）{
//检查文件类型
log（“错误的文件类型”）；
}否则如果（文件检查>=2）{
//检查文件大小
log（'文件太大'）；
}
否则{
log（'通过了所有文件检查'）；
}
}

此处的第二个测试将始终评估为真：

else if(this.state.fileType !== 'image/jpeg' || this.state.fileType !== 'image/jpg' || this.state.fileType != 'image/png'){

我建议改为对照阵列进行检查：

const allowedFileTypes = ['image/jpeg', 'image/jpg', 'image/png'];
// ...
else if (!allowedFileTypes.includes(this.state.fileType)) {
  // err, condition failed
}

.includes

是一种半新的方法，如果您支持古老的浏览器，并且不使用polyfills，请使用

indexOf

测试：

const allowedFileTypes = ['image/jpeg', 'image/jpg', 'image/png'];
// ...
else if (allowedFileTypes.indexOf(this.state.fileType) === -1) {
  // err, condition failed
}

---

您对

的使用==

和

|

表示如果条件始终为真，则第一个

else。。。由于
this.state.fileType
只能有一个值，因此它将始终不等于这些值中的至少两个。请注意
！（a | | b）
与
不是一回事！a | | |！b
。您使用的是后者，但您可能想要前者。
===
检查类型和值是否匹配，这可能是问题所在，如果您只观察要匹配的值，请使用
=
，这在您的情况下似乎很理想。好的，谢谢。我可能需要在这方面多加练习。@ZohirSalakCeNa:不，当操作数的类型相同时，这不会有任何区别。当类型不同时，它会执行复杂的类型强制，所以我不建议使用它，除非在极少数情况下。