js ajax 请求问题。

Question

在项目中，通过 ajax 请求后台数据，并做数据处理。最后将处理好的数据返回。代码形式如下:

function funOne(){
    var htmlStr = '';
    $.get(href,{},function(r){
        var data = eval('(' + r + ')');
        $.each(data,function(k,v){
            /*    在该区域做相应的数据处理 */
            htmlStr += '<div>' + v + '</div>';
        })
    })
    return htmlStr;
}

以上是代码的逻辑。问题出现在，ajax 请求内部的运算还没结束，已经返回了结果，所以函数调用的结果是空的。
该问题如何解决？尝试过用 while ，但是直接太多蹦掉了。

Answer 1

function funOne() {
    var htmlStr = '';
    return $.get(href, {}).then(function (r) {
        var data = eval('(' + r + ')');
        $.each(data, function (k, v) {
            /*    在该区域做相应的数据处理 */
            htmlStr += '<div>' + v + '</div>';
        })
        return htmlStr;
    })
}

funOne().then(function(htmlStr){
    console.log(htmlStr)
})

Answer 2

写一写

var getData = new Promise(function (resolve, reject) {
    $.get(href, {}).then(function (res) {
        if (res) {
            var data = JSON.parse(res);
            // 在这里处理  htmlStr ...
            resolve(htmlStr);
        } else {
            reject(err);
        }
    })
})

getData.then((htmlStr ) => {
    console.log(htmlStr )
}).catch((err) => {
    console.log(err)
})

Answer 3

$.get(href,{},function(r){

var data = eval('(' + r + ')');
$.each(data,function(k,v){
    /*    在该区域做相应的数据处理 */
    htmlStr += '<div>' + v + '</div>';
})
 return htmlStr;

})