কম্পিউটার টিউটোরিয়াল

JavaScript JSON: একটি গাইড

JSON, JavaScript Object Notation-এর সংক্ষিপ্ত রূপ, ডেটা স্টোর করার একটি উপায়। JSON অবজেক্টে, ভ্যালুগুলো লেবেল denen keys বলা হয় তাদের সাথে ম‍্যাপ করা থাকে। JSON অবজেক্ট যেকোনো ডেটা টাইপ স্টোর করতে পারে, স্ট্রিং, ইন্টিজার, এবং অন্যান্য JSON ভ্যালু সহ।

JSON একটি স্ট্যান্ডার্ড ফাইল ফরম্যাট যা আপনাকে ডেটা স্টোর এবং শেয়ার করতে দেয়। জাভাস্ক্রিপ্ট, পাইথন, এবং PHP-এর মতো প্রোগ্রামিং ল্যাঙ্গুয়েজ সবই JSON ডেটা ম্যানিপুলেট এবং পড়ার সমর্থন করে।

এই গাইডে, আমরা কীভাবে JavaScript JSON ব্যবহার করতে হয় তা এক্সপ্লোর করব। আমরা JSON ফরম্যাটের বেসিক্স এবং একটি JSON অবজেক্ট একটি জাভাস্ক্রিপ্ট অবজেক্টের সাথে কীভাবে তুলনা করা যায় তা এক্সপ্লোর করব।

JSON কী?

JSON ডেটা স্টোর এবং শেয়ার করার একটি মেথড। এটি জাভাস্ক্রিপ্ট অবজেক্ট সিনট্যাক্সের ওপর ভিত্তি করে তৈরি। পার্থক্য হলো JSON সম্পূর্ণরূপে টেক্সট-ভিত্তিক, য 받는 অবজেক্টগুলো নয়। JSON স্ট্যান্ডার্ড করে JavaScript Object Notation।

যদিও JSON জাভাস্ক্রিপ্ট প্রোগ্রামিং ল্যাঙ্গুয়েজের প্রিন্সিপলগুলোর ওপর ভিত্তি করে তৈরি, এটি PHP, Java এবং Ruby-এর মতো অন্যান্য অনেক ল্যাঙ্গুয়েজে ব্যবহার হয়।

আপনি JSON ডেটা একটি ফাইল হিসেবে বা একটি প্রোগ্রামে একটি ভ্যালু হিসেবে স্টোর করতে পারেন। উদাহরণস্বরূপ, একটি প্রোগ্রামে mtg_cards.json নামে একটি ফাইল থাকতে পারে যা Magic the Gathering কার্ডের একটি লিস্ট স্টোর করে। আমরা সেই ডেটাকে mtg_cards নামে একটি জাভাস্ক্রিপ্ট ভেরিয়েবলে স্টোর করতে পারি।

JSON-এ স্টোর করা ডেটার একটি টুকরোর স্ট্রাকচার:

{
  "card_name": "Black Lotus",
  "status": "banned",
  "card_type": "Mono Artifact"
  "mana": "0"
}

JSON ডেটা স্টোর করে key-value pair-এ ব্যবহার করে। Key-value pair হলো ডেটার টুকরো যেগুলো নিচের স্ট্রাকচার ব্যবহার করে: "key": "value"।

card_name একটি key-এর উদাহরণ। ভ্যালুগুলো কোলনের ডান পাশে থাকে। JSON-এ, আপনি key নামগুলো স্ট্রিং হিসেবে স্টোর করেন, কিন্তু ভ্যালুগুলো যেকোনো ডেটা টাইপ হতে পারে যেমন boolean বা ইন্টিজার।

JSON প্রায়শই APIs-এ ডেটা পাঠাতে ব্যবহৃত হয়। উদাহরণস্বরূপ, আপনি যদি Airtable বা Fitbit APIs ব্যবহার করেন। আপনাকে JSON ডেটা ফরম্যাটে ডেটা পাঠাতে এবং পড়তে হবে।

JavaScript JSON ডেটা কীভাবে অ্যাক্সেস করবেন

জাভাস্ক্রিপ্টে JSON ডেটা অ্যাক্সেস করতে, আপনি হয় স্কোয়ার ব্র্যাকেট বা ডট নোটেশন ব্যবহার করতে পারেন। স্কোয়ার ব্র্যাকেট নোটেশন একটি জাভাস্ক্রিপ্ট অ্যারে থেকে ভ্যালু রিট্রিভ করার মতো। ইন্ডেক্স পজিশন স্পেসিফাই করার বদলে, আপনি সেই key-এর নাম স্পেসিফাই করেন যার ভ্যালু আপনি রিট্রিভ করতে চান।

আমাদের আগের অবজেক্টটি বিবেচনা করুন, এখন JSON অবজেক্ট হিসেবে ফরম্যাট করা:

var black_lotus = {
  "card_name": "Black Lotus",
  "status": "banned",
  "card_type": "Mono Artifact",
  "mana": "0"
}

এই উদাহরণে, আমরা আমাদের JSON অবজেক্টকে black_lotus ভেরিয়েবলে অ্যাসাইন করেছি। ধরুন আপনি Black Lotus-এর কার্ড টাইপ জানতে চান। এটি ট্রেডিং কার্ড গেম Magic the Gathering-এ একটি ব্যান করা কার্ড।

স্কোয়ার ব্র্যাকেটস

স্কোয়ার ব্র্যাকেট নোটেশন ব্যবহার করে, আমরা Black Lotus কার্ডের কার্ড টাইপ বের করতে পারি।

এই নোটেশন ব্যবহার করতে, আমাদের সেই অবজেক্টের নাম স্পেসিফাই করতে হবে যেখান থেকে আমরা একটি ভ্যালু রিট্রিভ করতে চাই। তারপর, সেই ভ্যালুটির সাথে যুক্ত key-এর নাম স্পেসিফাই করি। আপনাকে key নামটি কোটেশন মার্ক এবং স্কোয়ার ব্র্যাকেটে এনক্লোজ করতে হবে।

নিচের কোড Black Lotus-এর কার্ড টাইপের ডেটা রিট্রিভ করে:

console.log(black_lotus["card_type"])

আমাদের কোড রিটার্ন করে: Mono Artifact। আমরা আমাদের key নাম ডাবল কোট করেছি, এটাকে স্কোয়ার ব্র্যাকেট দিয়ে ঘেরেছি, তারপর এটিকে black_lotus ভেরিয়েবলের শেষে অ্যাপেন্ড করেছি। এটি আমাদের card_type নামে স্টোর করা ডেটা অ্যাক্সেস করতে দেয়।

ডট নোটেশন

ডট নোটেশন হলো আপনি একটি অবজেক্ট অ্যাক্সেস করেন অবজেক্টের নাম স্পেসিফাই করে, তারপর একটি ডট। তারপর আপনি সেই key-এর নাম স্পেসিফাই করেন যার ভ্যালু আপনি অ্যাক্সেস করতে চান।

Black Lotus-এর কার্ড টাইপ ডট নোটেশন ব্যবহার করে অ্যাক্সেস করতে, আপনি এই কোডটি ব্যবহার করতে পারেন:

console.log(black_lotus.card_type)

আমাদের কোড রিটার্ন করে: "Mono Artifact"।

আমরা আমাদের অবজেক্টের নাম ("black_lotus") স্পেসিফাই করেছি, তারপর সেই key-এর নাম ("card_type") যার ভ্যালু আমরা অ্যাক্সেস করতে চাই।

JSON রূপান্তর (Conversion)

প্রায়শই, যখন আপনি একটি অবজেক্টের সাথে কাজ করছেন, আপনি সেটাকে একটি JSON স্ট্রিংএ রূপান্তর করতে চাবেন, অথবা তার বিপরীতে। এটি সাধারণ অভ্যাস যদি আপনি একটি ওয়েব সার্ভার জুড়ে ডেটা পাঠাতে চান।

JSON জাভাস্ক্রিপ্টের মতো টেকনোলজিতে ম্যানিপুলেট করা সহজ। একটি প্লেইন স্ট্রিং থেকে সব ভ্যালু এক্সট্রাক্ট করা খুব কঠিন হত।

প্রথমে, আপনি একটি অবজেক্টকে স্ট্রিংএ রূপান্তর করতে চাবেন যাতে আপনি সেটাকে সার্ভার জুড়ে পাঠাতে পারেন। তারপর আপনি সেটাকে আবার অবজেক্টে রূপান্তর করতে চাবেন যাতে আপনি ডেটাকে একটি অবজেক্টের মতো টรีট করতে পারেন।

একটি অবজেক্টকে JSON স্ট্রিংএ রূপান্তর করতে, আপনি JSON.stringify() ফাংশন ব্যবহার করতে পারেন। ধরুন আমরা আগের Black Lotus অবজেক্টকে একটি স্ট্রিংএ রূপান্তর করতে চাই। আমরা এই কোড ব্যবহার করে এটি করতে পারি:

var black_lotus = {
  "card_name": "Black Lotus",
  "status": "banned",
  "card_type": "Mono Artifact",
  "mana": "0"
}
var string_black_lotus = JSON.stringify(black_lotus)
console.log(string_black_lotus)

আমাদের কোড নিচের JSON টেক্সট রিটার্ন করে:

"{"card_name":"Black Lotus","status":"banned","card_type":"Mono Artifact","mana":"0"}"

আপনি দেখতে পাচ্ছেন, আমাদের JSON ডেটা একটি স্ট্রিং। আপনি JSON.parse() মেথড ব্যবহার করে এই স্ট্রিংকে আবার একটি JSON অবজেক্টে রূপান্তর করতে পারেন:

var black_lotus_object = JSON.parse(string_black_lotus)
console.log(black_lotus_object)

এই কোড রিটার্ন করে:

{
  "card_name": "Black Lotus",
  "status": "banned",
  "card_type": "Mono Artifact",
  "mana": "0"
}

আপনি দেখতে পাচ্ছেন, আমাদের ডেটা এখন একটি অবজেক্ট।

JSON vs JavaScript Object

JSON নোটেশন জাভাস্ক্রিপ্ট অবজেক্টের ওপর ভিত্তি করে তৈরি।

যেহেতু JSON একাধিক প্রোগ্রামিং ল্যাঙ্গুয়েজে সাপোর্ট করার জন্য ডিজাইন করা হয়েছিল, এটি একদম সাদা জাভাস্ক্রিপ্ট অবজেক্টের মতো নয়। উদাহরণস্বরূপ, JSON PHP এবং পাইথনে সাপোর্টেড। JSON সাপোর্ট করা প্রতিটি প্রোগ্রামিং ল্যাঙ্গুয়েজের নিজস্ব ইউনিক ইমপ্লিমেন্টেশন আছে।

যেখানে জাভাস্ক্রিপ্ট অবজেক্টে key-গুলো কোটেশন মার্কে স্টোর করা হয় না, JSON ডেটাতে key-গুলো অবশ্যই কোটেশন মার্কে স্টোর করা হয়।

আপনি যদি একটি JSON ফাইলে তাকান, আপনি সব key কোটেশন মার্কে ঘিরে থাকা দেখবেন। আপনি যদি একটি জাভাস্ক্রিপ্ট অবজেক্টে তাকান, আপনি key-গুলো কোটেশন মার্কে ঘিরে থাকা নাও থাকতে পারে।

JSON এবং জাভাস্ক্রিপ্ট অবজেক্ট উভয়ই key-value স্ট্রাকচারে ডেটা স্টোর করে।

উপসংহার

জাভাস্ক্রিপ্ট JSON-এ ডেটা স্টোর করার সমর্থন করে। JSON, JavaScript Object Notation-এর সংক্ষিপ্ত রূপ, একো অবজেক্টে সম্পর্কিত ডেটা স্টোর করার একটি উপায়। অবজেক্টের প্রতিটি ভ্যালুর তার নিজস্ব লেবেল থাকে, যাকেও key বলা হয়।

এখন আপনি JSON জাভাস্ক্রিপ্টে প্রোফেশনালের মতো ব্যবহার করার জন্য যে জ্ঞান দরকার সেটা लेकर সुसজ্জিত! আপনি কি জাভাস্ক্রিপ্ট সম্পর্কে আরও জানতে চান? আমাদের How to Learn JavaScript গাইড চেক আউট করুন। আপনি জাভাস্ক্রিপ্ট শিখতে টপ টিপস এবং শুরুকারী ও মধ্যবিত্ত ডেভেলপারদের জন্য লার্নিং রিসোর্সের তালিকা পাবেন।

  1. জাভাস্ক্রিপ্ট JSON.parse() মেথড

  2. জাভাস্ক্রিপ্ট JSON HTML

  3. জাভাস্ক্রিপ্ট JSON অ্যারে

  4. জাভাস্ক্রিপ্টে টেক্সটএরিয়াতে JSON ডেটা প্রিটিফাই করা