callback promisify实现

loadImage.js 文件

const imageSrc = 'https://www.themealdb.com/images/ingredients/Lime.png';

function loadImage(callback, src ) {
    const image = document.createElement('img');
    image.src = src;
    image.alt = '公众号若川视野专用图？';
    image.style = 'width: 200px;height: 200px';
    image.onload = () => callback(null, image);
    image.onerror = () => callback(new Error('加载失败'));
    document.body.append(image);
}

基础封装加载图片方法

loadImage(imageSrc, function (err, image) {
    if (err) {
        console.log(err);
        return;
    }
    console.log(image);
});

增加promise

 const loadImagePromise = function(src){
    return new Promise(function(resolve, reject){
        loadImage(src, function (err, image) {
            if(err){
                reject(err);
                return;
            }
            resolve(image);
        });
    });
};
loadImagePromise(imageSrc).then(res => {
    console.log(res);
})
.catch(err => {
    console.log(err);
});

promistify写法

function promisify(original){
    function fn(...args){
        return new Promise((resolve, reject) => {
            args.unshift((err, ...values) => {
                if(err){
                    return reject(err);
                }
                resolve(values);
            });
            original.apply(this, args);
            // Reflect.apply(original, this, args);
        });
    }
    return fn;
}

const loadImagePromise = promisify(loadImage);
async function load(){
    try{
        const res = await loadImagePromise(imageSrc);
        console.log(res);
    }
    catch(err){
        console.log(err);
    }
}
load();