abberati

Electron

Поставьте дефолтный конфиг линтера для ts и запретите использование any.
А потом пишите приложение.
Линтер отлично научит.

Ну и документация по ts всегда под рукой должна быть.

И что-нибудь из этого попробуйте для строгости коммуникации с внешним миром.

Никак. Асинхронность. Данные, которые вы пытаетесь отрендерить, ещё недоступны. Всё, что вы можете — это проверять, загрузились ли данные, и если ещё не загрузились — не пытаться к ним обратиться. Рендерить крутилку.

localStorage синхронный. Почему бы не использовать значение из него при инициализации стейта?

componentDidUpdate() {
    if (this.state.closed === true) {
      document.body.classList.add('block-closed')
    } else {
      document.body.classList.remove('block-closed')
    }
  }

Вот так не надо делать. Вот так надо делать.

В доке всё есть

Вот страница в доке специально для этого кейса.

const nodes = [...document.getElementsByClassName('yourself-item__title')]

const maxHeight = nodes.reduce((max, { clientHeight }) => max > clientHeight ? max : clientHeight, 0)

nodes.forEach(node => node.style.height = maxHeight + 'px')

Конкретно в этом примере нет разницы, где объявлять. Если бы у эффекта были зависимости (а они тут должны быть, просто пример не про это написан), то эффект выполнялся бы реже, чем на каждый рендер. Тогда функция снаружи объявлялась бы впустую.

А вызывает её не эффект, а ChatAPI — представьте себе, что это некий document.addEventListener м обработчиком событий handleStatusChange. Эффект организует подписку и отписку.

Это происходит из-за того, что this указывает на контекст вызова, а не контекст объявления. То есть в разных ситуациях this — это разные сущности. Почитать вот это.

State

Controlled inputs

Потому что setState асинхронный

То, что вы называете замыканием — это паттерн «модуль» из бородатых старых лет, реализованный через замыкание. Ваш код написан в ES2015 модуле, использование которого отметает необходимость в древних «модулях». Почитайте, как работают модули. Чтобы решить вашу задачу нужно много наводящих вопросов и текста — мне лень)

Для переиспользования кода используются функции.

function doMagic(path) {
$.getJSON(path, function (data) {
    $(data).each(function(index, item) {
    $('#table').append(
        '<tr><td class="col1">'+ item.title01 +'</td><td class="col2">' + item.shopcode + '</td><td> <a href="' + item.link + '">' + item.title + '</a></td><td class="col3">' + item.cost + '</td></tr>'
        );
    });
});
}

doMagic('/js/db04.json')
doMagic('/js/db05.json')

// или
['/js/db04.json', '/js/db05.json', '/js/db06.json'].forEach(doMagic)