なぜImgPreloadがブロックされたのかについて

<script>
    function preloadImages(sources, callback) {
        /* your code */
        let promise_arr = sources.map((value) => {
            return new Promise(function (resolve, reject) {
                let img_cahce = document.createElement('img');
                img_cahce.src = value;
                img_cahce.onload = function () {
                    console.log('load_finish');
                    resolve(1);
                }
                img_cahce.onerror = function () {
                    resolve(1);
                }
            }).then(value=>console.log(value));
        })//
        console.log(promise_arr);
        Promise.allSettled(promise_arr).then(()=>callback());
    }

    // ---------- The test ----------

    let sources = [
        "https://en.js.cx/images-load/1.jpg",
        "https://en.js.cx/images-load/2.jpg",
        "https://en.js.cx/images-load/3.jpg"
    ];

    // add random characters to prevent browser caching
    for (let i = 0; i < sources.length; i++) {
        sources[i] += '?' + Math.random();
    }

    // for each image,
    // let's create another img with the same src and check that we have its width immediately
    function testLoaded() {
        console.log('콜백 실행됨');
        let widthSum = 0;
        for (let i = 0; i < sources.length; i++) {
            let img = document.createElement('img');
            img.src = sources[i];
            widthSum += img.width;
        }
        alert(widthSum);
    }

    // every image is 100x100, the total width should be 300
    preloadImages(sources, testLoaded);
</script>

これは、Imgをプリロードしてキャッシュに保存した後にCallbackを起動する基本例です.
--Hardship--

promise.そして(result=>alert(result)、error=>alert(error))構造.

promise.次に()は、次のルールを返します.(no returnの場合、完了/未定義の戻り値)

[Return value]

Once a Promise is fulfilled or rejected, the respective handler function ( onFulfilled or onRejected ) will be called asynchronously (scheduled in the current thread loop). The behavior of the handler function follows a specific set of rules. If a handler function:

returns a value, the promise returned by then gets resolved with the returned value as its value.

doesn't return anything, the promise returned by then gets resolved with an undefined value.

throws an error, the promise returned by then gets rejected with the thrown error as its value.

returns an already fulfilled promise, the promise returned by then gets fulfilled with that promise's value as its value.

returns an already rejected promise, the promise returned by then gets rejected with that promise's value as its value.

returns another pending promise object, the resolution/rejection of the promise returned by then will be subsequent to the resolution/rejection of the promise returned by the handler. Also, the resolved value of the promise returned by then will be the same as the resolved value of the promise returned by the handler.

Promise.allSettingsは値value(arr)=>valueを返します.status/value.値からなる

Promise値は返されず、ゾーンスキャンでのみ作成され(promise構文も実行)、Promise配列には戻されないため、コード実行は続行され、Promise配列は「未定義、未定義、未定義」です.allSettings(arguments)に渡されます.

However, if and only if an empty iterable is passed as an argument, Promise.allSettled() returns a Promise object that has already been resolved as an empty array.
上記PromiseallSettings()の設定に従って、「プロセスチェーン」の「実行後」は「Callback」に直接ジャンプし、最終的に「ステータス」を決定し、定義されていない空の配列を結果値として返します.
＜確認図＞