溫馨提示×

溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊×
其他方式登錄
點(diǎn)擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

JavaScript對象符號JSON的簡介以及用法是怎樣的

發(fā)布時(shí)間：2021-09-30 15:17:34 來源：億速云 閱讀：120 作者：柒染 欄目：web開發(fā)

本篇文章給大家分享的是有關(guān)JavaScript對象符號JSON的簡介是怎樣的，小編覺得挺實(shí)用的，因此分享給大家學(xué)習(xí)，希望大家閱讀完這篇文章后可以有所收獲，話不多說，跟著小編一起來看看吧。

 介紹

一段時(shí)間以來，程序員/開發(fā)人員/架構(gòu)師面臨的比較大的挑戰(zhàn)是如何在不考慮硬件或軟件需求的情況下將數(shù)據(jù)從一個(gè)系統(tǒng)傳輸?shù)搅硪粋€(gè)系統(tǒng)。在此期間，我們看到許多技術(shù)都試圖使這一需求盡可能簡單，現(xiàn)在我們終于在JSON的幫助下實(shí)現(xiàn)了它。

JSON是JavaScript對象表示法的首字母縮寫。Douglas Crockford在本世紀(jì)初最初指定了JSON格式。JSON的特點(diǎn)如下：

  1. 與XML數(shù)據(jù)相比，JSON數(shù)據(jù)更容易被人類讀取，XML數(shù)據(jù)也用于從一個(gè)系統(tǒng)傳輸?shù)搅硪粋€(gè)系統(tǒng)。

  2. 它是一種輕量級數(shù)據(jù)交換格式。

  3. 它遵循開放標(biāo)準(zhǔn)格式來傳輸以“鍵-值對”模式存儲(chǔ)信息的數(shù)據(jù)對象。

  4. 它是一種與語言無關(guān)的數(shù)據(jù)格式。

  5. JSON可以更容易地映射到面向?qū)ο蟮南到y(tǒng)。

  6. 包含JSON數(shù)據(jù)的文件有一個(gè)"?？梢员蝗魏尉幊陶Z言讀取的擴(kuò)展。

典型的JSON是這樣的：

示例1

{         “Name”:”Jojo”,        “Age”: 23     }

解釋

“Name”是鍵，“Jojo”是鍵的值。同樣，“年齡”是鍵，23是鍵的值。如果您注意到值23沒有雙引號，這又證明了一點(diǎn)，JSON支持多種數(shù)據(jù)類型，其中一種是數(shù)字。除了數(shù)字和字符串，JSON支持的其他數(shù)據(jù)類型有：

  • 布爾

  • 數(shù)組

  • 數(shù)字(整型、浮點(diǎn)數(shù)、定點(diǎn)數(shù))

  • 對象

  • 空格

  • Null

上面的示例只包含一個(gè)對象的詳細(xì)信息。如果我們計(jì)劃有一個(gè)對象數(shù)組，那么存儲(chǔ)將是這樣的：

示例2

{         “Employees”:[           {“Name”:”PopatLal”, “Age”:25},           {“Name”:”Santa Singh”, “Age”:27},           {“Name”:”Banta Singh”, “Age”:28},           {“Name”:”SohanLal”, “Age”:25},        ]     }

在示例2中，我們有一個(gè)名為“Employees”的對象數(shù)組，其中包含兩個(gè)組件“Name”和“Age”。

現(xiàn)在，我們注意到的更大的問題是如何使用ASP.NET MVC 4在web頁面上顯示JSON信息。讓我們一步一步來看看如何使用相同的方法。

  • 我們?yōu)檫@個(gè)示例應(yīng)用程序選擇了一個(gè)基本模板，解決方案資源管理器看起來像這樣：

JavaScript對象符號JSON的簡介以及用法是怎樣的

  • 現(xiàn)在我們正在創(chuàng)建一個(gè)非常簡單的應(yīng)用程序，其目的是打印一條表示“歡迎JSON”的歡迎消息。為此，我們將添加一個(gè)MVC控制器和一個(gè)返回JSONResult的方法。代碼如下：

public JsonResultWelcomeMessage()     {        String message = "Welcome to JSON";        returnJson(message, JsonRequestBehavior.AllowGet);     }

  • 當(dāng)你運(yùn)行這個(gè)程序時(shí)，你會(huì)得到如下的輸出：

JavaScript對象符號JSON的簡介以及用法是怎樣的

  • 這段代碼現(xiàn)在證明我們能夠查看JSON數(shù)據(jù)，現(xiàn)在我們需要在HTML頁面上使用它，因此我們需要為它創(chuàng)建一個(gè)視圖。

  • 在“DemoController”下，我們寫了一個(gè)名為“Index”的ActionResult方法，這個(gè)方法返回一個(gè)同名的視圖，即“Index.cshtml”。

publicActionResult Index()     {        return View();     }

在Index.cshtml中的HTML代碼，看起來像這樣的：

@{         Layout = null;     }     <!DOCTYPE html>     <html>         <head>             <meta name="viewport" content="width=device-width" />             <title>Index</title>         </head>         <body>             <div>                 <input type="button" id="btn1" value="Print" />             </div>             <br />             <br />             <div id="messagediv" style="align-items: center; text-align: center; border: 3px solid blue; width: 300px; height: 300px; background-color: lightblue; color: yellow"></div>         </body>     </html>

  • 上述代碼的輸出如下所示：

JavaScript對象符號JSON的簡介以及用法是怎樣的

  • 現(xiàn)在，為了執(zhí)行JSON方法并在給定框內(nèi)打印消息，我們必須使用JQuery，在其中調(diào)用“getJSON”方法，在其中調(diào)用“WelcomeMessage”方法。

  • 代碼如下所示：

<scriptsrc="~/Scripts/jquery-2.2.3.min.js">     </script>     <script type="text/javascript">         $(document).ready(function()         {             $("#btn1").click(function()             {                 vardivObj = $("#messagediv");                 $.getJSON("/Demo/WelcomeMessage/", null, function(data)                 {                     divObj.append("<b>" +                         data + "</b>");                 });             });         });     </script>

  • 單擊按鈕后，輸出如下所示：

JavaScript對象符號JSON的簡介以及用法是怎樣的


以上就是JavaScript對象符號JSON的簡介是怎樣的，小編相信有部分知識(shí)點(diǎn)可能是我們?nèi)粘９ぷ鲿?huì)見到或用到的。希望你能通過這篇文章學(xué)到更多知識(shí)。更多詳情敬請關(guān)注億速云行業(yè)資訊頻道。

向AI問一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手