What JSON input does the JSON Table Viewer accept?

The tool accepts a JSON array of objects. Each element in the array becomes a table row, and the keys of the objects become column headers. Nested objects are automatically flattened using dot notation — for example, { "address": { "city": "London" } } produces a column named "address.city". Arrays inside objects are displayed as their JSON string representation.

How are columns determined when objects have different keys?

Columns are the union of all keys found across every object in the array. If a row is missing a key that other rows have, the corresponding cell is left empty. This means you can safely mix records with slightly different shapes and still get a complete, readable table.

How does the sort feature work?

Click any column header to sort the table by that column in ascending order. Click the same header again to switch to descending order. Sorting is purely client-side and never modifies your original JSON. A chevron icon next to the active column header shows the current sort direction.

How do I copy the table as CSV?

Click the "Copy as CSV" button below the table. It serialises the current sorted view — including the header row — to CSV format and copies it to your clipboard. You can then paste it directly into Excel, Google Sheets, or any text editor.

نمایشگر جدول JSON

5 ردیف‌ها

8 ستون‌ها

ورودی JSON

[
  {
    "id": 1,
    "name": "Alice Johnson",
    "email": "alice@example.com",
    "role": "admin",
    "address": {
      "city": "New York",
      "country": "US"
    },
    "age": 32,
    "active": true
  },
  {
    "id": 2,
    "name": "Bob Smith",
    "email": "bob@example.com",
    "role": "editor",
    "address": {
      "city": "London",
      "country": "GB"
    },
    "age": 28,
    "active": true
  },
  {
    "id": 3,
    "name": "Carol White",
    "email": "carol@example.com",
    "role": "viewer",
    "address": {
      "city": "Paris",
      "country": "FR"
    },
    "age": 35,
    "active": false
  },
  {
    "id": 4,
    "name": "David Lee",
    "email": "david@example.com",
    "role": "editor",
    "address": {
      "city": "Tokyo",
      "country": "JP"
    },
    "age": 41,
    "active": true
  },
  {
    "id": 5,
    "name": "Eva Martinez",
    "email": "eva@example.com",
    "role": "admin",
    "address": {
      "city": "Berlin",
      "country": "DE"
    },
    "age": 29,
    "active": false
  }
]

جدول (5 ردیف‌ها, 8 ستون‌ها)

id	name	email	role	address.city	address.country	age	active
1	Alice Johnson	alice@example.com	admin	New York	US	32	true
2	Bob Smith	bob@example.com	editor	London	GB	28	true
3	Carol White	carol@example.com	viewer	Paris	FR	35	false
4	David Lee	david@example.com	editor	Tokyo	JP	41	true
5	Eva Martinez	eva@example.com	admin	Berlin	DE	29	false

جزئیات فنی

مبدل JSON به جدول چگونه کار می‌کند

این ابزار چه کاری انجام می‌دهد

مبدل JSON به جدول، یک آرایهٔ JSON از آبجکت‌ها را به‌صورت یک جدول HTML قابل مرتب‌سازی و فیلتر نمایش می‌دهد. این ابزار به‌طور خودکار سرستون‌ها را از کلیدهای آبجکت استخراج می‌کند، آبجکت‌های تو در تو را به ستون‌هایی با نشانه‌گذاری نقطه‌ای (dot-notation) تخت می‌کند و داده را در نمایی آشنا شبیه صفحه‌گسترده ارائه می‌دهد. این کار باعث می‌شود بتوانید دادهٔ JSON ساخت‌یافته را بدون وارد کردن آن به پایگاه‌داده یا برنامهٔ صفحه‌گسترده، به‌راحتی به‌صورت بصری مرور، مرتب و جست‌وجو کنید.

موارد استفادهٔ رایج برای توسعه‌دهندگان

توسعه‌دهندگان از این ابزار برای مشاهدهٔ سریع آرایه‌های پاسخ API، بررسی نتایج کوئری پایگاه‌داده که به‌صورت JSON خروجی گرفته شده‌اند، یا مرور داده‌های پیکربندی استفاده می‌کنند. این ابزار به‌ویژه برای مرور آرایه‌های بزرگ بازگشتی از endpointهای REST، مقایسهٔ رکوردها کنار هم، و پیدا کردن مقادیر گمشده یا غیرعادی در دیتاست‌ها مفید است. مهندسان QA از آن برای اطمینان از اینکه خروجی‌های انبوه داده شامل فیلدها و مقادیر مورد انتظار هستند، بدون نوشتن اسکریپت استفاده می‌کنند.

قالب‌ها، نوع‌ها یا گونه‌های داده

این ابزار انتظار دارد یک آرایهٔ JSON از آبجکت‌ها دریافت کند که هر آبجکت نمایندهٔ یک ردیف است. آبجکت‌هایی با کلیدهای ناهمگون با ایجاد ستون برای همهٔ کلیدهای یکتای موجود در همهٔ ردیف‌ها مدیریت می‌شوند و در جایی که کلیدی وجود ندارد، سلول خالی نمایش داده می‌شود. آبجکت‌های تو در تو با استفاده از نشانه‌گذاری نقطه‌ای تخت می‌شوند (مثلاً address.city به یک سرستون تبدیل می‌شود). آرایه‌های داخل مقادیر به‌صورت رشته‌های جداشده با کاما نمایش داده می‌شوند. آرایه‌های اولیه (primitive) که عنصر آبجکت ندارند به‌عنوان ورودی جدول پشتیبانی نمی‌شوند.

دام‌های رایج و حالت‌های لبه‌ای

آبجکت‌های بسیار عمیقِ تو در تو هنگام تخت‌سازی، سرستون‌هایی تولید می‌کنند که طولانی و سخت‌خوان هستند. آرایه‌هایی که انواع ترکیبی دارند (برخی عناصر آبجکت هستند و برخی اولیه) ممکن است چیدمان ستون‌های غیرمنتظره ایجاد کنند. دیتاست‌های بزرگ با هزاران ردیف می‌توانند رندر مرورگر را کند کنند — در چنین مواردی، قبل از چسباندن داده، صفحه‌بندی را در نظر بگیرید. آبجکت‌هایی با کلیدهایی که فقط در بزرگی/کوچکی حروف تفاوت دارند (مثلاً 'Name' در برابر 'name') ستون‌های جداگانه ایجاد می‌کنند که ممکن است کاربران را سردرگم کند.

چه زمانی از این ابزار استفاده کنیم در برابر کُد

برای بررسی بصری سریع آرایه‌های JSON در حین توسعه و دیباگ، از این ابزار مرورگری استفاده کنید. برای رندر برنامه‌نویسی جدول در برنامه‌ها، از کتابخانه‌هایی مانند ag-Grid، TanStack Table یا نمایش pandas DataFrame استفاده کنید. برای کاوش داده در مقیاس بزرگ، ابزارهایی مانند DuckDB یا jq همراه با ابزارهای قالب‌بندی ستونی می‌توانند میلیون‌ها رکورد را مدیریت کنند؛ چیزی که در یک تب مرورگر عملی نیست.