ホームページ > 記事 > ウェブフロントエンド > JSON.stringify のあまり知られていない使用法
JSON.stringify のあまり知られていない使用法
- 青灯夜游転載
- 2019-11-30 17:39:123028ブラウズ
JS には一般的な関数がたくさんあります。私たちはそれらを毎日使用するかもしれませんが、追加の関数のいくつかは知りません。 JSON.stringify という関数がありますが、今日はその特別な使い方を見てみましょう。
#基本
##JSON.stringify メソッドは変数を受け取ります。 JSON表現に変換されます。 <pre class="brush:php;toolbar:false">const boy = {
name: 'John',
age: 23
};
JSON.stringify(boy);
// {"name":"John","age":23}</pre>JSON は純粋な文字列であり、本質的には JS のサブセットであるため、すべての JS オブジェクトを JSON に変換できるわけではありません:
const boy = {
name: 'John',
age: 23,
hobbies: new Map([[0, 'coding'], [1, 'earn money']])
}
JSON.stringify(boy)
// {"name":"John","age":23,"hobbies":{}}
上記の例では、Map オブジェクトは次のようになります。無視され、通常のオブジェクトに変換されます。属性が関数の場合、この属性は無視されます。興味のある学生は試してみてください。
2 番目のパラメータ
JSON.stringify は、 replacer と呼ばれる 2 番目のパラメータを受け取ることができます。 交換者。 文字列配列を渡すと、ホワイトリストと同様に、この配列内のプロパティのみが変換されます。
const boy = {
name: 'John',
age: 23
}
JSON.stringify(boy, ['name'])
// {"name":"John"}
この機能を使用すると、変換する必要がある属性のみを変換し、長い配列やエラー オブジェクトなどを除外できます。
この
replacer パラメーターは関数を受け取ることもできます。この関数はオブジェクト全体を反復処理してキーと値を渡し、それらを置き換える方法を決定できます。 <pre class="brush:php;toolbar:false">const boy = {
name: 'John',
age: 23,
hobbies: new Map([[0, 'coding'], [1, 'earn money']])
}
JSON.stringify(boy, (key, value) => {
if (value instanceof Map) {
return [...value.values()]
}
return value
})
// {"name":"John","age":23,"hobbies":["coding","earn money"]}</pre>また、
を返すと (null を返すことは受け入れられません)、この属性は削除されます: <pre class="brush:php;toolbar:false">JSON.stringify(boy, (key, value) => {
if (typeof value === 'string') {
return undefined
}
return value
})
// {"age":23,"hobbies":{}}</pre>
3 番目のパラメーターspace
は、変換された JSON 文字列の間隔を制御します。パラメータが数値の場合、スペースの数がインデントされます:
JSON.stringify(boy, null, 2)
// {
// "name": "John",
// "age": 23,
// "hobbies": {}
// }パラメータが文字列の場合、インデントはスペースの数になります:
JSON.stringify(boy, null, '--')
// {
// --"name": "John",
// --"age": 23,
// --"hobbies": {}
// } toJSON メソッド変換するオブジェクトに toJSON
メソッドがある場合、シリアル化のプロセスをカスタマイズできます。オブジェクトをシリアル化する代わりに、メソッドから新しい値を返すことができます。この値は、元のオブジェクトの代わりにシリアル化されます。const boy = {
name: 'John',
age: 23,
hobbies: new Map([[0, 'coding'], [1, 'earn money']]),
toJSON() {
return {
name: `${this.name} (${this.age})`,
favorite: this.hobbies.get(0)
}
}
}
JSON.stringify(boy)
// {"name":"John (23)","favorite":"coding"}
面白くないですか？場合によっては、いくつかのドキュメントを注意深く読むことが役立つことがあります~参考記事元のアドレス: https:// mp .weixin.qq.com/s/_e83_G7RjVt2eR_ro7blOA
- MDN：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON / stringify
- この記事は js チュートリアル
以上がJSON.stringify のあまり知られていない使用法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。