js局部函数修改全局变量无法获取的问题

Question

       var bb;
        $.ajax({

            type: 'get',
            url: '/store/attachment/getAllGroup',
            success:function(result) {

                console.log(result)
                for(var i=0;i<result.length;i++){
                    console.log(result[i].id)
                    $(".group_all_list").append('<li a='+result[i].id+' class="style_left" onclick="show_group_img('+result[i].id+');"><span>'+result[i].name+'</span><span>'+result[i].count+'</span></li>')

                    console.log($(".style_left").attr('a'))
                }
                $('.style_left').each(function(){

                    $(this).click(function(){
//                        console.log("555"+$(this));
                        console.log($(this).attr('a'))
                        bb = $(this).attr('a')
                        $('.style_left').css('background-color',"#f2f2f2")
                        $(this).css("background-color","#ffffff")
                        return bb;
                    })

                })
                show_group_img(0)
            }
        });
        console.log(bb)  //undefind
        此时的bb无法获取，是undefind

Answer 1

这个可能是因为执行最后一句"console.log(bb)"的时候，你调用的ajax中的success方法还未执行，也就是全局变量bb未被赋值。
你可以看一下是最后一句"console.log(bb)"先执行，还是success方法中的"console.log(result)"先执行。

Answer 2

异步回调在js主线程执行结束后才会被执行。所以先执行console.log(bb),再执行ajax中的回调函数。
具体的去查Event loop

Answer 3

这个是异步的问题、你可以在ajax回调里面console.log("ajax")

看看是ajax先被打印还是你的undefined先被打印

原则来讲你的bb应该在回调中看结果的、

也可以用promise控制异步

Answer 4

$.ajax默认是异步的，所以后面的console.log执行时，bb还没有被赋值，所以是undefind。如果你确实需要获取ajax的结果赋值给bb，那么可以ajax多加一个参数:async=false，就会同步执行。但是你里面bb=$(this).attr('a')是放在click回调函数里面，所以至少也要等到你点击那个元素的时候才会有值啊！！！