DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript基礎知識 >> JavaScript中對JSON對象的基本操作示例
JavaScript中對JSON對象的基本操作示例
編輯:JavaScript基礎知識     

JSON對象

1、對象的屬性:
對象的屬性是有鍵值對組成的,其中key為一個字符串,value可以為任何的Javascript對象。

//使用[]設置和獲取對象的屬性
var obj = new Object();
obj["www.jb51.net"] = "http://www.jb51.net";
alert(obj["www.jb51.net"]);

2、變量既是屬性:
Javascript引擎在初始化時會構建一個全局對象,所有的變量都是這個全局對象的屬性。為了引用這個全局對象,可以再頂級作用域中這樣獲取:

var global = this;

在Javascript中,任何獨立的函數或者變量都屬於這個對象的屬性,即:

function test(){}

相當於:

window.test = function(){}

3、使用對象:
聲明對象的三種方式:

① 通過new操作符創建一個Object對象,然後動態地添加屬性,從無到有構造一個對象
② 定義對象的類圓形,然後使用new操作符來批量構造新的對象

//創建一個對象
function User(username, password){
  this.username = username;
  this.password = password;
  this.getUsername = function(){
    return this.username;
  }
  this.getPassword = function(){
    return this.password;
  }
}
var arthinking = new User("Jason", "123");
alert(arthinking.getUsername());
alert(arthinking.getPassword());

③ 使用JSON構造對象
JSON即Javascript對象表示方法(Javascript Object Notation),也就是通過字面量來表示一個對象:

//JSON形式創建一個對象
var arthinking = {
  username : "Jason",
  password : "123",
  favorite : {
    sports : "football",
    music : "Guitar"
  }
}
alert(arthinking.username);
alert(arthinking.favorite.sports);

解析由服務器返回的JSON格式數據
單個JSON對象:

[{a:'1',b'2'},{a:'3',b'4'}]

多個JSON對象:

{
"usergroups":[{a:'001',b:'arthinking'},a:'002',b:'Jason'}],
"groups":[{c:'001',d:'IT宅'}]
}

可以根據這種格式先從後台封裝好需要傳遞的數據,前台獲取到後可以這樣解析獲取數據:

//假設response.responseText為返回的JSON字符串
//可以使用eval()函數把JSON字符串轉換成Javascript語句
//再通過”.”導航獲取具體屬性,length屬性為對象的長度
var obj = eval( "(" + response.responseText + ")" );
for(var i = 0; i<obj.usergroups.length; i++){
  var groupid = obj.usergroups[i].a;
  var usergroup=obj.groups;
  for(var j=0; j<usergroup.length; j++){
    if(usergroup[j].c == groupid){
      alert(groupid);
 }
  }
}
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved