手書きPromiseの画像を読み込みます.

Promise発生の原因
よくある地獄の場面:

//       callback hell
//        
$.get(url1, (data1) => {
    console.log(data1)
    //       
    $.get(url2, (data2) => {
        console.log(data2)
        //       
        $.get(url3, (data3) => {
            console.log(data3)
            //...
        })
    })
})

上記のように、多非同期は以下のような問題が起こりやすい.
非同期で戻る実行順序は制御できません.非同期の異常エラー処理が非常に煩雑です.多くの非同期がはまっていると、地獄に戻ることになります.
私たちは急遽、非同期の実行順序を保証し、間違った非同期の処理を実行し、投げ出すことができる保証モデルを必要とします.これらの問題を解決します.ES 6がくれた答えはPromiseです.
promiseで同じ多非同期問題を処理する:

function getData(url) {
            return new Promise((resolve, reject) => {
        $.ajax({
            url,
            success(data) {
                resolve(data)
            },
            error(err) {
                reject(data)
            }
        })
    })
}
var url1 = '/datà1.json'
var url2 = '/datà2.json'
var url3 = '/datà3.json'
getData(url1).then(data1 => {
    console.log(data1)
    return getData(url2)
}).then(data2 => {
    console.log(data1)
    return getData(url3)
}).then(data3 => {
    console.log(data3)
}).catch(err => {
    console.log(err)
})

promiseはcalback形式を入れ子ではない形にして、直列の形にしました.
Promiseを使って画像を読み込みます.

function loadImg(src2) {
    return new Promise(
        //   resolve reject     
        (resolve,reject)=>{
            const img1 = document.createElement('image')
            img1.src = src2
            img1.onload=()=>{
                resolve(img1)
            }
            img1.onerror=()=>{
                const err = new Error(`      ！${src}`)
                reject(err)
            }
            
        }
    )
}
const url1 = 'https://img4.sycdn.imooc.com/szimg/5dbffa9109ef425a12000676-360-202.png'
const url2 = 'https://img4.sycdn.imooc.com/szimg/5dbffa9109ef425a12000676-360-202.png'
loadImg(url1).then(img=>{
    console.log(img.width)
    return img
}).then(img=>{
    console.log(img.height)
    return loadImg(url2)
}).then(img2=>{
    console.log(img2.width)
    return img2
}).then(img2=>{
    console.log(img2.height)
})
.catch(err=>{
    console.log(err)
})