V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
whatisnew
V2EX  ›  JavaScript

js 变量作用域

  •  
  •   whatisnew · 2015-05-22 14:28:26 +08:00 · 2544 次点击
    这是一个创建于 3474 天前的主题,其中的信息可能已经有所发展或是发生改变。

    怎么让 ajax 请求返回:

    var class = {
      method: function(q) {
        var data = null;
        $.get('api/get', q, function(data) {
          // 这里的 return 貌似只返回到了 method
          return data;
        });
        // 这里的 return 没有得到赋值。。。
        return data;
      },
    };
    
    // return null...
    console.log(class.method({q:'q'}));
    
    8 条回复    2015-05-22 18:00:20 +08:00
    lion9527
        1
    lion9527  
       2015-05-22 14:31:12 +08:00
    “var data = null;” 去掉“var”试试?
    chairuosen
        2
    chairuosen  
       2015-05-22 14:34:28 +08:00   ❤️ 1
    -method:function(q){
    +method:function(q,callback){

    -$.get('api/get', q, function(data) {});
    +$.get('api/get', q, callback);

    class.method({q:'q'},function(data){
    console.log(data)
    })
    zhujinliang
        3
    zhujinliang  
       2015-05-22 14:38:41 +08:00
    这个跟作用域没关系
    method中调用$.get,将一个匿名函数传递给$.get,此时该函数并未被执行,而是继续走到了return data 此时函数class.method返回null。
    当ajax获取数据后,之前传递给$.get的函数才会被调用,但此时已与之前的class.method函数调用没有关系了。
    如果想得到ajax返回的数据,只能依次使用回调。

    比如这样:
    var class = {
    method: function(q, fn) {
    //var data = null;
    $.get('api/get', q, function(data) {
    fn(data);
    });
    //return data;
    },
    };

    class.method({q:'q'}, function(data){ console.log(data); });
    jarlyyn
        4
    jarlyyn  
       2015-05-22 14:41:45 +08:00
    这里牵涉到一个异步和一个作用域的问题。
    如果对异步不熟悉的话,可以考虑看下async库。
    另外,jquery中的ajax现在应该本身也有类似promise的实现。
    iamppz
        5
    iamppz  
       2015-05-22 14:44:09 +08:00
    jQuery可以考虑下deferred对象:
    function method(q) {
    var dfd = $.Deferred();
    $.get('api/get', q).done(function (data) {
    dfd.resolve(data);
    }).fail(function () {
    dfd.reject();
    });
    return dfd.promise();
    }

    method.done(function(data){ console.log(data); })
    sneezry
        6
    sneezry  
       2015-05-22 14:49:44 +08:00
    恭喜解锁成就,入了回调的坑。
    nilennoct
        7
    nilennoct  
       2015-05-22 16:53:13 +08:00
    $.get('api/get', q, function(data) {
    // 这里的 return 貌似只返回到了 method
    return data;
    });
    return data;

    你从代码执行的角度看,function (data) {...} 其实只是传进$.get()的一个参数而已,执行完$.get()后,自然就return data了,至于你传进去的function (data) {...} (又称回调函数)在什么时候执行,取决于你的接口什么时候返回数据。
    jyootai
        8
    jyootai  
       2015-05-22 18:00:20 +08:00
    恭喜入异步的坑,不过能意识到这点走到这一步,表示离光明不远了
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2947 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 29ms · UTC 12:45 · PVG 20:45 · LAX 04:45 · JFK 07:45
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.