বাংলায় জাভাস্ক্রিপ্ট — পার্ট -৩: ভ্যারিয়েবল এন্ড ডাটা টাইপস

JavaScript image source Digital Ocean

আস্সালামুআলাইকুম আশা করি ভাষার মাস ফেব্রুয়ারির শেষ প্রান্তে এসে সকলেই খুব ভালো আছেন। প্রথমেই মনের গভীর থেকে ভাষা শহীদদের প্রতি শ্রদ্ধা ও অকৃত্রিম ভালোবাসা জ্ঞাপন করছি । যাদের আত্মত্যাগের বিনিময়ে আজ আমরা স্বাধীন ভাবে নিজের ভাষায়, মাতৃভাষায় লিখতে, পড়তে ও বলতে পারছি। সেই সাথে প্রযুক্তি প্রেমী অগ্রজ ভাইদের কেও আমার আন্তরিক ভালোবাসা যাদের কল্যানে এখন মাতৃভাষায় প্রযুক্তি চর্চা করতে পারছি। নিশ্চয় বসন্তের এই মিষ্টি দিনগুলি প্রিয়জনদের সাথে সবাই খুব উপভোগ করছেন। তবে আমার মতো ব্যাচেলরদের জন্য এক বালতি সমবেদনা। বসন্তের এই রং মেখে হারানোর সময় কোথায়। লাইফ ইজ খাও, ঘুমাও, কোড করো এন্ড প্রসেস টা রিপিট করো। তো আজাইড়া বকবকানি বাদ আজ আমরা কথা বলবো জাভাস্ক্রিপ্টের ভ্যারিয়েবল ও ডাটা টাইপ সমূহ নিয়ে।

বাংলায় জাভাস্ক্রিপ্ট সিরিজের আগের লেখা সমূহ দেখতে ভিজিট করুন নিচের লিংক গুলোতে :

১. বাংলায় জাভাস্ক্রিপ্ট — পার্ট -১: ইন্ট্রো to ব্যাসিক জাভাস্ক্রিপ্ট প্রোগ্রামিং
২. বাংলায় জাভাস্ক্রিপ্ট — পার্ট -২: কেন জাভাস্ক্রিপ্ট শিখবো ?

ভ্যারিয়েবল কি ?

কম্পিউটার প্রোগ্রামিং এর ভাষায় ভ্যারিয়েবল হচ্ছে কোনো ডাটা বা ভ্যালু স্টোর করার জন্য কম্পিউটার মেমোরি লোকেশনের জন্য নির্দিষ্ট নাম। যাতে করে আমরা কোনো ভ্যালু কে কম্পিউটার মেমোরি তে স্টোর করে রাখতে পারি, প্রয়োজনে কল করতে পারি এবং চেঞ্জ বা মোডিফাই করতে পারি।

যেকোনো প্রোগ্রামিং ল্যাঙ্গুয়েজের অন্যতম প্রধান বৈশিষ্ট বা উপাদান হচ্ছে ভ্যারিয়েবল। ভ্যারিয়েবল (Variable) একটি ইংরেজি শব্দ যার বাংলা অর্থঃ পরিবর্তনশীল।

অর্থাৎ সহজ ভাষায় যেকোনো প্রোগ্রামিং ল্যাঙ্গুয়েজে ডাটা বা ভ্যালু স্টোর করার জন্য যে সব কন্টেইনার ব্যবহার করা হয় তাকে ভ্যারিয়েবল বলে। ভ্যারিয়েবলের একটি নির্দিষ্ট নাম থাকে। এবং এই নাম করণের জন্য বিভিন্ন ল্যাঙ্গুয়েজে বিভিন্ন নীতিমালা বিদ্যমান। তো আমাদের আলোচনার বিষয় জাভাস্ক্রিপ্ট প্রোগ্রামিং ল্যাঙ্গুয়েজ। সুতরাং আজকে আমরা জাভাস্ক্রিপ্টে ভ্যারিয়েবল কি, কিভাবে ডিক্লার করা যাই ইত্যাদি যাবতীয় নিয়ম কানুন সম্পর্কে জানবো।

a = 10

name = ‘Jamal’

country = “Bangladesh”

এখানে a, name, country এইগুলা হচ্ছে ভ্যারিয়েবল। যাদের জন্য কিছু নির্দিষ্ট ভ্যালু সেট করা হয়েছে। যেমন a এর ভ্যালু 10, name এর ভ্যালু ‘jamal’ এবং country এর ভ্যালু ‘Bangladesh’ । আর এই ভ্যালু গুলাকে যেকোনো মুহূর্তে চেঞ্জ করা সম্ভব। আপনি চাইলে পরবর্তীতে আপনার প্রয়োজন মতো a = 20 বা country = ‘America’ দিতে পারেন। এইযে সহজে পরিবর্তনশীলতা এই জন্যই এর নাম ভ্যারিয়েবল রাখা হয়েছে।

জাভাস্ক্রিপ্টে ভ্যারিয়েবল ডিক্লেয়ার করার জন্য সাধারণত var কীওয়ার্ড টি ব্যবহার করা হয় এবং জাভাস্ক্রিপ্টের সকল প্রকার ডাটা টাইপের জন্যই একমাত্র var কীওয়ার্ড টিই ব্যবহার করা হয়। যদিও বর্তমানে ES6/ES7/ES8(EcmaScript 2015/2016/2017) এ ভ্যারিয়েবল ডিক্লেয়ার করার জন্য var ছাড়াও let ও const নামক দুইটি কীওয়ার্ড এর ব্যবহার চালু হয়েছে । এ বিষয়ে আমরা পরে বিস্তারিত আলোচনা করবো। ভ্যারিয়াবলে ভ্যালু রাখার (Assign) জন্য সমান (=) চিহ্ন ব্যবহার করা হয়।

মনে করেন আজ সকালে ঘুম থেকে উঠে আপনি বাজারে গেছেন সবজি কেনার উদ্দেশ্যে। বাজারে গিয়ে আলু কিনলেন ২০ টাকা কেজি, টমেটো ৩০ টাকা কেজি ও রুই মাছ ১৬০ টাকা কেজি।

আপনার ব্রাউজার এ F12 (for Chrome & Chromium) বা Ctrl + Shift + J (for Mozilla Firefox)কী চাপ দিয়ে ব্রাউজার কনসোল ওপেন করুন এবং টাইপ করুন।

JavaScript Variable Declaration

এখানে var হচ্ছে জাভাস্ক্রিপ্টে ভ্যারিয়েবল ডিক্লারেশন এর কীওয়ার্ড। potato, tomato বা fish একেকটা ভ্যারিয়েবল নাম এবং = চিহ্নের পরে যে ২০, ৩০, ১৬০ এগুলা হচ্ছে ভ্যালু। আপনি যদি ভ্যালু গুলা দেখতে চান তাহলে নিচের মতো টাইপ করুন : -

JavaScript Console Output

জাভাস্ক্রিপ্টে সিঙ্গেল লাইন কমেন্ট এর জন্য // এবং ব্রাউজার কনসোলে আউটপুট দেখার জন্য console.log ব্যবহার করা হয়। এগুলা নিয়ে পরে বিস্তারিত আলোচনা করা হবে। এখন মাথা ব্যাথা করার কোনো দরকার নাই।

একটা জিনিস কি খেয়াল করেছেন মাছ, মাংস বা সবজি। আমাদের দৈনন্দিন জীবনের প্রয়োজনীয় প্রায় সকল বস্তুর দাম ভ্যারি করে। সুতরাং আজ আলু ২০ টাকা কেজি কিনলেও আগামী কাল বা পরশু কিন্তু ২০ টাকায় পাওয়া যাবে না। যদি কপাল ভালো হয় ১৫ টাকাতেও পেতে পারেন। তবে অর্থনৈতিক ভাবে উন্নয়নশীল দেশের নাগরিক আমরা দিনকে দিন আমাদের মাথাপিছু আয় বাড়ছে । তাই আলুর দাম বাড়াটা অস্বাভাবিক কিছু নয়। সো আলুর দাম বেড়ে ২৫ বা ৩০ ও হতে পারে। তাই আপনাকে এখন আলুর দাম ভ্যারিয়েবল টা আপডেট করতে হবে।

এখানে লক্ষণীয় যে কোনো ভ্যারিয়েবল এর ভ্যালু আপডেট / মোডিফাই করার সময় var কীওয়ার্ড ব্যবহার করার প্রয়োজন নাই।

জাভাস্ক্রিপ্টে ভ্যারিয়েবল ডিক্লারেশনের নিয়ম সমূহঃ

Variable Declaration Method, image source: Sitepoint
  1. ভ্যারিয়েবল নামে শুধুমাত্র (a-z) বা (A-Z) বর্ণ সমূহ, (0–9) সংখ্যা সমূহ, আন্ডারস্কোর( _ ) ও ডলার ( $ ) ব্যবহার করা যাবে।
  2. ভ্যারিয়েবল নাম অবশ্যই লেটার বা বর্ণ, আন্ডারস্কোর ( _ ) অথবা ডলার ( $ ) দিয়ে শুরু হতে হবে।
  3. জাভাস্ক্রিপ্ট ভ্যারিয়েবল কেস সেনসিটিভ (Case Sensitive)। অর্থাৎ name এবং NAME সম্পূর্ণ আলাদা দুটি ভ্যারিয়েবল।
  4. জাভাস্ক্রিপ্টের রিজার্ভ কীওয়ার্ড সমূহ ভ্যারিয়েবল নাম হিসেবে ব্যবহার করা যাবে না। উদাহরণ স্বরূপ : var, let, function, else ইত্যাদি কখনোই ভ্যারিয়েবল নাম হিসেবে ব্যবহার করা যাবে না। রিজার্ভ কীওয়ার্ড এর ফুল লিস্ট দেখুন এখানে —

ES6 এ ভ্যারিয়েবল:

ES6 এ ভ্যারিয়েবল ডিক্লেয়ার করার জন্য var এর পাশাপাশি let এবং const নামক আরো দুইটা কীওয়ার্ড ইউজ করা হয়। এগুলাকে scope লেভেল ভ্যারিয়েবল বলে। শুধুমাত্র নির্দিষ্ট scope এর ভেতরেই এক্সেস করা যাই।

let declaration syntax:

let type variable declaration syntax with example

আপনার প্রোগ্রামে let কীওয়ার্ড দ্বারা একই নামের শুধুমাত্র একটি ভ্যারিয়েবল থাকবে। আপনি ভুল করেও যদি একই নামে একাধিক বার ভ্যারিয়েবল ডিক্লেয়ার করতে চান তাহলে syntaxError খাবেন। যেখানে var এর ক্ষেত্রে আগের ভ্যারিয়েবল টা নতুন টার দ্বারা রিপ্লেস হয়ে যাই।

const declaration syntax:

আপনার প্রোগ্রামে যদি কোনো অপরিবর্তনশীল ডাটা রাখতে চান। যেমন : pi এর ভ্যালু, ট্যাক্স রেট বা কোনো নির্দিষ্ট ব্যাংক লোনের ইন্টারেস্ট রেট ইত্যাদি। এসব ডাটা রাখার জন্য const টাইপ ভ্যারিয়েবল ডিক্লেয়ার করা যেতে পারে।

playing with const type variable

তবে একটি বিষয় উল্লেখযোগ্য যে জাভাস্ক্রিপ্ট এর const ভেরিয়েবল কিন্তু array ও Object এর ক্ষেত্রেও একই রকম না। একটি আরে বা অবজেক্ট ডিকলার করার পর ওই নতুন করে একই নামে আর কোন আরে বা অবজেক্ট ডিকলার করা যাবে না। বাট আপনার বর্তমান আরে বা অবজেক্ট এর কী অ্যান্ড ভ্যালু পরিবর্তন যোগ্য।

নিচের উদাহরণে লক্ষ করুনঃ

array & object with const

var, let ও const নিয়ে আরো তথ্যবহুল আলোচনা করা হয়েছে নিচের আর্টিকেল গুলোতে : -

স্কোপ (Scope) :

আসলে একটি ভ্যারিয়েবল কে প্রোগ্রামের কোন কোন অংশে কল করা যাবে আর কোনো কোন অংশে কল করা যাবে না তাকেই স্কোপ বলে। জাভাস্ক্রিপ্টে ভ্যারিয়েবল সমূহ দুইটা স্কোপ মানে : -

১. গ্লোবাল স্কোপ (Global Scope)
২. লোকাল স্কোপ (Local Scope)

গ্লোবাল স্কোপ (Global Scope): — গ্লোবাল ভ্যারিয়েবল সমূহ প্রোগ্রামের প্রায় সব অংশে ব্যবহার করা যাই। যেমনঃ

JavaScript global scoped variable

লোকাল স্কোপ (Local Scope): — লোকাল স্কোপ ভ্যারিয়েবল সমূহ প্রোগ্রামের সব অংশে ব্যবহার করা যাই না, শুধুমাত্র নির্দিষ্ট একটি function বা এরিয়া তে ব্যবহার যোগ্য। যেমনঃ

JavaScript local scoped variable

ডাটা টাইপস :

জাভাস্ক্রিপ্ট প্রোগ্রামিং ল্যাঙ্গুয়েজে ডাটা টাইপ প্রধানত ৭ প্রকারঃ -

স্ট্রিং (String)
নাম্বার (Number)
বুলিয়ান (Boolean)
আনডিফাইনড (undefined)
নাল (null)
সিম্বল (Symbol) ও 
অবজেক্ট (Object)

স্ট্রিং (String) ডাটা টাইপ :

স্ট্রিং ডাটা টাইপ দ্বারা সকল প্রকার স্ট্রিং ভ্যালু রিপ্রেজেন্ট করা হয়ে থাকে। যেমনঃ -

JavaScript String Data Type

স্ট্রিং ডাটা টাইপে ডাবল কোটেশনের ভিতর সিঙ্গেল কোটেশন পাস করানো যাই। কিন্তু সিঙ্গেল কোটেশনের ভিতর সিঙ্গেল কোটেশন পাস করানো সম্ভব নাই। তাই উত্তম উপায় হচ্ছে কোনো শব্দে কোটেশন থাকলে কোটেশনের আগে ব্যাকস্লাশ ( \ ) ব্যবহার করা।

নাম্বার (Number) ডাটা টাইপ :

সকল টাইপের নিউমেরিক ভ্যালুই জাভাস্ক্রিপ্টে নাম্বার ডাটা টাইপের অন্তর্গত। সেটা হোক ইন্টিজার (Integer) বা ফ্লোট (Float) সব।

নাম্বার ডাটা টাইপ এর ভ্যালু পজেটিভ ইনফিনিটি (+Infinity), নেগেটিভ ইনফিনিটি(-Infinity) ও Not A Number (NaN) টাইপ হতে পারে।

বুলিয়ান (Boolean) ডাটা টাইপ :

কোনো একটি ডাটা বা ভ্যালু সত্য না মিথ্যা তা জানতে বুলিয়ান ডাটা টাইপ ব্যবহার করা হয়। বুলিয়ান ডাটার শুধুমাত্র দুইটি অবস্থা বিদ্যমান true অথবা false। অর্থাৎ হয় Yes অথবা No । এছাড়া আর কোনো অপশন নাই।

Boolean Data Type

আনডিফাইনড (undefined) ডাটা টাইপ :

যদি কোনো ভ্যারিয়েবল ডিক্লেয়ার করা হয়, কিন্তু ভ্যালু এসাইন করা হয় নাই। তখন তার টাইপ হবে undefined ।

নাল (null) ডাটা টাইপ :

যদি কোনো ভ্যারিয়েবল এর ভ্যালু null সেট করা হয়। তবে তা null ডাটা টাইপের অন্তর্ভুক্ত হয়। এটার মানে কিছুই না (Null has one value: null. It is explicitly nothing)।

সিম্বল (Symbol) ডাটা টাইপ :

সিম্বল (Symbol) ডাটা টাইপ টি ES6 এর নতুন সংযোজন। সিম্বল একটি immutable প্রিমিটিভ ভ্যালু। এটি অবশ্যই একটি ইউনিক ভ্যালু হবে।

অবজেক্ট (Object) ডাটা টাইপ :

জাভাস্ক্রিপ্টের অন্যতম বহুল ব্যবহৃত ও আলোচিত ডাটা টাইপ হচ্ছে অবজেক্ট। জাভাস্ক্রিপ্ট এ অবজেক্ট দুই ধরণের : (১) array ও (২) object

Arrays ইন জাভাস্ক্রিপ্ট :

একই টাইপের একাধিক ডাটা কে আলাদা আলাদা ভ্যারিয়েবল এ রাখা অযুক্তিক। তাই তাদেরকে একটি ভ্যারিয়েবলের ভিতর আলাদা আলাদা ইনডেক্স নাম্বার দিয়ে সাজিয়ে রাখা কেই এরে (array) বলে।

এরে এক্সেস করার জন্য নিচের নিয়ম ফলো করা হয়।

array এর ইনডেক্স গণনা শুরু হয় শুন্য থেকে। তাই numArr এর প্রথম ইনডেক্স টা একসেস করতে হচ্ছে numArr[0] ব্যবহার করে।

আমরা যেহেতু numArr তে পাঁচটি ভ্যালু রেখেছি তাই এর প্রথম ইনডেক্সটি হচ্ছে numArr[0] এবং সর্বশেষ ইনডিক্সটি হচ্ছে numArr[4]। যেকোনো array এর লেংথ জানতে চাইলে নিচের মতো টাইপ করুন।

Object ইন জাভাস্ক্রিপ্ট :

কী ভ্যালু পেয়ার হিসেবে যখন কোনো ডাটা কে রিপ্রেজেন্ট করার প্রয়োজন পড়ে তখন তাকে অবজেক্ট আকারে প্রকাশ করা হয়।

অবজেক্টের কোনো ডাটা মডেল কে ভিউ করার জন্য বা একসেস করার জন্য নিচের মতো কোড লিখুন :

অবজেক্ট একসেস করার জন্য ডট নোটেশন ও ব্রাকেট নোটেশন উভয়ই ব্যবহার করা হয়।

আমরা যদি cars অবজেক্টের কোনো ভ্যালু চেঞ্জ করতে চাই তবে :

জাভাস্ক্রিপ্ট এর array ও object নিয়ে এছাড়াও আরো অনেক অনেক অপারেশন আছে। সেগুলা আমরা পরবর্তীতে আস্তে আস্তে জানবো। আজ এই পর্যন্তই। সবাই ভালো থাকবেন, সুস্থ থাকবেন। আর কোনো ত্রুটি চোখে পড়লে অবশ্যই কমেন্ট করে জানাবেন। এছাড়াও আমাকে ফেইসবুকটুইটার এ নক করতে পারেন। আমার লিংকডইন প্রোফাইল।

Happy Coding (“_”);