错误类型错误：无法读取 null 的属性（读取“toISOString”）答案

【问题标题】：ERROR TypeError: Cannot read properties of null (reading 'toISOString')错误类型错误：无法读取 null 的属性（读取“toISOString”）
【发布时间】：2021-12-03 05:51:03
【问题描述】：

我最近将 package.json 中的依赖项升级到最新版本。依赖关系至少过时了 2 年或更长时间。每当我访问正在调用此数据的页面时，我都会收到此错误。我认为问题可能与更新的依赖项及其新功能有关。这是什么原因？

这是错误中引用的代码部分

this.miceBirthdayFilter = (calendarDate: Date): boolean => {
      let birthDates = [];
      this.uniqueValuesForEachAttribute['subject_birth_date'].forEach(date => {
        birthDates.push(date);
      });
      console.log("miceBirthdayFilter in Session " + birthDates.length)
      console.log("calendarDate in miceBirthdayFilter in Session " + calendarDate)
      return birthDates.includes(calendarDate.toISOString().substring(0, 10));
    };

这是更新后的 package.json

{
  "name": "pipeline-viewer",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^12.0.0",
    "@angular/cdk": "^12.0.0",
    "@angular/common": "^12.0.0",
    "@angular/compiler": "^12.0.0",
    "@angular/core": "^12.0.0",
    "@angular/flex-layout": "^12.0.0-beta.35",
    "@angular/forms": "^12.0.0",
    "@angular/material": "^12.0.0",
    "@angular/material-moment-adapter": "^12.0.0",
    "@angular/platform-browser": "^12.0.0",
    "@angular/platform-browser-dynamic": "^12.0.0",
    "@angular/router": "^12.0.0",
    "@wizpanda/super-gif": "0.0.5",
    "angular-plotly.js": "^4.0.4",
    "bootstrap": "^5.1.3", 
    "moment": "^2.29.1",
    "plotly.js": "^2.5.1",
    "rxjs": "^7.4.0",
    "rxjs-compat": "^6.6.7",
    "zone.js": "^0.11.4"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^12.0.0",
    "@angular/cli": "^12.0.0",
    "@angular/compiler-cli": "^12.0.0"
  }
}

这是显示图形和图表的旧 package.json。

{
  "name": "pipeline-viewer",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^7.1.4",
    "@angular/cdk": "^7.3.7",
    "@angular/common": "~7.1.0",
    "@angular/compiler": "~7.1.0",
    "@angular/core": "~7.1.0",
    "@angular/flex-layout": "^7.0.0-beta.24",
    "@angular/forms": "~7.1.0",
    "@angular/material": "^7.3.3",
    "@angular/material-moment-adapter": "^8.1.2",
    "@angular/platform-browser": "~7.1.0",
    "@angular/platform-browser-dynamic": "~7.1.0",
    "@angular/router": "~7.1.0",
    "@wizpanda/super-gif": "0.0.5",
    "angular-plotly.js": "^1.3.2",
    "bootstrap": "^4.2.1",
    "moment": "^2.24.0",
    "plotly.js": "^1.49.0",
    "rxjs": "~6.3.3",
    "rxjs-compat": "^6.3.3",
    "zone.js": "~0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.11.0",
    "@angular/cli": "~7.1.3",
    "@angular/compiler-cli": "~7.1.0"
  }
}

【问题讨论】：

console.log(calendarDate) 的输出是什么？

标签： javascript json angular web

【解决方案1】：

错误告诉你在你的代码中至少有一次传递给函数的值是null。 TypeError: Cannot read properties of null (reading 'toISOString')

您能否通过在您的函数中添加一些提前退出来仔细检查这一点。像这样。

this.miceBirthdayFilter = (calendarDate: Date): boolean => {
      let birthDates = [];
      
      // If calendarDate is null, return false.
      if (!calendarDate) {
        return false 
      }  

      return birthDates.includes(calendarDate.toISOString().substring(0, 10));
    };

【讨论】：

是的，我已经使用 console.logs 来验证 calendarDate 是否作为 null 传入。这可能是什么原因？

【解决方案2】：

return (calendarDate == null ? true :birthDates.includes(calendarDate.toISOString().split('T'))) 这解决了问题

【讨论】：

正如目前所写，您的答案尚不清楚。请edit 添加其他详细信息，以帮助其他人了解这如何解决所提出的问题。你可以找到更多关于如何写好答案的信息in the help center。