如果不知道什么是Promise，可以先阅读：

• 使用 Promise - JavaScript | MDN
• Promise - JavaScript | MDN

异步加载文件

/**
 * 异步加载一个js文件并插入到页面头部
 *
 * @param  {String} src js文件地址
 *
 * @return {Promise}  成功或失败时回调函数参数为新创建的script元素
 */
function loadScriptAsyn(src) {
    return new Promise(function(resolve, reject) {
        var script = document.createElement('script');
        script.onload = function() {
            resolve(script);
        };
        script.onerror = function() {
            reject(script);
        };
        document.head.appendChild(script);
        script.src = src;
    });
}

/**
 * 异步加载一个css文件并插入到页面头部
 *
 * @param  {String} href css文件地址
 *
 * @return {Promise}  成功或失败时回调函数参数为新创建的link元素
 */
function loadCssAsyn(href) {
    return new Promise(function(resolve, reject) {
        var link = document.createElement('link');
        link.type = "text/css";
        link.rel = "stylesheet";
        link.onload = function() {
            resolve(link);
        };
        link.onerror = function() {
            reject(link);
        };
        document.head.appendChild(link);
        link.href = href;
    });
}

/**
 * 异步加载一张图片（一般用于预加载图片）
 *
 * @param  {String} src 图片地址
 *
 * @return {Promise}  成功或失败时回调函数参数为新创建的img元素
 */
function loadImgAsyn(src) {
    return new Promise(function(resolve, reject) {
        var img = document.createElement('img');
        img.onload = function() {
            resolve(img);
        };
        img.onerror = function() {
            reject(img);
        };
        img.src = src;
    });
}

使用例子：异步加载多个文件

异步加载多个文件，有先后顺序

loadScriptAsyn('test1.js')
.then((element) => loadScriptAsyn('test2.js'))
.then((element) => loadScriptAsyn('test3.js'))
.then((element) => loadCssAsyn('body_red.css'))
.then((element) => loadImgAsyn('head.jpg'))
.then(function(element) {  // 全部文件都加载成功
    console.log('全部文件都按顺序加载完毕!');
})
.catch(function(element){  // 任一个文件加载出问题都会调用此函数，并会停止之后文件的加载
    console.log(element + '加载出错');
});

注意：

(element) => loadScriptAsyn('test2.js')

这是js的箭头函数，相当于：

function(element) {
    return loadScriptAsyn('test2.js');
}

异步加载多个文件，无先后顺序

Promise.all([
    loadScriptAsyn('test1.js'),
    loadScriptAsyn('test2.js'),
    loadScriptAsyn('test3.js'),
    loadCssAsyn('body_red.css'),
    loadImgAsyn('head.jpg'),
])
.then(function(element) {  // 全部文件都加载成功
    console.log('全部文件都加载完毕!');
})
.catch(function(element){  // 任一个文件加载出问题都会调用此函数，不会影响其他文件的加载
    console.log(element + '加载出错');
});