基于字符串长度范围的禁用按钮

Disable button based on string length range

提问人:Sha 提问时间:11/10/2022 最后编辑:Peter SeligerSha 更新时间:11/11/2022 访问量:519

问:

我有一个输入字段和一个按钮。在以下简单方案中应启用该按钮:

  • 输入长度等于 10,或
  • 输入长度大于 15(应禁用 11 到 14)。

我试过了,但这些条件都失败了,因为两种情况之间存在冲突。我知道我可以检查长度是否不等于 11、12、13 或 14,但这看起来不太好。任何更好的解决方案将不胜感激。!str.length = 10 || !str.length >= 15

javascript 条件语句 比较 boolean-logic demorgans-law

评论

0赞 Андрей Беспалов 11/10/2022
试试这个条件 str.length > 14 && str.length === 10
1赞 Nikita Chayka 11/10/2022
禁用 = !(str.length == 10 || str.length >=15)
0赞 Robert Bradley 11/10/2022
你能发送一个更完整的代码示例吗?
0赞 Peter Seliger 11/10/2022
表达它只有两种选择......从字面上遵循 OP 的标准......“......按钮应 ... - 输入长度等于 10 [或] 输入长度大于 15“ ... .相反或否定,禁用,然后是...... 而不是 OP 放在括号中的内容......“(应禁用 11 到 14)”......因为这已经是另一回事了。enabled: (str.length > 15 || str.length === 10)disabled: (str.length <= 15 && str.length !== 10)
0赞 Peter Seliger 11/16/2022
@Sha - “......(应禁用 11 到 14 岁)......“不是对......“应该启用[用于]......'输入长度等于 10'或'输入长度大于 15'”

答:

0赞 Lima 11/10/2022 #1

尝试:

!(str.length == 10 || str.length > 15)

编辑

当需要禁用按钮时,这将返回 true,当不需要禁用按钮时,这将返回 false。

@Peter Seliger,为什么这不是一个好的解决方案?

评论

0赞 Peter Seliger 11/10/2022
请使用评论部分,而不是问题的编辑功能......“彼得·塞利格(PeterSeliger)为什么这个解决方案不好?”...因为它不符合 OP 的任何用例/规范/条件。...“当需要禁用按钮时,这将返回 true,当不需要禁用按钮时,这将返回 false。”...不,它没有。请参阅我关于此主题的回答,包括执行您的方法的测试用例。我怀疑上述实现是否经过其创建者的测试。
1赞 Lima 11/10/2022
好吧,我错了,我认为它可以是 15 岁。
0赞 Peter Seliger 11/10/2022
我相应地调整了测试用例。更改后的函数现在符合 OP 原始启用规范的反转/否定规范;因此,您当前的禁用检查符合上述情况,但不符合 OP 对禁用的不同规范,这不是实现的错,而是归咎于 OP 对禁用的不精确表述。
2赞 Robert Bradley 11/10/2022 #2

您在第一个条件中使用了单个等号,该条件用于设置变量,而不是检查它们是什么。它需要是 或 ,在这种情况下,是首选,因为它用于检查两种不同的类型(例如字符串、整数)。===========

编辑:此外,由于有点新,我无法判断在您的条件中的第一个操作数之前使用感叹号应该是什么,因此只是复制了该部分,不知道您要完成的正确形式是什么,因为您似乎没有试图反转返回值。经过进一步调查,我开始相信他们只是不应该在那里。因此,我通过完全省略它们来编辑下面的解决方案。


应该是:

(str.length === 10 || str.length >= 15)

编辑:似乎有必要说明,尽管 OP 说如果等于 10 或“大于 15”就应该启用它,但 OP 显然意味着等于或大于 15,因为 OP 三次表明这就是他们的意思,说“(应该禁用 11 到 14)”,把“,”并再次说, “不等于 11、12、13 或 14。”>= 15

评论

0赞 Peter Seliger 11/10/2022
请考虑更新或删除您的答案,因为上述建议的解决方案无法满足 OP 的任何用例(甚至不是模糊的用例)。@whoever投了赞成票......在投票之前,应该阅读一个关键的答案,也许还可以对建议的解决方案进行一些简单的测试。
0赞 Peter Seliger 11/10/2022 #3

OP 在启用条件和另一个不同的禁用条件方面模糊不清,这并不是对前者的否定,以及对 LimaRobert Bradley 的答案的赞成票,确实迫使除了我的原始评论之外,还有一个单独的答案和测试用例。

  • 只有两种表达方式,从字面上看,遵循 OP 的标准:
    • "...按钮应该在 ...

      • 输入长度等于 10
      • [或]输入长度大于 15“ ...

      启用:(str.length > 15 || str.length === 10)

    • 相反或否定禁用,然后是......

      禁用:(str.length <= 15 && str.length !== 10)

      ...而不是 OP 放在括号里的东西, “(应禁用 11 到 14),” 因为这已经是另一回事了。

无论在哪种配置中运行 LimaRobert Bradley 提出的解决方案,它们的实现总是失败的,因为使用的条件永远不会与任何用例匹配,无论是启用的还是否定的启用的,还是 OP 的特定/特殊禁用

function isEnabledAccordingToOpsSpecification(str) {
  return (str.length > 15 || str.length === 10);
}
function isDisabledAccordingToOpsSpecAndDeMorgansLaws(str) {
  // De Morgan's laws - (From Wikipedia, the free encyclopedia)
  // see ... [https://en.wikipedia.org/wiki/De_Morgan%27s_laws]
  return (str.length <= 15 && str.length !== 10);
}


function isDisabledAccordingToAnotherOpsSpec(str) {
  return (str.length >= 11 && str.length <= 14);
}

function isDisabledAccordingToUserRobertBradley(str) {
  return (!str.length === 10 || !str.length >= 15);
}

function isDisabledAccordingToUserLima(str) {
  return !(str.length == 10 || str.length >= 15);
}

// after Lima's changes/edit.
function isDisabledAccordingToUserLimaAfterAppliedFix(str) {
  return !(str.length == 10 || str.length > 15);
}
function isEnabledAccordingToUserLimaAfterAppliedFix(str) {
  return (str.length == 10 || str.length > 15);
}


const enabledTestConfigAccordingToOpsSpec = [
  ['01234567', false],
  ['012345678', false],
  ['0123456789', true],         // length ... "equal to 10"
  ['0123456789a', false],
  ['0123456789ab', false],
  ['0123456789abc', false],
  ['0123456789abcd', false],
  ['0123456789abcde', false],   // length ... "equal to 15"
  ['0123456789abcdef', true],   // length ... "greater than 15"
  ['0123456789abcdef0', true],  // length ... "greater than 15"
  ['0123456789abcdef01', true], // length ... "greater than 15"
];

console.log(
  '- all tests passed for OP\'s "enabled" specification ?..',
  enabledTestConfigAccordingToOpsSpec
    .every(([str, expectedValue]) =>
      expectedValue === isEnabledAccordingToOpsSpecification(str)
    )
);
console.log(
  '- all tests passed for OP\'s negated (De Morgan\'s laws) "enabled" specification ?..',
  enabledTestConfigAccordingToOpsSpec
    .every(([str, expectedValue]) =>
      expectedValue !== isDisabledAccordingToOpsSpecAndDeMorgansLaws(str)
    //!expectedValue === isDisabledAccordingToOpsSpecAndDeMorgansLaws(str)
    )
);


const disabledTestConfigAccordingToAnotherOpsSpec = [
  ['01234567', false],
  ['012345678', false],
  ['0123456789', false],
  ['0123456789a', true],        // length ... "equal to 11"
  ['0123456789ab', true],       // length ... "equal to 12"
  ['0123456789abc', true],      // length ... "equal to 13"
  ['0123456789abcd', true],     // length ... "equal to 14"
  ['0123456789abcde', false],
  ['0123456789abcdef', false],
  ['0123456789abcdef0', false],
  ['0123456789abcdef01', false],
];

console.log(
  '\n- all tests passed for another OP\'s specific "disabled" specification ?..',
  disabledTestConfigAccordingToAnotherOpsSpec
    .every(([str, expectedValue]) =>
      expectedValue === isDisabledAccordingToAnotherOpsSpec(str)
    )
);

console.log(
  '\n... disabled according to the negated OP\'s "enabled" specification ...\n- all tests passed for another OP\'s specific "disabled" specification ?..',
  disabledTestConfigAccordingToAnotherOpsSpec
    .every(([str, expectedValue]) =>
      expectedValue === isDisabledAccordingToOpsSpecAndDeMorgansLaws(str)
    )
);

console.log(
  '\n... disabled according to user Robert Bradley ...\n- all tests passed for another OP\'s specific "disabled" specification ?..',
  disabledTestConfigAccordingToAnotherOpsSpec
    .every(([str, expectedValue]) =>
      expectedValue === isDisabledAccordingToUserRobertBradley(str)
    )
);
console.log(
  '\n... disabled according to user Lima ...\n- all tests passed for another OP\'s specific "disabled" specification ?..',
  disabledTestConfigAccordingToAnotherOpsSpec
    .every(([str, expectedValue]) =>
      expectedValue === isDisabledAccordingToUserLima(str)
    )
);


console.log('\n\n+++ Running Robert\'s and  Lima\'s implementations in all other test scenarios in case the intention of each implementation has been gotten wrong +++');

console.log([
  'Robert',

  disabledTestConfigAccordingToAnotherOpsSpec
    .every(([str, expectedValue]) =>
      expectedValue !== isDisabledAccordingToUserRobertBradley(str)
    ),

  enabledTestConfigAccordingToOpsSpec
    .every(([str, expectedValue]) =>
      expectedValue === isDisabledAccordingToUserRobertBradley(str)
    ),
  enabledTestConfigAccordingToOpsSpec
    .every(([str, expectedValue]) =>
      expectedValue !== isDisabledAccordingToUserRobertBradley(str)
    //!expectedValue === isDisabledAccordingToUserRobertBradley(str)
    ),
].join(' ... '));

console.log([
  'Lima',

  disabledTestConfigAccordingToAnotherOpsSpec
    .every(([str, expectedValue]) =>
      expectedValue !== isDisabledAccordingToUserLima(str)
    ),

  enabledTestConfigAccordingToOpsSpec
    .every(([str, expectedValue]) =>
      expectedValue === isDisabledAccordingToUserLima(str)
    ),
  enabledTestConfigAccordingToOpsSpec
    .every(([str, expectedValue]) =>
      expectedValue !== isDisabledAccordingToUserLima(str)
    //!expectedValue === isDisabledAccordingToUserLima(str)
    ),
].join(' ... '));

console.log('\nLima ... after having applied the fixes ...');
console.log(
  '- all tests passed for OP\'s "enabled" specification ?..',
  enabledTestConfigAccordingToOpsSpec
    .every(([str, expectedValue]) =>
      expectedValue === isEnabledAccordingToUserLimaAfterAppliedFix(str)
    )
);
console.log(
  '- all tests passed for OP\'s negated "enabled" specification ?..',
  enabledTestConfigAccordingToOpsSpec
    .every(([str, expectedValue]) =>
      expectedValue !== isDisabledAccordingToUserLimaAfterAppliedFix(str)
    //!expectedValue === isDisabledAccordingToUserLimaAfterAppliedFix(str)
    )
);
.as-console-wrapper { min-height: 100%!important; top: 0; }

在 Lima 提出实现修复程序后进行编辑

我相应地调整了测试用例。Lima 更改的功能现在符合 OP 原始启用规范的反转/否定规范;因此,Lima目前的禁用检查符合上述情况,但不符合OP对禁用的不同规范,这不是Lima更新实施的错,而是归咎于OP对禁用的不精确表述