Promise 的基本使用

回调地狱 Callback Hell

function loadImg(src) {
    var promise = new Promise(function (resolve, reject) {
        var img = document.createElement('img');
        img.onload = function () {
            resolve(img);
        };
        img.onerror = function () {
            reject('图片加载失败');
        };
        img.src = src;
    });
    return promise;
}

loadImg(src, function(img){
	console.log(img.width);
},function(){
	console.log('failed');
})

Promise 语法

new Promise 实例，而且要 return
new Promise 时要传入函数，函数有 resolve reject 两个参数 
成功时执行 resolve() 失败时执行 reject()
then 监听结果

function loadImg(src) {
      return new Promise(function (resolve, reject) {
        var img = document.createElement('img')
        img.onload = function () {
            resolve(img)
        }
        img.onerror = function () {
            reject('图片加载失败')
        }
        img.src = src
    })
}

var src = 'https://www.imooc.com/static/img/index/logo_new.png'
var result = loadImg(src)
result.then(() => {
	console.log(img.width);
}, () => {
   console.log('failed');
})
result.then(() => {
	console.log(img.height);
})