比较日期并将布尔值返回到日历的逻辑答案

【问题标题】：Logic to compare dates and return boolean value to calendar比较日期并将布尔值返回到日历的逻辑
【发布时间】：2021-01-30 14:37:22
【问题描述】：

我正在为日历选择器组件实现一个逻辑，该组件具有 disabledDateCallback 事件参数，提供日期，但需要应用一些逻辑，以便它可以禁用从 a 返回的所有日期服务，提供的返回语句应该是布尔值。

<CalendarPicker 
  disabledDateCallback={(date:Date)=>{
    dateService.holidays.map((d)=>{
    return date === d
  })
}}
/>

问题是组件需要布尔值，但我不确定如何比较日期和服务日期 n 返回布尔值

【问题讨论】：

我认为您需要显示更多代码
dateService.holidays.map((d)=>{ return date === d }) 这段代码实际上返回了一个布尔数组，而我想你的回调只需要返回一个，也许你正在寻找some？
return !!dateService.holidays.filter((d)=>{ return date === d }).length我这可能就是你要找的那个
@AdarshMohan 确实如此。或者更直接return dateService.holidays.some(d => date === d);
@AbhishekKonnur 很高兴为您提供帮助。将其转化为带有解释和建议的答案。

【解决方案1】：

正如其他人所指出的，以下功能无法禁用任何dateService holidays

(date: Date) => {
    dateService.holidays.map((d)=> {
      return date === d
    })
 })

因为CalendarPicker 的disabledDateCallback 属性应该是一个函数，如果传递给它的日期应该被禁用，则返回真值；如果不应禁用日期，则返回假值。

但是，上面的函数总是返回 undefined，这是一个假值，因为它缺少 return 语句。

我们可以先修改如下

(date: Date) => {
    return dateService.holidays.map(d => {
      return date === d
    })
 })

但现在它总是返回一个真实值，因为Array.prototype.map 通过对每个元素应用指定的回调将一个数组转换为另一个数组。由于数组总是真实的，因此该函数现在将禁用所有日期，无论它们是否与输入匹配。

相反，我们将利用Array.prototype.some，它接受谓词回调并返回true，当且仅当数组中至少有一个元素满足谓词时；否则返回false。

因此我们想要为disabledDateCallback 传递的回调结果是

(date: Date) => {
   return dateService.holidays.some(d => {
      return date === d
    })
 })

这也是高度可读且更高效的，因为我们使用some 来清楚地表达我们的高层次意图，some 不需要遍历整个数组来回答它的问题，因为它可以尽快停止它遇到我们提供的谓词返回真实值的值。

最后，让我们稍微清理一下代码，因为我们的函数体由单个语句语句组成，在这种情况下我们可以删除块 {} 和 return，因此它不必要地冗长。

(date: Date) => dateService.holidays.some(d => date === d)

此外，由于我们将 dateDisabledCallback 内联传递作为创建 <CalendarPicker> 元素的一部分，因此我们可以通过利用类型推断来进一步改进。

<CalendarPicker 
  disabledDateCallback={date => dateService.holidays.some(d => date === d)}

非常希望允许 TypeScript 类型推断引擎推断回调参数的类型，此处为 date，原因有很多，其中类型安全是最重要的。当然这只适用于内联回调。

【讨论】：