JSON 讀書筆記

時間 2019-12-04

原文原文鏈接

JSONjavascript

JSON：JavaScript 對象表示法（JavaScript Object Notation）。html

JSON 是存儲和交換文本信息的語法。相似 XML。java

JSON 比 XML 更小、更快，更易解析。編程

什麼是 JSON ？json

JSON 指的是 JavaScript 對象表示法（JavaScript Object Notation）
JSON 是輕量級的文本數據交換格式
JSON 獨立於語言 *
JSON 具備自我描述性，更易理解

JSON 使用 JavaScript 語法來描述數據對象，可是 JSON 仍然獨立於語言和平臺。JSON 解析器和 JSON 庫支持許多不一樣的編程語言。數組

將json數據輸出到頁面:瀏覽器

<html>
 <body>
 <p>
     Name:<span id="i1" ></span>
     Gender:<span id='i2'></span>
     job:<span id = 'i3'></span>
     title:<span id='i4'></span>
 </p>
  <script type="text/javascript">
     var JObject = {
       'name':'bill', 
       'gender':'male', 
       'job':'ceo', 
       'title':'leader'
     }
     document.getElementById('i1').innerHTML=JObject.name;
     document.getElementById('i2').innerHTML=JObject.gender;
     document.getElementById('i3').innerHTML=JObject.job;
     document.getElementById('i4').innerHTML=JObject.title;
  </script>
 </body>
</html>

相似 XML安全

JSON 是純文本
JSON 具備「自我描述性」（人類可讀）
JSON 具備層級結構（值中存在值）
JSON 可經過 JavaScript 進行解析
JSON 數據可以使用 AJAX 進行傳輸

相比 XML 的不一樣之處編程語言

沒有結束標籤
更短
讀寫的速度更快
可以使用內建的 JavaScript eval() 方法進行解析
使用數組
不使用保留字

爲何使用 JSON？函數

對於 AJAX 應用程序來講，JSON 比 XML 更快更易使用：
使用 XML

讀取 XML 文檔
使用 XML DOM 來循環遍歷文檔
讀取值並存儲在變量中

使用 JSON

讀取 JSON 字符串
用 eval() 處理 JSON 字符串

JSON 語法是 JavaScript 對象表示法語法的子集。

數據在名稱/值對中
數據由逗號分隔
花括號保存對象
方括號保存數組

JSON 值

JSON 值能夠是：

數字（整數或浮點數）
字符串（在雙引號中）
邏輯值（true 或 false）
數組（在方括號中）
對象（在花括號中）
null

JSON 對象

{ "firstName":"John" , "lastName":"Doe" }

JSON 數組

{
"employees": [
{ "firstName":"John" , "lastName":"Doe" },
{ "firstName":"Anna" , "lastName":"Smith" },
{ "firstName":"Peter" , "lastName":"Jones" }
]
}
在上面的例子中，對象 "employees" 是包含三個對象的數組。每一個對象表明一條關於某人（有姓和名）的記錄。

js建立對象數組

<html>
 <body>
  <script type="text/javascript">
     var staffs = [
        {'name':'mike','title':'ceo'},
        {'name':'mi','title':'business'},
        {'name':'me','title':'store'},
        {'name':'jimmy','title':'dev'},
        {'name':'catey','title':'tester'}
     ]
     var v1 = staffs[0].title;//訪問數組staffs第一個元素的title屬性
     document.write(v1)//ceo
  </script>
 </body>
</html>

javascript eval()函數,他是javascript的編譯器,能夠解析json文件

<html>
<!-- 因爲 JSON 語法是 JavaScript 語法的子集，JavaScript 函數 eval() 可用於將 JSON 文本轉換爲 JavaScript 對象。 -->
<!-- eval() 函數使用的是 JavaScript 編譯器，可解析 JSON 文本，而後生成 JavaScript 對象。必須把文本包圍在括號中，這樣才能避免語法錯誤：var obj = eval ("(" + txt + ")"); -->
<body>
<p>
   First Name: <span id="fname"></span><br /> 
   Last Name: <span id="lname"></span><br /> 
</p> 
<script type="text/javascript">
    var txt = '{"employees":[' +//注意javascript的字符串鏈接的規則
              '{"firstName":"Bill","lastName":"Gates" },' +
              '{"firstName":"George","lastName":"Bush" },' +
              '{"firstName":"Thomas","lastName":"Carter" }]}';

    var obj = eval ("(" + txt + ")");

    document.getElementById("fname").innerHTML=obj.employees[1].firstName 
    document.getElementById("lname").innerHTML=obj.employees[1].lastName 
</script>
</body>
</html>

提示：eval() 函數可編譯並執行任何 JavaScript 代碼。這隱藏了一個潛在的安全問題。
使用 JSON 解析器將 JSON 轉換爲 JavaScript 對象是更安全的作法。JSON 解析器只能識別 JSON 文本，而不會編譯腳本。

在瀏覽器中，這提供了原生的 JSON 支持，並且 JSON 解析器的速度更快。

較新的瀏覽器和最新的 ECMAScript (JavaScript) 標準中均包含了原生的對 JSON 的支持。

<html>
<body>
<p>
   First Name: <span id="fname"></span><br /> 
   Last Name: <span id="lname"></span><br /> 
</p> 
<script type="text/javascript">
    var txt = '{"employees":[' +//注意javascript的字符串鏈接的規則
              '{"firstName":"Bill","lastName":"Gates" },' +
              '{"firstName":"George","lastName":"Bush" },' +
              '{"firstName":"Thomas","lastName":"Carter" }]}';
    var obj = JSON.parse(txt)//利用JSON解析器
    document.getElementById("fname").innerHTML=obj.employees[1].firstName 
    document.getElementById("lname").innerHTML=obj.employees[1].lastName 
</script>
</body>
</html>

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。