Почему не работает деструктуризация объекта в цикле for-of?

Question

В основном следующий код не работает, и я не понимаю, почему.во вложенном цикле у меня есть переменная с именем «children», которая представляет собой массив, содержащий объекты с полями под названием children (как, например, в дереве DOM).Но похоже, что это конфликт имен, когда я пытаюсь описать каждый элемент массива.Поскольку я использую let, они должны иметь различную область видимости (по крайней мере, переменная destructured должна скрывать «родительскую» переменную).Вероятно, я ошибаюсь, но я хотел бы понять, почему.

let o = {
    children: [
     {children: [{}, {}, {}]},
     {children: [{}, {}, {}]}
    ]
};
for (let {children} of o.children) {
    console.log(children)
    for (let {children} of children) {
        console.log(children)
    }
}

Answer 1

Принимая это утверждение,

for (let {children} of children)

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

Это не работает, потому что нет различия между обеими переменными.

Это сработает, если вы переименуете переменную target или source.

let o = {
        children: [
            { children: [{ children: [{}, {}, {}] }, { children: [{}, {}, {}] }] },
            { children: [{ children: [{}, {}, {}] }, { children: [{}, {}, {}] }] },
        ]
    };

for (let { children } of o.children) {
    console.log(children)
    for (let { children: c } of children) { // rename here
        console.log(c)
    }
}

Answer 2

Вы пытаетесь получить недвижимость children не от того места. Удалите второй for цикл или переименуйте вашу переменную:

let o = {
    children: [
     {children: [{}, {}, {}]},
     {children: [{}, {}, {}]}
    ]
};
for (let { children } of o.children) {
  console.log(children);
}

Или:

let o = {
    children: [
     {children: [{children: "child"}, {children: "child"}, {children: "child"}]},
     {children: [{children: "child"}, {children: "child"}, {children: "child"}]}
    ]
};
for (let { children } of o.children) {
  console.log(children);
  for (let { children: childrenB } of children) {
    console.log(childrenB);
  }
}

.as-console-wrapper { max-height: 100% !important; top: auto; }

Answer 3

Проблема во вложенном for..of.Смотрите строку

for (let {children} of children){...}

Здесь вы пытаетесь получить children свойство children, которое не имеет смысла.Из-за let {children} создается локальная переменная children, которая в данный момент не инициализирована.Теперь второй children не ссылается на родительский массив.Но это относится к неинициализированной переменной в локальной области видимости.

Код в этом случае выдаст ошибку ссылки.

"Uncaught ReferenceError: Невозможно получить доступ к потомкам до инициализации"

Рассмотреть объектс именем children и его именем свойства также является children. Вы делаете то же, что и ниже.

let children = {children:'something'}
{
  let {children} = children;
}