通过ajax获取json的类初始化总是失败

时间:2012-11-13 06:56:39

标签: javascript jquery

我是JavaScript的新手。我想创建一个在初始化时使用Ajax与Flickr Web API进行通信的类。

Photo2.js

  var Photo2;

  Photo2 = (function() {

    Photo2.prototype.json = null;

    function Photo2() {
      $.getJSON('http://www.flickr.com/services/rest/?jsoncallback=?', {
        format: 'json',
        method: 'flickr.photos.search',
        api_key: '7965a8bc5a2a88908e8321f3f56c80ea',
        user_id: '29242822@N00',
        per_page: '100'
      }, function(data) {
        this.json = data.photos.photo;
      });
    }

    return Photo2;

  })();

但是,当初始化为photo2 = new Photo2时,它没有photo2.json

谢谢你的好意。

1 个答案:

答案 0 :(得分:2)

你应该真的重写你的代码。这很复杂,很难弄清楚你想要达到的目标。

首先,从服务器获取数据是异步的,因此您无法确定在创建Photo2 json属性的实例后是否会定义。

接下来的事情是,在初始化对象时进行服务器调用真是个坏主意。我建议你遵循解决方案:

(function() {
  var Photo2 = function(callback) {
    this.json = null;
  };

  Photo2.prototype.getData =  function(successCallback) {
    var self = this;

    $.getJSON('http://www.flickr.com/services/rest/?jsoncallback=?', {
        format: 'json',
        method: 'flickr.photos.search',
        api_key: '7965a8bc5a2a88908e8321f3f56c80ea',
        user_id: '29242822@N00',
        per_page: '100'
      }, function(data) {
        self.json = data.photos.photo;
        typeof successCallback == 'function' && successCallback();
      }); 
  };

  var photo = new Photo2();
  photo.getData(function successCallback() {
    console.log('Data loaded', photo.json);
  });
}).call(this);

此处的演示演示:http://jsbin.com/ureyas/1/edit