SegmentFault 技術週刊 Vol.33 - 什麼是 JSON ？

JSON 的全稱是JavaScript Object Notation，能夠翻譯爲 JavaScript 對象表示法，即將一個 Object 以文本的方式給記錄下來。

根據 ECMA-404 標準：

JSON is a text format that facilitates structured data interchange between all programming languages.

因此 JSON 是一種文本格式，它能用於在不一樣編程語言中交換結構化數據。JSON 是存儲和交換文本信息的語法，在不少狀況下能夠用來描述特定數據結構的實例。

JSON 基礎

JSON入門

JSON有兩種表示結構，對象和數組。

• 對象是一個無序的「‘名稱/值’對」集合。一個對象以{（左括號）開始，}（右括號）結束。每一個「名稱」後跟一個:（冒號）；「‘名稱/值’ 對」之間使用,（逗號）分隔。

• 數組是值（value）的有序集合。一個數組以[（左中括號）開始，]（右中括號）結束。值之間使用,（逗號）分隔。

JavaScript：JSON 和 JS 對象

JSON（JavaScript Object Notation）僅僅是一種數據格式（或者叫數據形式）。數據格式其實就是一種規範，按照這種規範來存諸和交換數據。就好像 XML 格式同樣。JSON 文本格式在語法上與建立 JavaScript 對象的代碼相同，但本質是不一樣的。

JSON 和 JavaScript 確實存在淵源，JSON 自己的意思就是 JavaScript 對象表示法（JavaScript Object Notation），能夠說這種數據格式是從 JavaScript 對象中演變出來的。JSON 語法是 JavaScript 對象表示法語法的子集。

JSON 格式的數據，主要是爲了跨平臺交流數據用的。JSON 獨立於語言和平臺，JSON 解析器和 JSON 庫支持許多不一樣的編程語言。

JSON不等於JavaScript對象

我嘗試複製一些JavaScript對象，而後將它們發送到一個基於JSON的書籤站點。可是它不能工做，爲何？

服務器返回的錯誤信息是Unexpected token n（服務器使用NodeJS和Express框架搭建），這意味着上面的JavaScript對象不是合法的JSON。

深刻理解JavaScript系列11:根本沒有「JSON對象」這回事

我想給你們澄清一下一個很是廣泛的誤解，我認爲不少JavaScript開發人員都錯誤地把JavaScript對象字面量（Object Literals）稱爲JSON對象（JSON Objects），由於他的語法和JSON規範裏描述的同樣，可是該規範裏也明確地說了JSON只是一個數據交換語言，只有咱們將之用在string上下文的時候它才叫JSON。

對象字面量不是JSON對象，可是有真正的JSON對象。可是二者徹底不同概念，在現代的瀏覽器裏JSON對象已經被原生的內置對象了，目前有2個靜態方法：JSON.parse()用來將JSON字符串反序列化成對象，JSON.stringify()用來將對象序列化成JSON字符串。

JSON：若是你願意一層一層剝開個人心，你會發現...這裏水很深——深刻理解JSON

歡迎進入本次「深挖JSON之旅」，下文將從如下幾個方面去理解JSON：

• 首先是對「JSON是一種輕量的數據交換格式」的理解；

• 而後來看常常被混爲一談的JSON和JS對象的區別；

• 最後咱們再來看JS中這幾個JSON相關函數具體的執行細節。

JSON 進階

小技巧之JSON.stringify()/parse()

JSON.stringify() 用於把一個JSON對象（恩，javascript中萬物皆對象），轉化爲一個字符串。

JSON.parse() 只擁有兩個參數，第一個就是把這個字符串轉換爲JSON對象，第二個就是篩選對象。

解析XML和JSON內容的一點技巧

在沒有統一標準的狀況下，一個系統對接多個外部系統每每會遇到請求接口響應數據異構的狀況，有可能返回的是XML，也有可能返回JSON。除了返回類型不一樣，內容結構也不盡相同。

若是在咱們系統中爲每種格式的內容針對處理顯然是不合理的，上面的內容中咱們只是關心三種信息，分別是業務ID、狀態值和描述信息，那麼可不能夠抽象這三種信息，得到這些信息後再進行業務邏輯處理。

本身動手實現一個簡單的JSON解析器

JSON 解析器從本質上來講就是根據 JSON 文法規則建立的狀態機，輸入是一個 JSON 字符串，輸出是一個 JSON 對象。通常來講，解析過程包括詞法分析和語法分析兩個階段。

詞法分析解析出 Token 序列後，接下來要進行語法分析。語法分析的目的是根據 JSON 文法檢查上面 Token 序列所構成的 JSON 結構是否合法。

造輪子系列(一): 一個速度九分快的JSON解析器

前一陣子看到了一個Golang的JSON庫go-simplejson，用來封裝與解析匿名的JSON，說白了就是用map或者slice等來解析JSON，以爲挺好玩，後來有個項目剛好要解析JSON，因而就試了試，不當心看了一眼源代碼，發現居然是用的Golang自帶的encoding/json庫去作的解析，而其自己只是把這個庫封裝了一層，看起來更好看罷了

因而心想能不能徒手寫一個解析器，畢竟寫了這麼多年代碼了，也JSON.parse，JSON.stringify了無數次。搗騰了兩天，終於成了，測試了一下，性能比自帶的庫要高不少，速度基本上在1.6到7倍之間（視JSON串的大小和結構而定），因此決定寫這篇文章分享一下思路。

動手實現一個JSON驗證器

JSON字符串的驗證比想象中的要簡單不少，能夠說是至關的簡單，這得益於在官網上已經將各個狀態的扭轉、格式類型和組成圖給你畫好了，只要代碼沒寫錯，照着圖把各個部分的驗證寫出來就實現了。

在寫完後，我用fastjson的issue859.json測了一下性能，和調用Go的json庫或其它三方json庫相比，這個實現的性能要高出30%左右，所以若是有需求只驗證不解析的，花點時間手擼一個驗證器仍是很划算的。

JS+PHP+MYSQL處理JSON的全面總結

開發過程當中常常碰到要把前端的json格式的數據傳遞到後端php，php作一些業務處理後把數據存到mysql，而後，php再從mysql中取出數據返回到前端。雖然這是一個再基礎不過的處理過程，但仍是有很多問題須要認真研究。下面從幾個環節看看可能出現的各類問題。

json字符串頭部出現非法字符「ufeff」的問題處理

今天在處理將數組轉爲json 字符串後，而後獲取到解析時，出現解析的json字符串爲空的現象，首先看了下，個人json轉換腳本以前沒有任何輸出，但仍是出現json轉化亂碼，後來查了下，原來是腳本編碼格式的問題。

PHP json_decode 遇到的坑

場景：某項目客戶反饋，輸出的結果 JSON 中有個要求爲對象的數據字段，在某些狀況下返回的是 [] 而不是 {}；數據由公司其餘部門提供，查看原始數據的時候，沒有發現任何問題；後來由於要加入某些預處理，在獲取到其餘部門的 JSON 數據以後進行解碼並對某個字段進行處理；然而，在處理完以後再次使用 JSON 輸出，發現結果已經不是咱們想要的了。

（轉）php json_decode解析失敗及錯誤處理

通常狀況下，獲取到一段json內容，直接json_decode($content, true)就轉成array來用了，很方便。

可是，若是給你提供json內容的接口出了點問題，給的json不標準或是乾脆有錯誤，那就要想辦法來找出問題了。

JavaScript JSON——「語法、解析與序列化」的注意要點

JSON能夠表示一下三種類型的值：

• 簡單值：使用與js相同的語法能夠在json中表示字符串、數值、布爾值和null。可是json不支持js的undefined。

• 對象：對象做爲一種複雜的數據類型，表示的是一組有序的鍵值對。每一個鍵值對的值能夠是簡單值，也能夠是複雜數據類型的值

• 數組：數組也是一種複雜數據類型，表示一組有有序的的值列表，能夠經過數值索引來訪問其中的值。數組的值也能夠是任意類型，簡單值，對象，數組都可。

json不支持變量，函數，對象實例，它就是一種表示結構化數據的格式。

讓json更懂中文

相信不少人用php搭後臺時候，當ajax用於交互時候，因爲字符都被urf-8處理，因此用PHP的json_encode來處理中文的時候, 中文都會被編碼, 變成不可讀的, 相似」u*」的格式, 並且還會在必定程度上增長傳輸的數據量。

總結幾種解決方法：

• 本身構造支持中文的 json_encode

• 運用preg_replace替換u**爲中文

• 5.4版本後的直接處理

ajax 以json形式提交表單

JSON 擴展

ajax相關測試題目

記錄下Flarum論壇API設計

利用window.name實現頁面跳轉之間的數據傳遞

先描述一下需求情景：

有一個生成節日賀卡的頁面，a頁面最後部分用來填寫用戶名和賀卡內容，點擊提交按鈕跳轉到賀卡頁面b，b頁面顯示的就是a頁面填寫的內容和用戶名。(a頁面和b頁面是沒有跨域的...)

一開始我只想到用ajax提交數據來實現，不過一想，是直接提交到b頁面嗎？一時之間，我也不知道該如何進行頁面跳轉之間的數據傳遞。百度許久，終於看到 window.name這個方法。

介紹兩大神器！——使用json-server和faker.js模擬REST API

今天發現了一個神器——json-server!在他的幫助下能夠在很短的時間內搭建一個Rest API, 而後就可讓前端在不依賴後端的狀況下進行開發啦！

簡單來講，JSON-Server是一個Node模塊，運行Express服務器，你能夠指定一個json文件做爲api的數據源。

Jsoniter 0.9.8 發佈： JSON 性能對標 Protobuf

Jsoniter 是一款快且靈活的 JSON 解析器，同時提供 Java 和 Go 兩個版本。

zTree -- jQuery 樹插件 構造treeNode JSON 數據對象

zTree 是一個依靠 jQuery 實現的多功能 「樹插件」。

在大型項目中，每每須要不一樣的用戶看到不一樣的目錄，不一樣的地區顯示不一樣的目錄等等，面對這些龐大的數據，須要生成不一樣結構的樹目錄，你不能一個一個定義這些配置來知足那麼多數據需求，這就須要異步加載子節點的的父節點，經過構造treeNode的 JSON 數據對象方法來實現，若是你不嫌我囉嗦，接下來會給你們講述這個方法。

推薦Mac系統快速預覽擴展插件15個，保證你滿意

包括：

• Markdown文件轉換成靜態頁面預覽

• 在預覽源代碼文件，高亮代碼

• 格式化預覽JSON文件

• 顯示圖像大小和分辨率

不得不說的 JSONP

ajax相關完整知識

AJAX即「Asynchronous Javascript And XML」（異步JavaScript和XML），是指一種建立交互式網頁應用的網頁開發技術。

• AJAX = 異步 JavaScript和XML（標準通用標記語言的子集）

• AJAX 是一種用於建立快速動態網頁的技術

• 經過在後臺與服務器進行少許數據交換

• AJAX可使網頁實現異步更新。這意味着能夠在不從新加載整個網頁的狀況下，對網頁的某部分進行更新。

• 傳統的網頁（不使用 AJAX）若是須要更新內容，必須重載整個網頁頁面。

JSONP是什麼

JSONP的誕生

• 首先，由於ajax沒法跨域，而後開發者就有所思考

• 其次，開發者發現， <script> 標籤的src屬性是能夠跨域的。把跨域服務器寫成 調用本地的函數 ，回調數據回來不就行了？

• json恰好被js支持（object）

• 調用跨域服務器上動態生成的js格式文件（不論是什麼類型的地址，最終生成的返回值都是一段js代碼）

• 這種獲取遠程數據的方式看起來很是像ajax，但其實並不同。便於客戶端使用數據，逐漸造成了一種非正式傳輸協議，人們把它稱做JSONP。

• 傳遞一個callback參數給跨域服務端，而後跨域服務端返回數據時會將這個callback參數做爲函數名來包裹住json數據便可。

同源策略與JS跨域（JSONP , CORS）

本文按照政治問答題必備套路分爲如下3個部分：

• 爲何要跨域？

• 跨域是什麼？

• 如何實現跨域？

爲何是 JSONP

在 WEB 開發中，常常見到諸如 AJAX、JSON、JSONP 這些名詞。三者看起來很像，不少同窗尤爲是沒有系統瞭解過前端技術體系的同窗，日常只是藉助相似 JQuery 這類庫封裝好的函數使用而已，並不瞭解其原理。但這三種東西具體是什麼，有什麼關係和區別卻經常說不清楚。

接下來，會簡要介紹一下三者的的含義，重點闡述 JSONP 的來源和原理，以及爲何 JSONP 不是 AJAX。

jsonp 跨域原理分析

總結：

1. ajax和jsonp這兩種技術在調用方式上「看起來」很像，目的也同樣，都是請求一個url，而後把服務器返回的數據進行處理，所以jquery和ext等框架都把jsonp做爲ajax的一種形式進行了封裝；

2. ajax和jsonp其實本質上是不一樣的東西。ajax的核心是經過XMLHttpRequest獲取非本頁內容，而jsonp的核心則是經過HTTP來動態添加 <script> 標籤來調用服務器提供的js腳本。

3. 其實ajax與jsonp的區別不在因而否跨域，ajax經過服務端代理（CORS）同樣能夠實現跨域，jsonp自己也不排斥同域的數據的獲取。

4. jsonp是一種方式或者說非強制性協議，如同ajax同樣，它也不必定非要用json格式來傳遞數據，若是你願意，字符串都行，只不過這樣不利於用jsonp提供公開服務。

5. jsonp整個過程當中，本地站點一直處於主動的地位，主動的發送請求，主動的加載遠程js.而第三方站點則處於被動的響應。

（Ajax） 淺談 JSONP 的原理與實現

JSONP與Ajax的關係：

• Ajax與JSONP這兩種技術看起來很像，目的也同樣，都是請求一個url，而後把服務器返回的數據進行處理，所以jQuery等框架都把JSONP做爲Ajax的一種形式。

• 實際上Ajax與JSONP有着本質上的不一樣。Ajax的核心是經過XMLHttpRequest獲取數據，而JSONP的核心則是動態添加<script>標籤來調用服務器提供的js文件。

• Ajax與JSONP的區別也不在因而否跨域，Ajax經過服務端代理也能夠跨域，JSONP也可獲取同源數據。

本期完
:）

---