کار با JSON در جاوا اسکریپت - وب سایت رضا احمدی

استفاده از json در جاوا اسکریپت

کار با JSON در جاوا اسکریپت

در این مقاله کار با داده های جی سان ( JSON ) را در جاوا اسکریپت بررسی میکنیم و شیوه استفاده از آن را می بینیم.

JSONچیست؟

json یک فرمت عمومی که در زبان های مختلف میتونیم ازش برای ارائه دادن مقادیر و اشیا استفاده کنیم. این فرمت در ابتدا برای زبان جاوا اسکریپت ب وجود اومد اما الان زبان های زیادی از اون پشتیبانی میکنند برای مثال اگر سرور شما به زبان php/java/ruby/… نوشته شده باشد از طریق جی سان می تونید تبادل اطلاعات با کاربری که جاوا اسکریپ را استفاده میکند و سرور را به راحتی انجام دهید.

متدهای کاربردی برای کار با JSON :

دوتا از مهم ترین متدها را می توان stringify و parse نام برد که کاربرد هر کدام به شرح زیر است:
JSON.stringify این متد برای تبدیل یک شی از نوع جاوا اسکریپت به یک شی از نوع جی سان استفاده میکنیم.
JSON.parse این متد داده های جی سان را به اشیا قابل فهم در جاوا اسکریپت تبدیل میکند.

JSON.stringify

  1. let student = {
  2.   name: 'John',
  3.   age: 30,
  4.   isAdmin: false,
  5.   courses: ['html', 'css', 'js'],
  6.   wife: null
  7. };
  8.  
  9. let json = JSON.stringify(student);
  10.  
  11. alert(typeof json); // we've got a string!
  12.  
  13. alert(json);
  14. /* JSON-encoded object:
  15. {
  16.   "name": "John",
  17.   "age": 30,
  18.   "isAdmin": false,
  19.   "courses": ["html", "css", "js"],
  20.   "wife": null
  21. }
  22. */

برای مثال در کد بالا یک شی بنام student ایجاد شده که از طریق متد JSON.stringify این شی به یک داده از نوع جی سان تبدیل شده همان طور که می بینید اگر نوع این داده را ببینید مقدار string برگشت داده می شود و اگر خود این رشته را بخواهیم مشاهده کنیم همانند خط 13 پیغام زیر نمایش داده میشود:

JSON-encoded object: { “name”: “John”, “age”: 30, “isAdmin”: false, “courses”: [“html”, “css”, “js”], “wife”: null }

همانطور که مشاهده میکنید متغییر name مقدار رشته ای john و متغییر age مقدار صحیح 30 و متغییر isAdmin مقدار بولین false و متغییر courses یک ارایه دارای سه عضو نسب داده شده و در نهایت متغییر wife مقدار null نسبت داده شده.

در JSON انوع داده ای که پشتیبانی می شود به شرح زیر است:

  • Objects { ... }
  • Arrays [ ... ]
  • Primitives:
    • strings,
    • numbers,
    • boolean values true/false,
    • null.

به مثال زیر دقت کنید در این مثال یک جی سان تعریف شده که یک عضو آن شی room است که از نوع یک داده جی سان می باشد. پس اشیا را میتوان تو در تو تعریف کرد.

  1. let meetup = {
  2.   title: "Conference",
  3.   room: {
  4.     number: 23,
  5.     participants: ["john", "ann"]
  6.   }
  7. };
  8.  
  9. alert( JSON.stringify(meetup) );
  10. /* The whole structure is stringified:
  11. {
  12.   "title":"Conference",
  13.   "room":{"number":23,"participants":["john","ann"]},
  14. }
  15. */

JSON.parse

برای اینکه یک رشته (داده) جی سان را به اشیا جاوا اسکریپت تبدیل کنیم از این متد استفاده میکنیم:

let value = JSON.parse(str, [reviver]);

به مثال زیر دقت کنید:

  1. let userData = '{ "name": "John", "age": 35, "isAdmin": false, "friends": [0,1,2,3] }';
  2.  
  3. let user = JSON.parse(userData);
  4.  
  5. alert( user.friends[1] ); // 1
  6. alert(user.name);// Jhon

در مثال بالا داده userData را از یک سرور مثلا دریافت کرده ایم برای قابل فهم شدن این داده و تبدیل به یک شی از دستور JSON.parse استفاده شده و همانطور که می بینید شی یوزر ایجاد شده که میتوان به راحتی به اعضای آن دسترسی پیدا کرد.

تجدید نظر در یک شی چگونه صورت می پذیر؟

let str = '{"title":"Conference","date":"2017-11-30T12:00:00.000Z"}';

برای مثال داده بالا را در نظر بگیرید اگر با دستور JSON.parse داده بالا را تبدیل کنیم متد date حاوی یک رشته می شود که ب خودی خود هیچ مفهومی برای جاوا اسکریپت ندارد که این یک نوع داد از کلاس Date است( شی Date نوع داده در جاوا اسکریپت است که میتوان تاریخ و زمان را در آن ذخیره کرد )

برای حل مشکل میتوان به صورت زیر عمل کرد:

  1. let str = '{"title":"Conference","date":"2017-11-30T12:00:00.000Z"}';
  2.  
  3. let meetup = JSON.parse(str, function(key, value) {
  4.   if (key == 'date') return new Date(value);
  5.   return value;
  6. });
  7.  
  8. alert( meetup.date.getDate() );

در کد بالا مقدار رشته str به متد JSON.parse پاس داده شده و در یک تابع بررسی می شود که نام اشیا و مقادیرشان چیست اگر این شی date نام داشت مقدار یک داده به نوع Date تبدیل و برگشت داده می شود و برای سایر اعضا هر مقداری که داشتند برگشت داده می شود.

منبع این مقاله : https://javascript.info/json

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دیدگاه های ثبت شده

تا کنون دیدگاهی ثبت نشده است.