مقدمه

در دنیای وب، داده‌ها اغلب به صورت متنی و ساختاریافته بین سرور و کلاینت رد و بدل می‌شوند. رایج‌ترین فرمت برای این کار JSON (JavaScript Object Notation) است. JSON یک فرمت متنی، ساده و قابل خواندن برای انسان و ماشین است که به شما امکان می‌دهد داده‌ها را به راحتی ذخیره، ارسال یا دریافت کنید. تقریباً تمام APIهای مدرن وب از JSON برای تبادل داده استفاده می‌کنند و تسلط بر این فرمت و روش‌های تبدیل آن در جاوااسکریپت بسیار مهم است.

JSON چیست؟

فرمت JSON (مخفف JavaScript Object Notation) یک روش سبک و ساختارمند برای ذخیره و تبادل داده‌ها است که به صورت متنی و قابل خواندن برای انسان طراحی شده است. JSON ابتدا بر پایه ساختار آبجکت‌ها و آرایه‌های زبان جاوااسکریپت شکل گرفت، اما امروزه تقریباً در تمام زبان‌های برنامه‌نویسی پشتیبانی می‌شود و کاربرد فراوانی در ارتباطات نرم‌افزاری، خصوصاً APIها و وب‌سرویس‌ها دارد. داده‌های JSON به صورت جفت‌های کلید-مقدار (key-value) و آرایه‌ای از مقادیر مختلف (مانند عدد، رشته، بولین، لیست و آبجکت) نمایش داده می‌شوند.

در یک فایل یا رشته‌ی JSON، داده‌ها معمولاً با دو ساختار اصلی سازمان‌دهی می‌شوند: آبجکت که با آکولاد ({}) مشخص می‌شود و مجموعه‌ای از جفت کلید-مقدار را در بر دارد، و آرایه که با براکت ([]) نشان داده می‌شود و لیستی از مقادیر را شامل می‌گردد. به عنوان مثال، یک آبجکت ساده می‌تواند به شکل زیر باشد:

                        
{
  "name": "Ali",
  "age": 30,
  "skills": ["JavaScript", "Python", "HTML"]
}
                        
                    

مقدار هر کلید می‌تواند یک مقدار ساده (مثل عدد یا رشته)، یا یک آرایه یا حتی یک آبجکت دیگر باشد.

یکی از ویژگی‌های مهم JSON، سادگی و قابلیت انتقال آن بین سیستم‌ها و زبان‌های مختلف است. خواندن و تولید داده با این فرمت، هم برای انسان‌ها آسان است و هم برای ماشین‌ها. به همین دلیل، JSON به عنوان فرمت استاندارد برای تبادل داده در بسیاری از پروژه‌های وب، موبایل و حتی نرم‌افزارهای دسکتاپ مورد استفاده قرار می‌گیرد. علاوه بر این، بیشتر کتابخانه‌ها و فریم‌ورک‌های برنامه‌نویسی امکانات مناسبی برای تجزیه (parse) و تولید (serialize) داده‌های JSON فراهم کرده‌اند.

تبدیل شیء به JSON با JSON.stringify

متد JSON.stringify شیء یا آرایه را به یک رشته متنی با فرمت JSON تبدیل می‌کند. این رشته را می‌توانید ذخیره، ارسال یا در فایل بنویسید. توجه داشته باشید که فقط مقادیر قابل تبدیل (عدد، رشته، آرایه، شیء و ...) باقی می‌مانند؛ مقادیر undefined، تابع و Symbol نادیده گرفته می‌شوند.

Copy Icon JAVASCRIPT
let user = { name: "Ali", age: 25 };
let json = JSON.stringify(user);
console.log(json); // '{"name":"Ali","age":25}'

اگر آرایه یا شیء تو در تو داشته باشید، کل ساختار به صورت آبشاری تبدیل می‌شود. برای خوانایی بیشتر می‌توانید آرگومان‌های اضافی به stringify بدهید تا خروجی مرتب و قابل خواندن شود. در ادامه، دو آرگومان کاربردی متد stringify را معرفی می‌کنیم و کاربرد آنها را می‌بینیم.

کنترل بیشتر روی تبدیل داده با آرگومان replacer

replacer یکی از آرگومان‌های متد JSON.stringify است که به ما اجازه می‌دهد کنترل بیشتری روی تبدیل داده به فرمت JSON داشته باشیم. این آرگومان می‌تواند به صورت یک آرایه و یا به صورت یک تابع به متد پاس شود. اگر یک آرایه از کلیدها (نام‌های پراپرتی‌ها) به عنوان replacer بدهید، فقط همان کلیدها در خروجی JSON لحاظ می‌شوند و بقیه کلیدها نادیده گرفته می‌شوند. مثال زیر را ببینید.

Copy Icon JAVASCRIPT
const user = {
  name: "Sara",
  age: 25,
  password: "1234"
};
console.log(JSON.stringify(user, ["name", "age"]));

در اینجا فثط پراپرتی‌های name و age به خروجی می‌روند و پراپرتی password نادیده گرفته می‌شود.

اما اگر یک تابع به عنوان replacer به متد stringify بدهیم، این تابع هنگام تبدیل هر مقدار فراخوانی می‌شود و می‌تواند مقدار را تغییر دهد، یا حتی بعضی از کلیدها را از خروجی حذف کند (با بازگرداندن undefined). تابع دو پارامتر می‌گیرد: کلید (key) و مقدار (value). به مثال زیر نگاه کنید.

Copy Icon JAVASCRIPT
const user = {
  name: "Sara",
  age: 25,
  password: "1234"
};
function replacer(key, value) {
  if (key === "password") return undefined;
  return value;
}
console.log(JSON.stringify(user, replacer));

پس، آرگومان replacer کمک می‌کند تا خروجی JSON را مطابق نیاز خود، فیلتر یا شخصی‌سازی کنیم؛ یا حتی ساختار داده را قبل از تبدیل دستکاری کنیم. این ویژگی مخصوصاً برای پنهان کردن اطلاعات حساس یا حذف داده‌های غیر ضروری هنگام ارسال اطلاعات به سرور یا ذخیره‌سازی کاربرد دارد.

افزایش خوانایی خروجی با آرگومان space

گاهی اوقات می‌خواهید خروجی JSON را طوری قالب‌بندی کنید که خواندن آن برای انسان آسان‌تر باشد (مثلاً هنگام ذخیره در فایل یا نمایش برای کاربر). آرگومان سوم متد JSON.stringify با نام space تعداد فاصله (space) یا کاراکتر دلخواه برای تورفتگی هر سطح را تعیین می‌کند:

Copy Icon JAVASCRIPT
let user = { name: "Ali", age: 25, skills: ["JS", "HTML"] };
let pretty = JSON.stringify(user, null, 2);
console.log(pretty);

مقدار 2 باعث می‌شود هر سطح از ساختار JSON دو کاراکتر فاصله تورفتگی داشته باشد. می‌توانید به جای عدد، یک رشته (مثلاً \t برای TAB) نیز قرار دهید.

تبدیل JSON به شیء با JSON.parse

متد JSON.parse یک رشته متنی JSON را به یک شیء جاوااسکریپت تبدیل می‌کند. این متد وقتی کاربرد دارد که داده‌ای را از سرور دریافت می‌کنید یا فایل متنی را می‌خوانید و می‌خواهید آن را به شیء یا آرایه تبدیل کنید.

Copy Icon JAVASCRIPT
let text = '{"product":"Book","price":100}';
let obj = JSON.parse(text);
console.log(obj.product); // "Book"

دقت کنید که کلیدها و مقادیر در رشته JSON باید با دابل کوتیشن (" ") باشند و داده‌ها حتماً از قواعد JSON پیروی کنند.