Машинописный текст вместе с вложенной деструктуризацией

ES6 великолепен, он уменьшил количество кодов, но машинописный текст для всего не работает.

Если бы я хотел реализовать проверку типов для своих аргументов, которые уже были разрушены более чем на одном уровне, не было бы беспорядка? Я думаю, что достаточно использовать интерфейс, чтобы сделать одну проверку в начале, как вы думаете? Или вы можете проверить все типы, но не злоупотребляйте es6 для лучшей читаемости.

<div>
      {response.results.map(({id, name, stock: {day: dayStock, month: monthStock}}) => {
        return(
          <div>
            <p>Item: {name}</p>
            <p>Day Stock: {dayStock}</p>
            <p>Month Stock: {monthStock}</p>
            <br />
          </div>
        )
      })}
    </div>

машинописная площадка: https://codesandbox.io/s/v06ml2y130

Что вы имеете в виду под хочу реализовать проверку типов для моих аргументов? Тип уже проверен - dayStock относится к типу number

— 18.06.2018 10:09

javascript typescript ecmascript-6 react-tsx

18.06.2018 10:02

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

4 989

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

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

Если вы наберете свой results, то вы сможете аннотировать деструктурированный объект.

type Item = {
    id: number;
    name: string;
    stock: {
        month: number;
        week: number;
        day: number;
    };
}

const response = {
    results: [{
        id: 1,
        name: 'TV',
        stock: {
            month: 10,
            week: 5,
            day: 4
        }
    }]
};

response.results.map(
    ({ id, name, stock: { day: dayStock } }: Item) => dayStock
);

чем отличается, если я использовал интерфейс? отличный ответ для этого.

— 18.06.2018 15:10

Интерфейс может быть расширен или иметь несколько объединенных объявлений: github.com/Microsoft/TypeScript/blob/master/doc/spec.md#3.10

— 18.06.2018 16:14

18.06.2018 11:47