Tuần này xin gửi đến mọi người bài viết giới thiệu về JSON. Tác giả là 1 supper man của NTT Data chuyên về JavaScript. Mình cũng từng làm 1 project có dùng JSON nên hiểu được nhiều cái hay của nó. Qua bài viết này nếu bạn nào đã biết rồi thì nên đào sâu hơn. Còn chưa biết thì cứ tập làm 1 web nhỏ nhỏ xem thử nó hoạt động thế nào. Lý do đưa bài viết chuyên kỹ thuật lên để mọi người quen, sau này onsite khách hàng giao tài liệu thì sẽ biết cách đọc sao cho nhanh – cho đúng.

JSONとは何か? – JSON là khỉ gì

JSONとはJavaScript Object Notationの略で、XMLなどと同様のテキストベースのデータフォーマットです。

その名前の由来の通りJSONはJavaScriptのオブジェクト表記構文のサブセットとなっており、XMLと比べると簡潔に構造化されたデータを記述することができるため、記述が容易で人間が理解しやすいデータフォーマットと言えます。

Show More

JSON là từ viết tắt của JavaScript Object Notation, là kiểu dữ liệu dạng text base tương tự như XML vậy.

Dựa vào nguồn gốc cái tên này ta có thể hiểu nôm na nó như là cú pháp Object Notation (ký hiệu) của JavaScript, So với XML thì dữ liệu được cấu trúc hoá 1 cách tường minh hơn nên có thể nói rằng kiểu Data Format này rất dễ đọc – dễ hiểu.

なお、JSONは2006年に「RFC 4627(http://www.rfc-editor.org/rfc/rfc4627.txt)」として公開されています。

例としてXMLとJSONで同じデータを記述したものをリスト1とリスト2に示します(図1)。

リスト1のXMLではすべての情報をタグで囲んだテキストノードとして記述していますが、XMLでデータを表現する場合、データの記述方法として属性とテキストノードの使い分けが必要になります。

JSONの場合、そのようなことを気にする必要はありません。また、XMLには閉じタグが必要となりますが、JSONの場合カッコに対応する閉じカッコ以外は不要です。JSONはXMLと比べるとタイプ数も少なく、きちんとインデントされていれば可読性も高いことがわかります。

Show More

JSON được phát hành vào năm 2006.

Ví dụ bên dưới là về cách tổ chức cùng 1 data giống nhau bằng XML(list1) vs JSON(list2).

Ở List 1 XML toàn bộ thông tin được mô tả như các text node bao quanh bởi TAG, trường hợp biểu diễn data bằng XML thì trong phương pháp tổ chức dữ liệu, cần thiết phải phân chia text node vs properties riêng biệt.

Trong trường hợp của JSON, bạn không phải lo lắng về những thứ như vậy. Ngoài ra, XML yêu cầu một thẻ đóng, nhưng đối với JSON chỉ cần dấu ngoặc ({} – dấu này nè) là đủ. JSON có ít loại hơn XML, và nếu căn lề đúng là có thể đọc được.

図1:同データのXMLとJSONの記述例とAjaxの概念図(クリックで拡大)

JSONの利用シーン – Sử dụng JSON

JSONは前述の通り、JavaScriptのサブセットなのでeval()関数で評価することでJavaScriptオブジェクトに変換することができるという特徴があります。eval()関数は引数で渡された文字列をJavaScriptコードとして評価し、その結果を返します。

このようにJavaScriptとの親和性の高さから現在ではAjaxでのデータ交換フォーマットとして広く利用されるようになりました。

Show More

Vì JSON là một tập con của JavaScript như đã đề cập ở trên, nó có đặc trưng có thể được chuyển đổi thành đối tượng JavaScript bằng cách đánh giá với hàm eval (). Hàm eval () đánh giá chuỗi thông qua trong đối số như mã JavaScript và trả về kết quả.

Do thân thiện với JavaScript nên bây giờ đã được sử dụng rộng rãi dưới dạng định dạng trao đổi dữ liệu trong Ajax (Ajax là kỹ thuật khá phổ biến, nó cho phép load lại chỉ vùng dữ liệu thay đổi chứ không phải toàn bộ trang web và JSON hỗ trợ rất tốt cái này, nó giúp data đưọc gửi nhận giữa server – client được thanh thoát, cái này mình nói thêm chứ ko có trong bản tiếng Nhật)

AjaxはもともとAsynchronous JavaScript + XMLの略で、Webブラウザ上で動作するJavaScriptでサーバからXMLデータを取得し、取得したデータをDHTMLを活用してコンテンツに動的に反映するという手法です(図1)。

このXMLの代わりにJSONが使われているわけです。JSONを利用することで冗長なXMLと比べて通信時のデータ量を削減できるなどのメリットもあります。

AjaxのサーバサイドはJavaやPHPなどの言語を利用して実装されることが多いのですが、すでに主要なプログラミング言語にはJSONの生成や読み込みを行うライブラリが存在するため、JavaScriptに限らず言語をこえたデータ交換のためのデータフォーマットとしてJSONを利用することができます。

Show More

Ajax vốn dĩ là chữ viết tắt của Asynchronous JavaScript + XML, nó là một phương pháp thu thập dữ liệu XML từ một máy chủ với JavaScript đang chạy trên một trình duyệt Web và phản ánh động các dữ liệu thu được tới các nội dung sử dụng DHTML (Hình 1) .

JSON được dùng thay cho XML. Vì nó mang lại lợi ích trong việc giảm lượng dữ liệu trong quá trình trao đổi so với XML.

Phía máy chủ của Ajax thường được triển khai bằng các ngôn ngữ như Java và PHP, nhưng đã có các thư viện đọc JSON trong các ngôn ngữ lập trình chính yếu, do đó nó không giới hạn ở JavaScript mà JSON có thể được sử dụng như một data format để truyền dữ liệu.

JSONの記法 – Notation of JSON

それではJSONの記法について詳しく見ていきましょう。

JSONはオブジェクトと配列の組み合わせで構造化されたデータを表現します。

オブジェクトは{}で全体を囲み、キーと値のペアをコロン(:)で区切って記述します。カンマ(,)で複数のキーと値を記述することも可能です。キーには文字列のみ使用可能です。リスト3にオブジェクトの記述例を示します(図2)。

配列は繰り返し項目を表現する際に使用します。全体を[]で囲み、値をカンマ(,)で区切って列挙します。リスト4に配列の記述例を示します(図2)。

構造化されたデータを表現するために、オブジェクトと配列を自由にネストさせることができます。リスト5にオブジェクトと配列をネストさせた場合の記述例をします(図2)。

Show More

Chúng ta hãy cùng xem chi tiết notation của JSON.

JSON mô tả dữ liệu được cấu trúc từ sự kết hợp của các đối tượng và mảng.

Đối tượng được bao quanh bởi {}, và cặp khóa-giá trị được mô tả bằng cách tách nó với dấu hai chấm (:). Cũng có thể mô tả nhiều khóa và giá trị bằng dấu phẩy (,). Chỉ có chuỗi ký tự có thể được sử dụng cho khoá. List3 là ví dụ về mô tả đối tượng (Hình 2).

Mảng được sử dụng để đại diện cho các mục lặp đi lặp lại. Bao quanh toàn bộ trong [], liệt kê các giá trị được phân tách bằng dấu phẩy (,). List4 là ví dụ về mô tả mảng (array) (hình 2).

Bạn có thể tuỳ ý tổ chức các đối tượng và mảng để đại diện cho dữ liệu có cấu trúc. List5 là ví dụ trong đó các đối tượng và mảng được lồng nhau (Hình 2).

図2:JSONの記法

JSONで利用可能なデータ型 – Các kiểu dữ liệu trong JSON

続いてJSONで利用可能なデータ型について説明します。

JSONでは「数値」「文字列」「真偽値(true、false)」「配列」「オブジェクト」「null」のデータ型を利用することができます。

オブジェクトと配列の記述方法についてはすでに説明しました。ここでは数値と文字列について補足しておきましょう。

数値型は10進数で表記します。多くのプログラミング言語と同様整数および小数部、指数部の記述が可能です。

また、文字列はダブルクオートで囲み、改行やタブ文字、ダブルクオートなどの特殊文字はバックスラッシュ(\)でエスケープします。こちらも一般的なプログラミング言語をご存知の方にはお馴染みでしょう。

JSONの基本的な文法の説明は以上です。XMLでは表記の冗長さに加え、DTDやXML スキーマ、XMLスキーマの豊富なデータ型、名前空間などさまざまな事柄を意識する必要がありますが、それと比べるとJSONは非常にシンプルで覚えることが少ないことがわかります。

Show More

Tiếp theo, chúng ta sẽ mô tả các kiểu dữ liệu trong JSON.

Trong JSON bạn có thể sử dụng các kiểu dữ liệu “Numeric”, “chuỗi”, “boolean (true, false)”, “array”, “object”, “null”.

Tôi đã giải thích ở phần trước phương pháp định dạng object + array. Ở đây ta bổ sung thêm “Numeric”, “chuỗi”.

Các kiểu số được biểu diễn bằng thập phân. Giống như nhiều ngôn ngữ lập trình khác, có thể mô tả số nguyên, số thập phân và số mũ.

Bên cạnh đó, chuỗi phải được đặt trong dấu ngoặc kép, xuống dòng hoặc tab, ký tự đặc biệt như dấu ngoặc kép sẽ được đặt kèm dấu gạch chéo ngược (\). Nó cũng không khác gì với các ngôn ngữ lập trình thông dụng hiện nay.

Xin khép lại phần giải thích ngữ pháp cơ bản của JSON. Việc biểu diễn dữ liệu bằng XML rất là rườm rà, bạn phải nắm được cả mớ bồng bông gồm những thứ liên quan như DTD, XML Schema, 1 đống kiểu dữ liệu của XML Schema, namespace, nhưng với JSON thì mọi chuyện trở nên đơn giản hơn nhiều.

JavaScriptでJSONを使う – Sử dụng JSON trong JavaScript

実際にJavaScriptではどのようにJSONを扱うのでしょうか?

JSON形式の文字列をeval()関数で評価し、JavaScriptのオブジェクトに変換する例をリスト6に示します(図3)。

JSONのオブジェクトや配列は、JavaScriptでもオブジェクトのプロパティ、配列のインデックスを利用して参照することができます。

リスト6ではeval()関数でJSONをJavaScriptに変換していますが、eval()関数では任意のJavaScriptコードを実行可能なため、評価するJSONデータが悪意あるものであった場合にセキュリティ上の問題となってしまう可能性があります。

そのため実際にはJSONをパースし、JavaScriptのオブジェクトに変換するパーサを利用することが望ましいでしょう。参考までに「json.orgで公開されているJSONパーサ(http://www.json.org/json2.js)」を使ってJSONを読み込む例をリスト7に示します(図3)。

リスト7のJSON.parse()メソッドは最終的にはeval()関数でJavaScriptオブジェクトへの変換を行いますが、変換前に引数で渡されたJSONテキストがJSONの仕様に従っているかどうかをチェックし、不正なデータの場合は例外を投げます。

上記の例ではcatch節で例外の詳細メッセージをダイアログで表示していますが、実際のアプリケーションでは状況に応じて適切な例外処理を行うようにしましょう。

Show More

Thực tế làm sao để dùng đượcJSON trong JavaScript?

Ví dụ về phân tích một chuỗi định dạng JSON với hàm eval () và chuyển nó sang một đối tượng JavaScript được hiển thị trong List6 (Hình 3).

Các đối tượng và mảng JSON cũng có thể được tham chiếu bằng cách sử dụng các array, properties of object JavaScript.

Trong List6, JSON được chuyển đổi thành JavaScript bằng hàm eval (), nhưng vì hàm eval () có thể thực thi mã JavaScript tùy ý, nên nếu dữ liệu JSON được đánh giá là độc hại, sẽ xảy ra các vấn đề về bảo mật.

Vì vậy, trong thực tế kỳ vọng vào việc sử dụng parse để convert thành object javascript sau khi parse JSON. Để tham khảo, List7 cho thấy một ví dụ về việc đọc JSON bằng cách sử dụng “JSON PARSE (http://www.json.org/json2.js)” được xuất bản trên json.org (Hình 3).

Phương thức JSON.parse () trong List7 cuối cùng chuyển thành đối tượng JavaScript với hàm eval () nhưng kiểm tra xem văn bản JSON đã được truyền như một đối số phù hợp với đặc tả JSON trước khi chuyển đổi, Nếu đó là dữ liệu bất hợp pháp sẽ throw exeption.

Trong ví dụ trên, thông báo chi tiết exeption được hiển thị trong hộp thoại của phần Catch, nhưng đối với các ứng dụng thực tế, hãy xử lý việc throw exeption thích hợp tùy thuộc vào tình huống.

図3:JavaScriptでのJSONの各利用例(クリックで拡大)

JSONを生成する

AjaxアプリケーションではJSONデータを受信するだけでなく、JavaScriptからXMLHttpRequestでJSONデータを送信することもあります。

先ほど紹介したJSONパーサではJSONをJavaScriptのオブジェクトに変換するだけでなく、リスト8のコード例が示すように、JavaScriptのオブジェクトをJSONに変換することもできます(図3)。

なお、実際にAjaxアプリケーションを開発する際は今回紹介したような単体のJSONパーサよりも「prototype.js(http://prototypejs.org/)」などの高機能なライブラリを使用することの方が多いでしょう。

今回はJSONの基礎知識と利用シーン、JavaScriptからの利用方法について簡単に解説しました。

本記事でも述べたとおり、JSONはAjaxのデータフォーマットのほか、JavaScriptに限らずさまざまな言語で利用可能な汎用データフォーマットとしても利用されはじめています。

次回は実際にJSONを使用したAjaxアプリケーションを開発していきます。

Show More

Không chỉ để nhận được dữ liệu JSON trong ứng dụng Ajax, bạn có thể muốn gửi một dữ liệu JSON trong XMLHttpRequest từ JavaScript.

Trong JSON PARSE vừa được giới thiệu không chỉ để chuyển đổi JSON thành JavaScript object, mà như ví dụ code của List8, bạn cũng có thể chuyển đổi một JavaScript object thành JSON (Hình. 3).

Cần lưu ý rằng, trên thực tế thì khi phát triển các ứng dụng Ajax, đa số dùng thư viện với tính năng cao (vd :”prototype.js (http://prototypejs.org/)”), hơn là việc chỉ dùng JSON PARSE.

Lần này tôi đã giải thích cho các bạn hiểu về mối liên hệ giữa JSON cũng như JavaScript một cách đơn giản nhất có thể.

Như đã đề cập trong bài viết này, ngoài việc nó là data format của Ajax, JSON có thể được dùng trong nhiều ngôn ngữ khác chứ không chỉ giới hạn trong phạm vi Javascript.

Lần tới tôi sẽ phát triển một ứng dụng Ajax thực sự sử dụng JSON.

https://thinkit.co.jp/article/70/1?page=0%2C2

Rate this post
[IT読解] Bài 6 : JSON là khỉ gì
Nếu thấy hay thì đừng ngại

Nếu không thích comment bằng facebook chỉ cần nhập tên rồi bình luận ở đây

Be the First to Comment!

avatar
wpDiscuz