Почему мой метод reduce() работает, если я определяю массив в TypeScript, но не при использовании файла модели?

Я определил этот объект в файле TypeScript и использовал следующий метод reduce(), и с ним нет проблем.

  sampleList = {
    totalRecordsTest: {},
    sampleList: [
      {
        parent: 'Sample Text 2',
        children: [
          {
            id: 1,
            text: "Sample Text 1"
          },
        ],
      },
      {
        parent: 'Sample Text 2',
        children: [
          {
            id: 2,
            text: "Sample Text 2"
          },
        ],
      },
      {
        parent: 'Sample Text 3',
        children: [
          {
            id: 3,
            text: "Sample Text 3"
          },
        ],
      },
    ]
  }

    let grouped = this.sampleList.sampleList.reduce((groups, current) => {
      groups[current.parent] = groups[current.parent] || [];
      groups[current.parent].push(...current.children);
      return groups;
    }, Object.create(null));

    this.groupedSampleList = Object.keys(grouped).map((key) => ({
      parent: key,
      children: grouped[key],
    }));

Однако, когда я попытался создать файл интерфейса модели для «sampleList» в другом файле, я получаю сообщение об ошибке «Неопределенный тип» не может использоваться в качестве типа индекса в следующем методе для переменной Текущий.

Файл TypeScript

let grouped2 = this.sampleList.reduce((groups, current) => {
  groups[current.parent] = groups[current.parent] || [];
  groups[current.parent].push(...current.children);
  return groups;
}, Object.create(null));

Импорт модели в TypeScript

sampleList: SampleList[] = []

Файл модели

export interface SampleListModel {
    parent?: string | '-',
    children?: ChildrenSampleModel[];
}

export class SampleList implements SampleListModel {
    constructor(
        public parent?: string | '-',
        public children?: ChildrenSampleModel[]
    ) { }
}

export interface ChildrenSampleModel {
    id?: number,
    text?: string
}

export class ChildrenSample implements ChildrenSampleModel {
    constructor(
        public id?: number,
        public text?: string
    ) { }
}

Решение

parent объявлен как необязательный, поэтому он может быть неопределенным, и когда я использую его в качестве индекса, он выдает ошибку «Тип« не определен »не может использоваться в качестве типа индекса в следующем методе для текущей переменной».

export interface SampleListModel {
    parent: string,
    children: ChildrenSampleModel[];
}

export class SampleList implements SampleListModel {
    constructor(
        public parent: string,
        public children: ChildrenSampleModel[]
    ) { }
}
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
0
42
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Это может быть потому, что parent является необязательным в конструкторе SampleList, поэтому он может быть неопределенным, и вы не можете использовать его в качестве индекса.

Да, я тоже только что это понял, но есть ли способ определить parent как необязательный в конструкторе, но использовать его как индекс?

Nic 17.03.2022 10:26

Вероятно, предоставление значения по умолчанию, такого как groups[current.parent ?? 'default'], решит ошибку компиляции. Но я думаю, вы должны сначала спросить, что делать, если parent имеет значение null, а затем реализовать решение для этого случая. Может быть, протестировать его, прежде чем вы сделаете все это внутри сокращения, например if (current.parent) ... (хотя я не знаю, решит ли это ошибку компилятора).

vanderdill 17.03.2022 10:39

Другие вопросы по теме