如何有效地重构typescript中的if.if语句

Question

作为一个练习，我试图找到重构if…if语句的最有效方法。

这是原始代码：

interface Validatable {
value: string | number;
required?: boolean;
minLength?: number;
maxLength?: number;
min?: number;
max?: number;
}
function validate(validatableInput: Validatable) {
let isValid = true;
if (validatableInput.required) {
isValid = isValid && validatableInput.value.toString().trim().length !== 0;
}
if (
validatableInput.minLength != null &&
typeof validatableInput.value === 'string'
) {
isValid =
isValid && validatableInput.value.length >= validatableInput.minLength;
}
if (
validatableInput.maxLength != null &&
typeof validatableInput.value === 'string'
) {
isValid =
isValid && validatableInput.value.length <= validatableInput.maxLength;
}
if (
validatableInput.min != null &&
typeof validatableInput.value === 'number'
) {
isValid = isValid && validatableInput.value >= validatableInput.min;
}
if (
validatableInput.max != null &&
typeof validatableInput.value === 'number'
) {
isValid = isValid && validatableInput.value <= validatableInput.max;
}
return isValid;
}

这就是我目前所取得的成就：

function validate(validatableInput: Validatable) {
const { required, minLength, maxLength, min, max } = validatableInput; // This methos extracts the properties from the object
const validatableInputValue = validatableInput.value;
let isValid = true;
if (required) {
isValid = isValid && validatableInputValue.toString().trim().length !== 0;
}
if (minLength != null && typeof validatableInputValue === "string") {
isValid = isValid && validatableInputValue.length >= minLength;
}
if (maxLength != null && typeof validatableInputValue === "string") {
isValid = isValid && validatableInputValue.length <= maxLength;
}
if (min != null && typeof validatableInputValue === "number") {
isValid = isValid && validatableInputValue >= min;
}
if (max != null && typeof validatableInputValue === "number") {
isValid = isValid && validatableInputValue <= max;
}
return isValid;
}

我还能做什么吗？比如使用switch语句，或者其他什么？非常感谢。

Answer 1

所有条件都遵循一个模式：如果满足特定的先决条件，则根据某些条件验证输入值。您可以通过创建一组这样的条件来利用这一点：每个项目都可以有一个先决条件(例如required(和一个测试(例如value.toString().trim().length !== 0(。然后用类似.every的东西迭代数组，以检查每个truthy先决条件是否满足其相应的条件。

function validate(validatableInput: Validatable) {
const { required, minLength, maxLength, min, max, value } = validatableInput;
const isStr = typeof value === "string";
const isNum = typeof value === "number";
const conditions = [
[required, value.toString().trim().length !== 0],
[minLength != null && isStr, value.length >= minLength],
[maxLength != null && isStr, value.length <= maxLength],
[min != null && isNum, value >= min],
[max != null && isNum, value <= max],
];
return conditions.every(([prereq, result]) => result || !prereq);
}

Answer 2

作为另一种保持现有结构的方法：

function validate(validatableInput: Validatable) {
const { value, required, minLength, maxLength, min, max } = validatableInput;
if (required && value.toString().trim().length === 0) {
return false;
}
if (typeof value !== "string" || typeof value !== "number") {
return true
}
if (typeof value === "string") {
if (minLength && value.length < minLength) {
return false;
}
if (maxLength && value.length > maxLength) {
return false;
}
}

if (min && value < min) {
return false;
}
if (max && value > max) {
return false;
}
return true;
}

需要注意的几点：

• 有些人有提前退货的问题；我不知道——在阅读时，不必继续阅读函数就会立刻清楚发生了什么
• 它没有every选项那么优雅，但它允许更容易的修改、日志记录等，因为它非常明确且被屏蔽
• 由于Validatable是一种类型，我不知道为什么要从中删除此功能，特别是因为决策是基于Validatable属性的类型信息做出的