首頁 > web前端 > js教程 > 詳解JavaScript中js物件與JSON格式字串的相互轉換

詳解JavaScript中js物件與JSON格式字串的相互轉換

高洛峰
發布: 2017-02-17 16:32:53
原創
1251 人瀏覽過

本篇文章主要介紹了JavaScript中js物件與JSON格式字串的相互轉換,具有一定的參考價值,有興趣的小夥伴們可以參考一下。

首先我們來看一下js中JSON格式的字串

var JSONStr1 = "{\"name\" : \"张三\"}";
登入後複製

注意以下的寫法不是js中JSON格式的字串,它只是一個js的字串。

var JSONStr2 = "{'name' : '张三'}";
登入後複製

我們看JSON語法中對於字串的定義:是由雙引號包圍的任意數量Unicode字元的集合,使用反斜線轉義。一個字元(character)即一個單獨的字串(character string)。

下面我們來看看在js中怎麼把JSON格式的字串轉換成一個JS物件。 (

var jsObj3 = eval("(" + JSONStr1 + ")");
var jsObj4 = JSON.parse(JSONStr1);
登入後複製

推薦使用第二種方式具體原因請參考:http://www.php.cn/

此外提一句使用這兩種方式轉換後的js對象,應該是「一個符合JSON資料格式的js物件」,也就是說它的屬性是帶著引號的,這只是我的一種猜測,因為如果JSON格式的字串如下表示:

var JSONStr1 = "{\"f[name]\" : \"张三\"}";
登入後複製

那麼轉換後的JS物件的屬性必定要加上引號,因為js物件的屬性不加引號只能使用字母,數字,下劃線和$符號表示,使用其它符號屬性就要加上引號了,所以說JS物件字面量表示法中屬性加上引號是不會錯的。 name]'] ,因為有特殊字符,這點要注意了。下面我準備了幾組js對象加以說明:

<input type="button" value="测试按钮1" onclick="testJson();"/>

<script type="text/javascript">
  //(1) 这是一个js对象
  var jsObj1 = {
    name : "张三"
  }
  //(2)这是一个内部带有方法js对象。
  var jsObj2 = {
    name : "张三",
    func : function(){
      alert("hello");
    }
  }
  //(3)这是一个符合JSON数据格式的js对象
  var jsonObj = {
    "name" : "张三",
    "age" : 10,
    "remark" : {"high" :170,"address" : "beijingshi"}
  }
  // js数组对象
  var jsArray = [
    {name : "张三"},
    {"age" : 10}
  ]

  function testJson(){

    var JSONstr1 = JSON.stringify(jsObj1);
    var JSONstr2 = JSON.stringify(jsObj2);
    var JSONstr3 = JSON.stringify(jsonObj);
    var JSONstr4 = JSON.stringify(jsArray);
    alert(JSONstr1);
    alert(JSONstr2);
    alert(JSONstr3);
    alert(JSONstr4);

  }
登入後複製

看一下彈框的內容:

                                                     

                   3)                                              (4)

詳解JavaScript中js物件與JSON格式字串的相互轉換詳解JavaScript中js物件與JSON格式字串的相互轉換

 

其中(1)、(3)、(4)的執行結果說明,JSON解析器的stringify()函數對於js物件是fou符合JSON格式是不加限定,都可以把js物件轉換成JSON格式字串。希望大家多多支援PHP中文網。
相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板