dispatchEvent 两个特别的地方

来看一段正常的事件点击时抛错了会怎么样：

<div>
    <p>paragraph</p>
</div>
<script>
    const elem = document.querySelector('div')
    elem.addEventListener('click', function(e) {
        throw Error('test')
        console.log('1')
    })
    console.log('2')
</script>

依据事件循环原理，应该先打印2, 当点击div时，直接抛错，1不会打印。

再来看使用dispatchEvent的情况：

<div>
    <p>paragraph</p>
</div>
<script>
    const elem = document.querySelector('div')
    const event = new Event('build');
    elem.addEventListener('build', function (e) {
        console.log('0')
        throw Error('test')
        console.log('1')
    }, false);
    elem.dispatchEvent(event);
    console.log('2')
</script>

结果会打印 0，2， （1不会被打印）

这里有两个不一样的地方：

1. 同步
   dispatchEvent后，回调会被立即执行，因此打印了0
2. 错误异常不会被传播
   遇到抛错，1不会打印，但错误不会传播，所以打印了2

不过，不晓得为什么这么设计，有大佬可以帮忙解释下

参考资料

1. https://developer.mozilla.org...

一定要看英文版的关于dispatchEvent的说明，中文版中未对Exceptions进行很好的解释