Alexandroppolus

Потому что во время вызова конструктора ClassA, где у тебя вызывается init из ClassC, объект ещё "не доделан", где-то внутри, до полноценного экземпляра ClassC, в частности, ему ещё не добавлены приватные методы ClassC.

Скопируй в консоль Хрома этот код:


и нажми ентер.

на брекпоинтах разверни в консоли экземпляр класса, который будет в последних выводах в консоль (это надо делать именно во время остановок на брекпоинтах, иначе будет одинаково).
можно увидеть, что в первом случае в [[PrivateMethods]] не хватает метода #methidC()

приватные методы, судя по всему, хранятся не в прототипе, а в какой-то скрытой области, которую можно увидеть только вот так, в момент дебага.

надо поисследовать, почитать спецификацию. Сам их не использую, у нас на работе TS )

для const по сюжету задана "блочная область видимости". Т.е. на каждой итерации создается новая константа, по завершении итерации уничтожается

Этот твой getDetails возвращает промис, который резолвится массивом промисов. Оный массив не thenable, потому "окончательно резолвится" сразу. Соответственно, Promise.all, получая на вход массив завершенных промисов, тоже не будет чего-то ждать и вернет завершенный промис, значением которого будет массив массивов промисов (находящихся в состоянии загрузки). И только внутри renderDetailsPage2 начинается "поштучная" работа с промисами загрузки и её реальное ожидание.

Переделать надо примерно так:

export function getDetails(apiUrl) {
  return Promise.all(apiUrl.map(url => fetch(url).then(res => res.json())));
}

export function renderDetailsPage2(dataDetails, filmList) {
  return dataDetails.forEach(detail => {
      const filmItem = document.createElement('li');
      filmItem.classList.add('list-group-item', 'd-flex', 'flex-column');
      filmItem.textContent = detail.name;

      filmList.append(filmItem);
  })
}

Теперь getDetails возвращает промис, который резолвится не массивом промисов, а массивом результатов загрузки (т.е. не сразу, а когда все будут загружены).
Promise.all в функции render ждет резолва всех троих, и теперь уже значением его промиса будет массив массивов результатов. Посему в renderDetailsPage2 уже не надо ждать никакого резолва, там в dataDetails - готовый массив значений.

Если что, не дебажил, могут быть мелкие ошибки, но в целом идея вроде бы верная.

почему дальше у нас сначала идет лог из рефа ребенка, а только потом из рефа родителя - непонятно

назначение рефов происходит на том же этапе, что и выполнение колбэка в useLayoutEffect: синхронно сразу после того, как сформируется дерево виртуального дома, и по нему будет обновлено дерево реального дома. Все перечисленное делается в одном синхронном куске кода, без микротасков и т.д. Разумеется, до этапа отрисовки на экране.
Почему снизу вверх, то есть от чилдов к парентам? Значения рефов могут использоваться в колбэках useLayoutEffect, значит они к этому моменту должны быть готовы. Т.е. чилд должен успеть назначить реф до того, как парент попробует к нему обратиться. Распространение данных в обратную сторону, в комплект к распространению в прямую (через пропсы). Это одна из причин, могут быть и другие.

Эффекты useEffect срабатывают после отрисовки на экране, т.е. в отдельном таске. Для единообразия они тоже срабатывают в порядке от чилдов к парентам.

Указанный порядок имеет свои минусы, например https://habr.com/ru/articles/574536/ , но в целом плюсы перевешивают.

Надо заметить, что и функции очистки для useEffect и useLayoutEffect тоже вызываются сначала на чилдах, что правильно со всех сторон.

твоя задача - хороший пример, где не надо в рекурсию. Можно легко переписать на цикл:

const removeParenthesesNR=(s)=>{
    let len = -1;
    while(len !== s.length) {
        len = s.length;
        s = s.replace(/\([^()]*\)/g, "");
    }
    return s;
}

но даже в этом варианте очень медленно работает на строках с большой глубиной вложенности скобок.

вот, более быстрый способ:

function removeParentheses(str) {
    const arr = [];
    let idx = 0, depth;
    while (idx < str.length) {
        const newIdx = str.indexOf('(', idx);
        if (newIdx < 0) {
            break;
        }
        arr.push(str.substring(idx, newIdx));
        
        for (depth = 1, idx = newIdx + 1; idx < str.length && depth; ++idx) {
            const c = str[idx];
            depth = depth + (c === ')' ? -1 : c === '(' ? 1 : 0);
        }
    }
    return arr.join('') + str.substr(idx);
}

если сравнивать на строках вида "(((((...)))))", то для глубины 100000 разница в скорости просто гигантская

на скриншоте видно, что entryChildrenChildren[i][j] могут быть как элементами, так и текстовыми нодами. У последних нет hasAttribute.

перед вызовом hasAttribute проверяй наличие этой функции у объекта entryChildrenChildren[i][j]

Переделать рекурсию в цикл (+стек)