2012-05-06 80 views
1

我想通過閱讀json來創建一個對象數組。這是相關代碼:閱讀json使用jQuery創建一個對象數組.each()

//president object consctructor 
function president(a_presName, a_presDates, a_presNick, a_presImage) { 
    this.presName=a_presName; 
    this.presDates=a_presDates; 
    this.presNick=a_presNick; 
    this.presImage=a_presImage; 
} 


var myPres = new Array(); 

$(document).ready(function() { 



    $.getJSON('Presidents.json', function(data) { 


     $.each(data.presidents, function (i, item) { 
      myPres[i]=new president(item.presName, item.presDates, item.presNick, item.PresImage); 
     }); 

    }); //end getJSON 
    document.write(myPres[1].presName); 
}); //end doc ready 

這是JSON:

{ "presidents": [ { "presName":"George Washington", "presDates":"1789-1797", "presNick":"Father of His Country", "presImage":"gwashington.gif" }, { "presName":"John Adams", "presDates":"1797-1801", "presNick":"Atlas of Independence", "presImage":"jadams.gif" }, { "presName":"Thomas Jefferson", "presDates":"1801-1809", "presNick":"Sage of Monticello", "presImage":"tjefferson.gif" }, { "presName":"James Madison", "presDates":"1809-1817", "presNick":"Father of the Constitution", "presImage":"jmadison.gif" }, { "presName":"James Monroe", "presDates":"1817-1825", "presNick":"Era-of-Good-Feeling President", "presImage":"jmonroe.gif" }, { "presName":"John Quincy Adams", "presDates":"1825-1829", "presNick":"Old Man Eloquent", "presImage":"jqadams.gif" }, { "presName":"Andrew Jackson", "presDates":"1829-1837", "presNick":"Old Hickory", "presImage":"ajackson.gif" }, { "presName":"Martin Van Buren", "presDates":"1837-1841", "presNick":"The Little Magician", "presImage":"mvanburen.gif" }, { "presName":"William Henry Harrison", "presDates":"1841", "presNick":"Old Tippecanoe", "presImage":"whharrison.gif" }, { "presName":"John Tyler", "presDates":"1841-1845", "presNick":"Accidental President", "presImage":"jtyler.gif" }, { "presName":"James Knox Polk", "presDates":"1845-1849", "presNick":"Young Hickory", "presImage":"jkpolk.gif" }, { "presName":"Zachary Taylor", "presDates":"1849-1850", "presNick":"Old Rough and Ready", "presImage":"ztaylor.gif" }, { "presName":"Millard Fillmore", "presDates":"1850-1853", "presNick":"The American Louis Philippe", "presImage":"mfillmore.gif" }, { "presName":"Franklin Pierce", "presDates":"1853-1857", "presNick":"Young Hickory of the Granite Hills", "presImage":"fpierce.gif" }, { "presName":"James Buchanan", "presDates":"1857-1861", "presNick":"Old Buck", "presImage":"jbuchanan.gif" }, { "presName":"Abraham Lincoln", "presDates":"1861-1865", "presNick":"Honest Abe", "presImage":"alincoln.gif" }, { "presName":"Andrew Johnson", "presDates":"1865-1869", "presNick":"None", "presImage":"ajohnson.gif" }, { "presName":"Ulysses Simpson Grant", "presDates":"1869-1877", "presNick":"Hero of Appomattox", "presImage":"usgrant.gif" }, { "presName":"Rutherford Birchard Hayes", "presDates":"1877-1881", "presNick":"Dark-Horse President", "presImage":"rbhayes.gif" }, { "presName":"James Abram Garfield", "presDates":"1881", "presNick":"None", "presImage":"jagarfield.gif" }, { "presName":"Chester Alan Arthur", "presDates":"1881-1885", "presNick":"The Gentleman Boss", "presImage":"caarthur.gif" }, { "presName":"Grover Cleveland", "presDates":"1885-1889", "presNick":"None", "presImage":"gcleveland.gif" }, { "presName":"Benjamin Harrison", "presDates":"1889-1893", "presNick":"Kid Gloves Harrison", "presImage":"bharrison.gif" }, { "presName":"Grover Cleveland", "presDates":"1893-1897", "presNick":"None", "presImage":"gcleveland.gif" }, { "presName":"William McKinley", "presDates":"1897-1901", "presNick":"Idol of Ohio", "presImage":"wmckinley.gif" }, { "presName":"Theodore Roosevelt", "presDates":"1901-1909", "presNick":"Trust-Buster", "presImage":"troosevelt.gif" }, { "presName":"William Howard Taft", "presDates":"1909-1913", "presNick":"None", "presImage":"whtaft.gif" }, { "presName":"Woodrow Wilson", "presDates":"1913-1921", "presNick":"Schoolmaster in Politics", "presImage":"wwilson.gif" }, { "presName":"Warren Gamaliel Harding", "presDates":"1921-1923", "presNick":"None", "presImage":"wgharding.gif" }, { "presName":"Calvin Coolidge", "presDates":"1923-1929", "presNick":"Silent Cal", "presImage":"ccoolidge.gif" }, { "presName":"Herbert Clark Hoover", "presDates":"1929-1933", "presNick":"None", "presImage":"hchoover.gif" }, { "presName":"Franklin Delano Roosevelt", "presDates":"1933-1945", "presNick":"FDR", "presImage":"fdroosevelt.gif" }, { "presName":"Harry S. Truman", "presDates":"1945-1953", "presNick":"Give 'Em Hell Harry", "presImage":"hstruman.gif" }, { "presName":"Dwight David Eisenhower", "presDates":"1953-1961", "presNick":"Ike", "presImage":"ddeisenhower.gif" }, { "presName":"John Fitzgerald Kennedy", "presDates":"1961-1963", "presNick":"JFK", "presImage":"jfkennedy.gif" }, { "presName":"Lyndon Baines Johnson", "presDates":"1963-1969", "presNick":"LBJ", "presImage":"lbjohnson.gif" }, { "presName":"Richard Milhous Nixon", "presDates":"1969-1974", "presNick":"None", "presImage":"rmnixon.gif" }, { "presName":"Gerald Rudolph Ford", "presDates":"1974-1977", "presNick":"Jerry", "presImage":"grford.gif" }, { "presName":"James Earl Carter Jr.", "presDates":"1977-1981", "presNick":"Jimmy", "presImage":"jecarter.gif" }, { "presName":"Ronald Wilson Reagan", "presDates":"1981-1989", "presNick":"The Gipper", "presImage":"rwreagan.gif" }, { "presName":"George Herbert Walker Bush", "presDates":"1989-1993", "presNick":"Poppy", "presImage":"ghwbush.gif" }, { "presName":"William Jefferson Clinton", "presDates":"1993-2001", "presNick":"Bill", "presImage":"wjclinton.gif" }, { "presName":"George Walker Bush", "presDates":"2001-2009", "presNick":"W", "presImage":"gwbush.gif" }, { "presName":"Barack Hussein Obama", "presDates":"2009-", "presNick":"None", "presImage":"bhobama.gif" } ] } 

當我使用文件撰寫,以測試它是否}); //end getJSON前右放在它工作正常,但如果它立即的地方在它爲空之後。我錯過了什麼?

+4

你錯過了一個事實,即[AJAX調用默認爲異步](http://stackoverflow.com/a/10370489/1233508)。 – DCoder

+1

你知道用'新總統',你只需在'data.presidents'數組中創建一對一的對象副本?除非你在'president.prototype'上定義了任何方法,否則這是不必要的。用你所顯示的代碼,你可以簡單地執行'myPres = data.presidents;'並且你會得到相同的結果。 –

+0

@FelixKling感謝您的領導。 – MDMarra

回答

3

在//結束getJSON之後放置document.write意味着它將在檢索JSON之前運行。

傳遞給.getJSON的匿名函數在數據從服務器返回時調用。如果在//結束getJSON之後運行document.write,則在請求返回之前調用它。

+0

+1儘管在回答中添加「成功」回調函數的解釋會很好。 – Paulpro

+0

是的,慢打字=我。 – joshp

+0

有什麼我可以做的「等待」該請求來完成,或者我應該只是把我需要的任何代碼在'// end getJSON'中使用該數據?我很新的JS/JQuery。 – MDMarra

0

我不喜歡jQuery的$。每() 我會做這樣的:

function parseJSON(JSONObj){ 
    var array=new Array(); 
    var count=0; 
    for(var Obj in JSONObj){ 
     array[count]=JSONObj[Obj]; 
     count++; 
    } 
} 

請告訴我,如果是其他任何你想要的

+0

好像在這種情況下(正如在評論中指出的那樣),.each()或其他任何循環都是即時的。僅僅爲了我自己的知識,除了不喜歡它之外,是否有一個令人信服的理由不使用'$ .each()'? – MDMarra

+1

@MDMarra:實際上[有一個很好的理由](http://stackoverflow.com/questions/500504/javascript-for-in-with-arrays)不*使用這個選項並使用'$ .each()相反。 – DCoder