JSON Stringifyの例–JSを使用してJSONオブジェクトを解析する方法

プログラミング言語は非常に多く、すべての言語には独自の機能があります。しかし、それらすべてに共通することが1つあります。それは、データを処理することです。単純な計算機からスーパーコンピューターまで、それらはすべてデータを処理します。

それは人間の場合も同じです。各コミュニティには、非常に多くの国、非常に多くの文化、そして非常に多くの知識があります。

しかし、他のコミュニティと通信するには、人々は共通の媒体を必要とします。言語は人間にとって、JSONはプログラミングにとって、データ転送の一般的な媒体です。

JSONとは何ですか?

JSONの略J AVA S CRIPT O bject Nのotation。したがって、JSONを理解する前に、JavaScriptのオブジェクトを理解しましょう。

すべてのプログラミング言語には、同様のデータを一緒に保存する方法があります。たとえば、Cでは、これらは構造体と呼ばれます。

JavaScriptでは、オブジェクトはキーと値のペアのコレクションであり、値は任意の変数(数値、文字列、ブール値)、別のオブジェクト、または関数にすることができます。オブジェクトは、オブジェクト指向プログラミングで非常に役立ちます。

オブジェクト指向プログラミングは、「オブジェクト」の概念に基づくプログラミングパラダイムであり、フィールドの形式でデータを、プロシージャの形式でコードを含めることができます。

例を見てみましょう。

JavaScriptでは、オブジェクトは中括弧を使用して定義されます。次に例を示します。

var obj = {};

ここにobj、空のオブジェクトがあります。次に、コンストラクターを使用してオブジェクトを作成することもできます。

function Student(name, roll_number, age) { this.name = name; this.roll_number = roll_number; this.age = age; } var student1 = new Student("Abhishek", "123", 18); console.log(student1.name, student1.roll_number, student1.age);

これにより、出力が得られますAbhishek 123 18

これは、JavaScriptでオブジェクトを作成する方法です。ただし、これらのオブジェクトは、JavaScriptにのみ固有の変数です。

これらのオブジェクトをエクスポートして、たとえばサーバーに送信する場合は、それらをエンコードするメソッドが必要です。それがどのように行われるか見てみましょう。

JSON Stringify

あるデバイスから別のデバイスに、ある言語から別の言語にデータを送信するには、構造化された、統一された、明確に定義された規則が必要です。

JSONはJSオブジェクトに基づいていますが、特定の条件が有効である必要があります。幸いなことに、これらの条件について心配する必要はありません。JavaScriptには、というメソッドがあるためJSON.stringify()です。

このメソッドは、JSオブジェクトを、データを失うことなくどこにでも送信できるエンコードされた文字列に変換するために使用されます。

任意のオブジェクトを文字列にエンコードしてどこにでも送信できるのは魔法のように思えるかもしれません。いくつかの例を通して、それをより深く理解しましょう。

これはstringifyメソッドのプロトタイプです。

JSON.stringify(value[, replacer[, space]])

最初のパラメータはvalue、文字列化するオブジェクトです。2番目と3番目のパラメーターはオプションであり、エンコード方法(セパレーターやインデントなど)をカスタマイズする場合に使用できます。

上記の例を文字列化してみましょう。

function Student(name, roll_number, age) { this.name = name; this.roll_number = roll_number; this.age = age; } var student1 = new Student("Abhishek", "123", 18); var str = JSON.stringify(student1); console.log(str);

これにより、出力が得られます{"name":"Abhishek","roll_number":"123","age":18}

オプションのパラメータを使用する場合、つまり、に置き換えるJSON.stringify(student1)JSON.stringify(student1, null, 2)、次のようになります。

{ "name": "Abhishek", "roll_number": "123", "age": 18 }

これらを使用して、JSONを読み取り可能な形式で印刷できます。それでは、もう1つの例を試してみましょう。

ここでは、オブジェクトメソッドを使用します。オブジェクトメソッドは、上記の例のメソッドを使用して、そのオブジェクトで呼び出すことができるオブジェクト内の関数です。

function Student(name, roll_number, age) { this.name = name; this.roll_number = roll_number; this.age = age; this.print = function() { console.log(this.name, this.roll_number, this.age); } } var student1 = new Student("Abhishek", "123", 18); student1.print();

これにより、最初の例と同じ出力、つまりAbhishek 123 18

オブジェクトメソッドを使用して、オブジェクトに関連付けられた関数を実行し、オブジェクトのプロパティを使用できます。このオブジェクトを文字列化してみましょう。

function Student(name, roll_number, age) { this.name = name; this.roll_number = roll_number; this.age = age; this.print = function() { console.log(this.name, this.roll_number, this.age); } } var student1 = new Student("Abhishek", "123", 18); var str = JSON.stringify(student1); console.log(str);

それでも同じ出力が得られます{"name":"Abhishek","roll_number":"123","age":18}

したがって、オブジェクトメソッドはstringify関数によって無視されます。それらも送信したい場合は、最初に文字列に変換する必要があります。

たとえば、呼び出しstudent1.print = student1.print.toString()てから文字列化することができます。次に、次のようなものが得られます。

{"name":"Abhishek","roll_number":"123","age":18,"print":"function() {\n    console.log(this.name, this.roll_number, this.age);\n  }"}

別のオブジェクトについて考えてみましょう。

var obj = {}; obj.key1 = "value1"; obj.key2 = obj; var str = JSON.stringify(obj); console.log(obj);

これにより、というエラーがスローされますUncaught TypeError: Converting circular structure to JSON

これは、key2がobjを参照しているために発生します。このようなオブジェクトは循環オブジェクトと呼ばれ、JSON文字列に変換することはできません。

ここで、2番目のパラメーターが役立ちます。ここではどのように機能するかについては説明しませんが、このMDNページで解決策を見つけることができます。

これがJSONのエンコード方法です。次に、JSON文字列を解析する方法を見てみましょう。

JSON解析

JavaScriptにJSONを文字列化する関数があるのと同じように、文字列化されたJSONを解析する関数もあります。これは関数プロトタイプです:

JSON.parse(text[, reviver])

ここで、最初のパラメーターは、解析する必要のあるJSON文字列です。2番目のパラメーターはオプションであり、戻る前に解析されたJSONを変更する関数にすることができます。例を使用してこの方法を示しましょう。

function Student(name, roll_number, age) { this.name = name; this.roll_number = roll_number; this.age = age; } var student1 = new Student("Abhishek", "123", 18); var str = JSON.stringify(student1); var parsedJSON = JSON.parse(str); console.log(parsedJSON,name. parsedJSON.roll_number, parsedJSON.age);

そして、出力はになりますAbhishek 123 18ので、JSON文字列は正常に解析されました。

You could use this to send data from client to server. The data to be sent can be JSON encoded at the client and the stringified JSON will be parsed at the server and processed. This makes it really easy.

JSON can also be used to transmit data across different programs written in different languages. All languages have libraries to stringify and parse JSON.

JSON vs. XML

XML or eXtensible Markup Language is a very popular way of storing and transmitting data, similar to JSON. It existed before JSON and is still widely used today.

For example, it's used in RSS feeds, which are still the most popular way of subscribing to some publication or author. There are also XML sitemaps which are a list of all pages on a website. And search engines use them to see if there are any new pages to be crawled.

XML uses markup format – similar to HTML but much stricter.

JSON and XML have various similarities and differences, as explained in the following points:

  • Both are human-readable
  • Both have a hierarchial structure
  • Both are widely supported across various programming languages
  • Both can be fetched from the server using HTTP requests
  • JSON is shorter than XML
  • JSON can use arrays
  • JSON can be parsed using standard JavaScript functions, whereas XML needs to be parsed using the XML DOM (which is slower)

The same data can be expressed in JSON and XML as follows:

JSON:

{"employees":[ { "firstName":"Quincy", "lastName":"Larson" }, { "firstName":"Abigail", "lastName":"Rennemeyer" }, { "firstName":"Abhishek", "lastName":"Chaudhary" } ]}

XML:

  Quincy Larson   Abigail Rennemeyer   Abhishek Chaudhary  

JSONは多くの理由でXMLよりも優れていますが、それはXMLを放棄する必要があるという意味ではありません。それでも、JSONは将来的に好ましいデータ転送形式になるでしょう。

JWT-JSONの未来

JSON Web Token(JWT)は、当事者間で情報をJSONオブジェクトとして安全に送信するためのコンパクトで自己完結型の方法を定義するオープンスタンダードです。

この情報はデジタル署名されているため、検証および信頼できます。JWTは、シークレット(HMACアルゴリズムを使用)またはRSAまたはECDSAを使用した公開鍵と秘密鍵のペアを使用して署名できます。

これらのトークンを使用して、JSONデータに署名し、送信者のIDを確認できます。データは署名されているため、データが改ざんされている場合は、すぐにわかります。

Though we won't discuss the implementation in full here, we can understand how it works. A JSON Web Token consists of three parts, the header, the payload and the signature.

The header consists of the type of token and algorithm used, the payload consists of the data, and the signature is the value you get when you sign the header and payload together.

The final token is in the form of ...

These tokens are currently used in authorization and are faster and more compact than other authorization methods. These may be very useful in the future and their potential is very high.

Conclusion

In this article, we've seen the importance of JSON as a medium of data transfer between completely different systems, and why is it so convenient.

JSON is a universal medium and is not just specific to JavaScript. JSON is already used in NoSQL databases to store data in JSON format.

We also compared JSON and XML and saw why JSON is more efficient and faster than XML. In the future, we may develop even better ways of transmitting data.

The rate at which the internet is growing, efficient data transfer will be the highest priority. And JSON serves that function really well for now.

You can try new things with JSON and implement different data structures – it's open to innovation, and we should never stop experimenting.

Hope you liked my article. I have learned a lot by writing it, and your appreciation motivates me everyday, Do visit my internet home theabbie.github.io.