承诺设置一个变量，否则返回

Question

我对 promises 很陌生，我会 1) 想让它做它需要做的事情，以及 2) 获得关于“更正确”的编写方式或任何可以增加的效率的反馈。

目标： 检查 ID 是否存在。如果它存在，将节点分配给一个变量，然后让 MutationObserver 观察它的变化。如果 ID 不存在，请不要尝试实例化观察者。

问题： 如果该 ID 存在于页面上，加载它总是需要一点时间。而且我确定我没有正确处理“如果它不存在”部分。目前，即使 ID 最终存在于页面上，该变量也会返回 false。

代码：

document.addEventListener( 'DOMContentLoaded', () => {
    let control = false;


    function getControls() {
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                    resolve([
                        document.getElementById('controls')
                    ]);
            }, 2000);
        });
    }

    getControls().then((node) => {
        control = node;
    });

console.log(layout_control); // currently false; Maybe there's a better way than setting an arbitrary timeout.

    if (!control) {
        return;
    } // Maybe this should be to do with 'reject.'

    new MutationObserver( function() {
            // Do some things when the controls change.

    } ).observe( control, {
            subtree: true,
            childList: true
        }
    );

} );