Ошибка присвоения типа в обратном вызове типизированного редуктора

Question

Приведенный ниже код дает мне следующую ошибку типа

Нет перегрузки, соответствующей этому вызову. Перегрузка 1 из 3, '(callbackfn: (previousValue: TestData, currentValue: TestData, currentIndex: number, array: TestData []) => TestData, initialValue: TestData): TestData », выдает следующую ошибку. Тип boolean не может быть присвоен типу TestData. Перегрузка 2 из 3, '(callbackfn: (previousValue: BooleanObject, currentValue: TestData, currentIndex: number, array: TestData []) => BooleanObject, initialValue: BooleanObject): BooleanObject », выдает следующую ошибку. Тип 'boolean' не может быть назначен типу 'BooleanObject'.

может ли кто-нибудь помочь объяснить, почему тип не может быть назначен?

На мой взгляд, в интерфейсе TestState я определил свойство booleanObject, чтобы иметь тип BooleanObject, а BooleanObject - это интерфейс, который определяет свойство индекса строки, так что при индексировании строкой тип возвращаемого значения должен быть логическим.

Затем, преобразовывая начальное значение в редукторе к типу BooleanObject,

a) редуктор возвращает правильный тип, ожидаемый для свойства booleanObject в определении состояния и

б) затем, когда я индексирую аккумулятор (типа BooleanObject), я считаю, что должен ожидать, что значение аккумулятора ["index"] будет иметь тип boolean

Где я не могу понять, почему я получаю тип не назначаемой ошибки?

Заранее спасибо!

import React from 'react';

interface TestProps {
    data: TestData[];
}

interface TestState {
    booleanObject: BooleanObject;
}

interface BooleanObject {
    [index: string]: boolean;
}

interface TestData {
    name: string;
    subData: SubData[];
}

interface SubData {
    name: string;
    value: string;
}

class Test extends React.Component<TestProps, TestState>{
    constructor(props: TestProps){
        super(props);
        this.state = {
            booleanObject: this.props.data.reduce((accumulator, currentValue) => accumulator[currentValue.name] = false, {} as BooleanObject)
        }
    }
}

Answer 1

Ваши типы выглядят нормально.

В основном, в вашем reduce, когда вы возвращаете accumulator[currentValue.name] = false;, что означает, что вы возвращаете false (т.е. логическое значение) и, следовательно, проблема.

Просто вернитесь правильно в обратном вызове reduce, и ваши типы будут исправлены.

Вот так

import React from "react";

interface TestProps {
  data: TestData[];
}

interface TestState {
  booleanObject: BooleanObject;
}

interface BooleanObject {
  [index: string]: boolean;
  //   index: boolean;
}

interface TestData {
  name: string;
  subData: SubData[];
}

interface SubData {
  name: string;
  value: string;
}

class Test extends React.Component<TestProps, TestState> {
  constructor(props: TestProps) {
    super(props);
    this.state = {
      booleanObject: this.props.data.reduce((accumulator, currentValue) => {
        accumulator[currentValue.name] = false;
        return accumulator;
      }, {} as BooleanObject),
    };
  }
}

Answer 2

Тип функции reduce выглядит примерно так

Array<T>.reduce(callbackfn: (previousValue: T, currentValue: T, ..) => T): T

, что означает, что результат относится к типу элементов массива.

Итак, поскольку this.props.data имеет тип TestData[], метод reduce должен возвращать результат типа TestData, чего нет в вашем коде (который приводит и возвращает BooleanObject).