জাভাস্ক্রিপ্ট অবজেক্ট নটেশন ফাংশন ফাইল (JSON Function Files)

জেএসওএন ফাংশন ফাইল

রিদওয়ান বিন শামীম

জেএসওএন ফাংশন ফাইল (JSON Function Files)

জেএসওএনএর একটি সাধারণ প্রয়োগ হল ওয়েব সার্ভার থেকে ডাটা পড়া ও ওয়েব পেজে তা প্রদর্শন করা। এই অধ্যায়ে চারটি ছোট ছোট ধাপে দেখানো হবে কীভাবে ফাংশন ফাইল ব্যবহার করে জেএসওএন ডাটা পড়া হয়।

জেএসওএন উদাহরণঃ এই উদাহরণে myTutorials.js থেকে একটি মেনু পড়া হবে ও সেটিকে ওয়েবপেজে দেখানো হবে।


<div id="id01"></div>
<script>
function myFunction(arr) {
     var out = "";
     var i;
     for(i = 0; i<arr.length; i++) {
     out += '<a href="' + arr[i].url + '">' + arr[i].display + '</a><br>';
     }
     document.getElementById("id01").innerHTML = out;
}
</script>
<script src="myTutorials.js"></script>

 

 

উদাহরণের ব্যাখ্যা

প্রথমতঃ অবজেক্টের শ্রেণীবিন্যাস তৈরি করা হয়ঃ
অক্ষরভিত্তিক শ্রেণীবিন্যাস নির্ধারণ করে কোনো অবজেক্টের শ্রেণীবিন্যাস তৈরি করা হয়। প্রত্যেকটি অবজেক্টের দুটি বৈশিষ্ট্য নির্ধারণ করে দেয়া হয়, display এবং url । শ্রেণীবিন্যাসকে myArray নাম দেয়া হয়।
myArray


var myArray = [
{
"display": "JavaScript Tutorial",
"url": "http://www.w3schools.com/js/default.asp"
},
{
"display": "HTML Tutorial",
"url": "http://www.w3schools.com/html/default.asp"
},
{
"display": "CSS Tutorial",
"url": "http://www.w3schools.com/css/default.asp"
}
]

 

দ্বিতীয়তঃ শ্রেণীবিন্যাস দেখানোর জন্য জাভাস্ক্রিপ্টের একটি ফাংশন তৈরি করা হয়ঃ myFunction() নামের ফাংশন তৈরি করা হয় যা থেকে অবজেক্টগুলো দৃশ্যমান হয় ও এইচটিএমএল লিঙ্ক জাতীয় উপাদান প্রদর্শন করে।

myFunction()


 

function myFunction(arr) {
    var out = "";
    var i;
    for(i = 0; i < arr.length; i++) {
    out += '<a href="' + arr[i].url + '">' + arr[i].display + '</a><br>';
    }
    document.getElementById("id01").innerHTML = out;
}

 

 

myFunction() কে myArray এর সাথে আর্গুমেন্ট হিসেবে দেখা হয়। যথা,


myFunction(myArray);


 

 

তৃতীয়ত, কোন অক্ষরভিত্তিক শ্রেণীবিন্যাসকে আর্গুমেন্ট হিসেবে ব্যবহার করা(শ্রেণীবিন্যাস চলকের পরিবর্তে)ঃ
myFunction() কে array literal(অক্ষরভিত্তিক শ্রেণীবিন্যাস)এর সাথে আর্গুমেন্ট হিসেবে দেখা হয়,

Calling myFunction()


myFunction([
{
"display": "JavaScript Tutorial",
"url": "http://www.w3schools.com/js/default.asp"
},
{
"display": "HTML Tutorial",
"url": "http://www.w3schools.com/html/default.asp"
},
{
"display": "CSS Tutorial",
"url": "http://www.w3schools.com/css/default.asp"
}
]);

 

 

চতুর্থতঃ ফাংশন কলকে এক্সটারনাল js fileএ রাখা হয়ঃ
myTutorials.js নামক এক্সটারনাল js fileএ ফাংশন কলকে রাখা হয়।

myTutorials.js


myFunction([
    {
    "display": "JavaScript Tutorial",
    "url": "http://www.w3schools.com/js/default.asp"
    },
    {
    "display": "HTML Tutorial",
    "url": "http://www.w3schools.com/html/default.asp"
    },
    {
    "display": "CSS Tutorial",
    "url": "http://www.w3schools.com/css/default.asp""
    }
 ]);

 

 

ফাংশন কলের পরিবর্তে পেজে এক্সটারনাল স্ক্রিপ্ট যোগ করা হয়,
Add External Script


<script src=”myTutorials.js”></script>


 

 

 

জাভাস্ক্রিপ্ট অবজেক্ট নটেশন এইচটিটিপি রিকুয়েস্ট (JSON Http Request)

জেএসওএন এইচটিটিপি রিকুয়েস্ট

রিদওয়ান বিন শামীম

 

জেএসওএনএর একটি সাধারণ প্রয়োগ হল ওয়েব সার্ভার থেকে ডাটা পড়া ও ওয়েব পেজে তা প্রদর্শন করা।

এই অধ্যায়ে চারটি ছোট ছোট ধাপে দেখানো হবে কীভাবে XMLHttp ব্যবহার করে জেএসওএন ডাটা পড়া হয়।

জেএসওএন উদাহর

এই উদাহরণে myTutorials.txt, থেকে একটি মেনু পড়া হবে ও সেটিকে ওয়েবপেজে দেখানো হবে।


<div id="id01"></div>
<script>
var xmlhttp = new XMLHttpRequest();
var url = "myTutorials.txt";
xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        var myArr = JSON.parse(xmlhttp.responseText);
        myFunction(myArr);
    } 
}
xmlhttp.open("GET", url, true);
xmlhttp.send();
function myFunction(arr) {
    var out = "";
    var i;
    for(i = 0; i < arr.length; i++) {
        out += '<a href="' + arr[i].url + '">' +
        arr[i].display + '</a><br>';
    }
    document.getElementById("id01").innerHTML = out;
}
</script>

 

 

উদাহরণের ব্যাখ্যা

প্রথমতঃ অবজেক্টের শ্রেণীবিন্যাস (Array) তৈরি করা হয়ঃ
অক্ষরভিত্তিক শ্রেণীবিন্যাস (Array) নির্ধারণ করে কোনো অবজেক্টের শ্রেণীবিন্যাস (Array) তৈরি করা হয়। প্রত্যেকটি অবজেক্টের দুটি বৈশিষ্ট্য নির্ধারণ করে দেয়া হয়, display এবং url । শ্রেণীবিন্যাস (Array) কে myArray নাম দেয়া হয়।


var myArray = [
{
"display": "JavaScript Tutorial",
"url": "http://www.w3schools.com/js/default.asp"
},
{
"display": "HTML Tutorial",
"url": "http://www.w3schools.com/html/default.asp"
},
{
"display": "CSS Tutorial",
"url": "http://www.w3schools.com/css/default.asp"
}
]

 

 

দ্বিতীয়তঃ শ্রেণীবিন্যাস দেখানোর জন্য জাভাস্ক্রিপ্টের একটি ফাংশন তৈরি করা হয়ঃ myFunction() নামের ফাংশন তৈরি করা হয় যা থেকে অবজেক্টগুলো দৃশ্যমান হয় ও এইচটিএমএল লিঙ্ক জাতীয় উপাদান প্রদর্শন করে।


function myFunction(arr) {
    var out = "";
    var i;
    for(i = 0; i < arr.length; i++) {
    out += '<a href="' + arr[i].url + '">' + arr[i].display + '</a><br>';
    }
    document.getElementById("id01").innerHTML = out;
}

 

 

myFunction() কে myArray এর সাথে আর্গুমেন্ট হিসেবে দেখা হয়। যথা,


myFunction(myArray);


 

 

তৃতীয়তঃ টেক্সট ফাইল তৈরি করা হয়ঃ

myTutorials.txt: নামক ফাইলের মধ্যে অক্ষরভিত্তিক শ্রেণীবিন্যাসকে রাখা হয়।


[
{
"display": "JavaScript Tutorial",
"url": "http://www.w3schools.com/js/default.asp"
},
{
"display": "HTML Tutorial",
"url": "http://www.w3schools.com/html/default.asp"
},
{
"display": "CSS Tutorial",
"url": "http://www.w3schools.com/css/default.asp"
}
]

 

চতুর্থতঃ XMLHttpRequest দ্বারা টেক্সট ফাইল পড়া হয়ঃ

XMLHttpRequest লেখা হয় টেক্সট ফাইল পড়ার জন্য, এবং শ্রেণীবিন্যাস দেখানোর জন্য myFunction() ব্যবহার করা হয়।

XMLHttpRequest


 

var xmlhttp = new XMLHttpRequest();
var url = "myTutorials.txt";
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
   var myArr = JSON.parse(xmlhttp.responseText);
   myFunction(myArr);
   }
}
xmlhttp.open("GET", url, true);
xmlhttp.send();

 

 

জাভাস্ক্রিপ্ট অবজেক্ট নটেশন সিনট্যাক্স (JSON Syntax)

জেএসওএন সিনট্যাক্স

রিদওয়ান বিন শামীম

 

জেএসওএন সিনট্যাক্স, জাভাস্ক্রিপ্ট সিনট্যাক্সের একটি সাবসেট।

জেএসওএন সিনট্যাক্সের নিয়মাবলী

জেএসওএন সিনট্যাক্স, জাভাস্ক্রিপ্টের অবজেক্ট নোটেশন সিনট্যাক্স থেকে উদ্ভূত ।

  • ডাটা নাম ও মানের জোড়ায় থাকে
  • ডাটা কমা দ্বারা আলাদা করা থাকে
  • কুঁকড়ানো ব্র্যাকেট {} দ্বারা অবজেক্ট আবদ্ধ থাকে
  • স্কয়ার ব্র্যাকেট [ ] দ্বারা শ্রেণীবিন্যাস আবদ্ধ থাকে।

 

জেএসওএন ডাটা – একটি নাম ও একটি মান

জেএসওএন ডাটাকে নাম ও মানের জোড়ায় লেখা হয়ে থাকে। নাম ও মানের জোড়া ডাবল কোটে আবদ্ধ ফিল্ড নেম, একটি কোলন চিহ্ন ও একটি মান নিয়ে গঠিত হয়।

উদাহরণ,


“firstName”:”John”


নোট : জেএসওএন নামে ডাবল কোটের দরকার হয়, জাভাস্ক্রিপ্টের নামের বেলায় দরকার হয় না।

 

জেএসওএন মান

জেএসওএন মান যেরকম হতে পারে

  • সংখ্যা (পূর্ণসংখ্যা বা ফ্লোটিং পয়েন্ট )
  • স্ট্রিং (ডাবল কোটে থাকবে )
  • Boolean (সত্য বা মিথ্যা)
  • শ্রেণীবিন্যাস (স্কয়ার ব্র্যাকেট দ্বারা আবদ্ধ)
  • অবজেক্ট (কুঁকড়ানো ব্র্যাকেট দ্বারা আবদ্ধ)

 

জেএসওএন অবজেক্ট

জেএসওএন অবজেক্ট কুঁকড়ানো ব্র্যাকেট দ্বারা আবদ্ধ থাকে। জাভাস্ক্রিপ্টের মত জেএসওএন অবজেক্ট মাল্টিপল নাম ও মানের জোড়া সংরক্ষণ করে,

উদাহরণ,


{“firstName”:”John”, “lastName”:”Doe”}


 

 

জেএসওএন অ্যারে

স্কয়ার ব্র্যাকেট দ্বারা অ্যারে আবদ্ধ থাকে। জাভাস্ক্রিপ্টের মত জেএসওএন অ্যারে মাল্টিপল অবজেক্ট সংরক্ষণ করতে পারে।

উদাহরণ,


"employees":[
     {"firstName":"John", "lastName":"Doe"},
     {"firstName":"Anna", "lastName":"Smith"},
     {"firstName":"Peter","lastName":"Jones"}
]

 

উপরের উদাহরণে “employees” হল একটি শ্রেণীবিন্যাস যা তিনটি অবজেক্টকে ধরে রেখেছে, যাদের প্রত্যেকটি এক একজন ব্যক্তির নাম, (ফার্স্ট নেম ও লাস্ট নেম)।

 

জেএসওএন জাভাস্ক্রিপ্টের সিনট্যাক্স ব্যবহার করে

যেহেতু জেএসওএন সিনট্যাক্স, জাভাস্ক্রিপ্টের অবজেক্ট নোটেশন সিনট্যাক্স থেকে উদ্ভূত তাই জাভাস্ক্রিপ্টে জেএসওএন নিয়ে কাজ করলে খুব কম সংখ্যক অতিরিক্ত সফটওয়ার প্রয়োজন হয়। জাভাস্ক্রিপ্টের মাধ্যমে অবজেক্টের শ্রেণীবিন্যাস তৈরি করে তাতে ডাটা সন্নিবেশ করা যায়, যেমন,


var employees = [
      {"firstName":"John", "lastName":"Doe"},
      {"firstName":"Anna", "lastName":"Smith"},
      {"firstName":"Peter","lastName": "Jones"}
];

 

 

জাভাস্ক্রিপ্ট অবজেক্টের শ্রেণীবিন্যাসের প্রথম সত্ত্বাকে যেভাবে দেখানো যায়,


// returns John Doe
 employees[0].firstName + " " + employees[0].lastName;

 

 

এটিকে এভাবেও দেখানো যেতে পারে,


// returns John Doe
 employees[0]["firstName"] + " " + employees[0]["lastName"];

 

 

ডাটা এভাবে পরিবর্তিত হতে পারে,


employees[0].firstName = “Gilbert”;


 

 

এটি এভাবেও পরিবর্তিত হতে পারে,


employees[0][“firstName”] = “Gilbert”;


 

 

পরবর্তী অধ্যায়ে দেখানো হবে কীভাবে জেএসওএন টেক্সটকে জাভাস্ক্রিপ্ট অবজেক্টে পরিনত করা হয়।

 

জেএসওএন ফাইল

  • জেএসওএন ফাইলের ফাইল টাইপ হল “.json”
  • জেএসওএন টেক্সটের MIME টাইপ হল “application/json”

জাভাস্ক্রিপ্ট স্ট্রিং (JavaScript Strings)

জাভাস্ক্রিপ্ট স্ট্রিং (JavaScript Strings)

  • জাভাস্ক্রিপ্ট স্ট্রিং টেক্সট (লেখা) সংরক্ষণ ও কাজে লাগানোর জন্য ব্যবহার করা হয়।
  • জাভাস্ক্রিপ্ট স্ট্রিং সাধারণভাবে একগুচ্ছ বর্ণকে পরবর্তীতে ব্যবহারের জন্য সংরক্ষণ করে। যেমন: “John Doe”
  • স্ট্রিং কোটেশনর এর ভিতরে যেকোন লেখা হতে পারে। আপনি একক বা ডবল কোটেশন ব্যবহার করতে পারেন।

যেমন:


var carname = “Volvo XC60”;
var carname = ‘Volvo XC60’;


 

 

আপনি স্ট্রিং এর ভিতরে যতবার খুশি কোটেশন ব্যবহার করতে পারেন, যতক্ষন পর্যন্ত না প্রথম ও শেষ কোটেশন মিলে যায়।

উদাহরণ:


var answer = “It’s alright”;
var answer = “He is called ‘Johnny'”;
var answer = ‘He is called “Johnny”‘;


 

 

স্ট্রিং এর দৈঘ্য

একটি স্ট্রিং এর দৈর্ঘ্য হবে প্রোপার্টি এ নির্দিষ্টকৃত দৈর্ঘ্য (length):

উদাহরণ:


var txt = “ABCDEFGHIJKLMNOPQRSTUVWXYZ”;
var sln = txt.length;


 

 

বিশেষ বর্ণ

যেহেতু স্ট্রিং কোটেশন এর ভিতরে লিখতে হয়, সেহেতু নিচের উদাহরণটিকে ভুল বুঝে:


var y = “We are the so-called “Vikings” from the north.”


উপরের স্ট্রেংটিকে মনে করে, “We are the so-called” .

এই সমস্যা সমাধানের উপায় হল, \ অক্ষরের অব্যাহতি (escape character) ব্যবহার করা।

এই অক্ষরের অব্যাহতি ব্যাকস্লাসটি বিশেষ বর্ণকে স্ট্রিং হিসেবে ফেরত দেয়।:

উদাহরণ:


var x = ‘It\’s alright’;
var y = “We are the so-called \”Vikings\” from the north.”


অব্যাহতি অক্ষর (\) অন্যান্য বিশেষ বর্ণকেও স্ট্রিং হিসেবে ব্যবহার করতে ব্যবহৃত হয়।

এখানে বিশেষ বর্ণের একটি তালিকা দেওয়া হল যা ব্যাকস্লাস (\) এর মাধ্যমে টেক্স স্ট্রিং হিসেবে ব্যবহার করা যায়:

কোড আউটপুট
\’ একক কোটেশন
\” ডবল কোটেশন
\\ ব্যাকস্লাস
\n নতুন লাইন
\r বহন ফেরত
\t ট্যাব
\b ব্যাকস্পেস
\f ফর্ম ফিড

 

লম্বা কোড এর লাইনকে ভেঙ্গে দেওয়া

সহজে পড়ার উপযোগী করার জন্য অনেক সময় প্রোগ্রামাররা 80 বর্ণের অধিক ক্যারেকটার এর লম্বা লাইনকে ভেঙ্গে লেখেন।

যদি জাভাস্ক্রিপ্ট এর স্টেটমেন্ট এক লাইনে সংকুলান না হয়, তাহলে সবচেয়ে ভাল উপায় হলো কোন অপারেটর এর শেষে এটিকে ভেঙ্গে দেওয়া।

উদাহরণ:


document.getElementById(“demo”).innerHTML =
“Hello Dolly.”;


 

আপনি টেক্স স্ট্রিং এর ভিতরে একটি একক ব্যাকস্লাস (\) ব্যবহার করেও লাইটকে ভাঙ্গতে পারেন।

উদাহরণ:


document.getElementById(“demo”).innerHTML = “Hello \
Dolly!”;


 

নোট : \ মেথড ECMAScript (জাভাস্ক্রিপ্ট) স্ট্যান্ডার্ড নয়। কিছু ব্রাউজার \ (স্লাস) এর পেছনে স্পেস সাপোর্ট করে না।

একটি দীর্ঘ স্ট্রিং কে ভাঙ্গার নিরাপদ (কিন্তু একটু সময়সাপেক্ষ) পথ হচ্ছে স্ট্রিং সংযোযন ব্যবহার করা:

উদাহরণ:


document.getElementById(“demo”).innerHTML = “Hello” +
“Dolly!”;


 

আপনি কোড লাইনকে ব্যাকস্লাস দিয়ে ভাঙ্গতে পারবেন না:

উদাহরণ:


document.getElementById(“demo”).innerHTML = \
“Hello Dolly!”;


 

 

স্ট্রিং অবজেক্টও হতে পারে

সাধারণভাবে জাভাস্ক্রিপ্ট স্ট্রিং হচ্ছে আদিম মান (primitive values), অক্ষর দিয়ে তৈরি: var firstName = “John”

কিন্তু স্ট্রিং কে new কীওয়ার্ড এর সাহায্যে অবজেক্ট হিসেবেও ব্যবহার করা যেতে পারে : var firstName = new String(“John”)

উদাহরণ :


var x = “John”;
var y = new String(“John”);

// typeof x will return string
// typeof y will return object


 

নোট: স্ট্রিং কে অবজেক্ট হিসেবে ব্যবহার করবেন না। এটি প্রক্রিয়াকরণ গতিকে ধরি করে ফেলে এবং বাজে পার্শ্বপ্রতিক্রিয়া উৎপন্ন হয়।

 

যখন == সমান অপারেটর ব্যবহার করবেন, সমান স্ট্রিংগুলো সমান দেখাবে:

যেমন:


var x = “John”;
var y = new String(“John”);

// (x == y) is true because x and y have equal values


 

যখন আপনি === সমান অপারেটর ব্যবহার করবেন, সমস্ট্রিংগুলো সবসময় সমান থাকবে না, কারণ === অপারেটর মান এবং টাইপ একই হবে বলে আশা করে।


var x = “John”;
var y = new String(“John”);

// (x === y) is false because x and y have different types


 

বা, অবজেক্ট এর সাথে অবজেক্ট তুলনা করা যায় না:

যেমন:


var x = new String(“John”);
var y = new String(“John”);

// (x == y) is false because objects cannot be compared


 

 

স্ট্রিং প্রোপার্টি এবং মেথড

আদিম মান, যেমন “John Doe” এর কোন প্রোপার্টিজ এবং মেথড থাকতে পারে না (কেননা এরা অবজেক্ট নয়)।

কিন্তু জাভাস্ক্রিপ্টে আদিম মান এর জন্যও মেথড এবং প্রোপার্টিজ রয়েছে, কারণ যখন মেথড এবং প্রোপার্টিজ কার্যে পরিণত করা হয় তখন ভাজাস্ক্রিপ্ট আদিম মানকে একইরূপে অবজেক্ট হিসেবে গণ্য করে।

 

স্ট্রিং মেথড সম্পর্কে পরবর্তী অধ্যায় এ আলোচনা করা হয়েছে।

 

স্ট্রিং প্রোপার্টিজ

প্রোপার্টি (Property) বর্ণনা
constructor যে ফাংশনটি স্ট্রিং অবজেক্ট এর প্রোটোটাইপ তৈরী করেছিলেন তা ফেরত দেয়
length স্ট্রিং এর length ফেরত দেয়
prototype আপনাকে একটি অবজেক্ট এর ভিতরে প্রোপার্টি এবং মেথড যোগ করার অনুমতি প্রদান করে।

 

স্ট্রিং মেথড

মেথড (Method) বর্ণনা
charAt() সুনির্দিষ্ট ইনডেক্স এর (অবস্থান) নির্দিষ্ট বর্ণ ফেরত দেয়।
charCodeAt() সুনির্দিষ্ট ইনডেক্স এর নির্দিষ্ট ইউনিকোড বর্ণ ফেরত দেয়।
concat() দুই বা ততোধিক স্ট্রিং কে যুক্ত করে এবং তার একটি অনুলিপি ফেরত দেয়।
fromCharCode() ইউনিকোড মানকে বর্ণে পরিবর্তন করে।
indexOf() স্ট্রিং এর নির্দিষ্ট মান এর ভিতরে প্রথম পাওয়া কাঙ্খিত ঘটনা এর অবস্থান ফেরত দেয়।
lastIndexOf() স্ট্রিং এর নির্দিষ্ট মান এর ভিতরে শেষ পাওয়া কাঙ্খিত ঘটনা এর অবস্থান ফেরত দেয়।
localeCompare() বর্তমান অবস্থানের দুটি স্ট্রিং এর মধ্যে তুলনা করে।
match() রেগুলার এক্সপ্রেশন এর মধ্যে একটি স্ট্রিং কে খুঁজে এবং খুঁজে পাওয়া ফলাফল ফেরত দেয়।
replace() স্ট্রিং এর নির্দিষ্ট মান খোঁজে এবং নতুন একটি স্ট্রিং দ্বারা প্রতিস্থাপণ করে তা ফেরত দেয়।
search() স্ট্রিং এর নির্দিষ্ট মান খোঁজে এবং এর অবস্থান ফেরত দেয়।
slice() স্ট্রিং এর সার অংশ বের করে এবং নতুন একটি স্ট্রিং ফেরত দেয়।
split() স্ট্রিং কে বিভাজন করে সাবস্ট্রিং এর অ্যারে তৈরি করে।
substr() স্ট্রিং এর নির্দিষ্ট অংশ এর সার অংশ বের করে কিছুসংখ্যক বর্ণের মাধ্যমে।
substring() দুইটি নির্দিষ্ট অবস্থান এর মধ্যে একটি স্ট্রিং এর নির্দিষ্ট অংশ এক্সট্রাক্ট করে।
toLocaleLowerCase() স্ট্রিং কে ছোট হাতের অক্ষরে পরিণত কর।
toLocaleUpperCase() স্ট্রিং কে বড় হাতের অক্ষরে পরিণত করে।
toLowerCase() স্ট্রিং কে ছোট হাতের অক্ষরে পরিণত কর।
toString() স্ট্রিং অবজেক্ট এর মান ফেরত দেয়।
toUpperCase() স্ট্রিং কে বড় হাতের অক্ষরে পরিণত করে।
trim() স্ট্রিং এর উভয় প্রান্ত থেকে ফাঁকা স্পেস মুছে ফেলে।
valueOf() স্ট্রিং অবজেক্ট এর আদি মান ফেরত দেয়।

 

নিজে নিজে অনুশীলন কর!

অনুশীলন 01:

ইঙ্গিত: ভেরিয়েবল টেক্সট এ স্ট্রিং “Hello World!” নির্ধারণ কর।


<!DOCTYPE html>
<html>
<body>

<p id=”demo”></p>

<script>
var txt;
document.getElementById(“demo”).innerHTML = txt;
</script>

</body>
</html>


 

 

অনুশীলন 02:

ইঙ্গিত: টেক্সট ভেরিয়েবল এর মান  এর দৈর্ঘ্য প্রদর্শনের জন্য length প্রোপার্টি ব্যবহার কর।


<!DOCTYPE html>
<html>
<body>

<p id=”demo”></p>

<script>
var txt = “Hello World!”;
document.getElementById(“demo”).innerHTML = txt;
</script>

</body>
</html>


 

অনুশীলন 03:

ইঙ্গিত: স্ট্রিং টি ভেঙ্গে গেছে – ঠিকভাবে প্রদর্শনের জন্য অক্ষরের অব্যাহতি (escape character) ব্যবহার কর।


<!DOCTYPE html>
<html>
<body>

<p id=”demo”></p>

<script>
document.getElementById(“demo”).innerHTML = “We are “Vikings”.”;
</script>

</body>
</html>


 

অনুশীলন 04:

ইঙ্গিত: শ্রেণীবদ্ধভাবে সংযুক্ত দুটি স্ট্রিং প্রদর্শন করে “হ্যালো ওয়ার্ল্ড!”


<!DOCTYPE html>
<html>
<body>

<p id=”demo”>Display the result here.</p>

<script>
var str1 = “Hello “;
var str2 = “World!”;
</script>

</body>
</html>


 

 

 

জাভাস্ক্রিপ্ট অবজেক্ট নটেশন টিউটোরিয়াল (JSON Tutorial)

JSON টিউটোরিয়াল

আদনান নাহিদ
সরকারি তিতুমির কলেজ

 

  • JSON: জাভাস্ক্রিপ্ট অবজেক্ট নটেশন (JavaScript Object Notation)।
  • JSON হল তথ্য সংরক্ষণ এবং তথ্য আদান প্রদানের জন্য একটি শব্দবিন্যাস ।
  • JSON XML এ ব্যবহারের একটি সহজতম বিকল্প ।

 

নিম্নলিখিত JSON উদাহরণটি কর্মচারীদের লক্ষ্য নির্ধারণ করে,, একটি অ্যারের সাথে ৩ জন কর্মচারীর রেকর্ড দেয়া হল :
JSON উদাহরণ


{"employees":[
      {"firstName":"John", "lastName":"Doe"},
      {"firstName":"Anna", "lastName":"Smith"},
      {"firstName":"Peter", "lastName":"Jones"}
]}

 

নিম্নলিখিত XML উদাহরণটিও 3 কর্মচারীর সাথে কর্মীদের লক্ষ্য রেকর্ড নির্ধারণ করে ।
এক্সএমএল উদাহরণ


<employees>
     <employee>
         <firstName>John</firstName> <lastName>Doe</lastName>
     </employee>
     <employee>
         <firstName>Anna</firstName> <lastName>Smith</lastName>
     </employee>
     <employee>
         <firstName>Peter</firstName> <lastName>Jones</lastName>
     </employee>
 </employees>

JSON কি?

• JSON জাভাস্ক্রিপ্ট অবজেক্ট নটেশনকে ভিত্তি করে গড়ে ওঠে ।
• JSON একটি লাইটওয়েট তথ্য-ইন্টারচেঞ্জ ফরম্যাট ।
• JSON একটি স্বাধীন ভাষা ।
• JSON একটি “স্ব-বর্ণনা” এবং বুঝতে সহজ ।
* JSON জাভাস্ক্রিপ্ট সিনট্যাক্স ব্যবহার করে, কিন্তু JSON বিন্যাস শুধু লিখিত, যেমন XML । প্রোগ্রামিং ভাষা দ্বারা এই লেখাগুলো পড়া যায় ডাটা ফরম্যাট হিসাবে ব্যবহার করা যাব ।

মোবাইল এপ্লিকেশন তৈরির জন্য আপনার প্রযুক্তি কোনটা হবে? Mobile Development Technologies

মোবাইল এপ্লিকেশন তৈরির জন্য আপনার প্রযুক্তি কোনটা হবে?

নির্জন কাল্পনিক
B.Sc in EEE
IT Officer

বর্তমানে সমগ্র আইটি শিল্পে মোবাইল এপ্লিকেশনের প্রভাব বিশ্বব্যাপী, একটি এপ্লিকেশন এখন অনেকভাবে তৈরি করা যায়। তাই এই কমিউনিটিতে গবেষণার উদ্যোগে আমরা মোবাইল এপ্লিকেশন তৈরিতে ভিন্ন ভিন্ন প্রযুক্তির গুরুত্ব এবং তাদের গ্রহণযোগ্যতার স্তর নিয়ে পরীক্ষা করছি।

অ্যাপস তৈরির বিভিন্ন প্রযুক্তি গুলোর মধ্যে প্রকৃত এবং বাস্তবায়ন যোগ্য পণ্যগুলো আমরা সাজিয়ে বাজারের দৃশ্যমানতা এবং কমিউনিটির উপর ভিত্তি করে ফ্রেম ওয়ার্ক এবং টুলষ্ট্যাক গুলো বাছাই করেছি।

নেটিভ বা সহজাত টুলকিট সমুহঃ

Apple Xcode : (iOS)

আপেলের পূর্ণ বৈশিষ্ট্যযুক্ত ডেভেলপমেন্ট এনভায়রনমেন্ট আপনাকে মোবাইল অ্যাপস এবং একই সাথে ডেস্কটপ এপ্লিকেশন তৈরী করতে দেয়। Xcode সমন্বিত সাপোর্ট দেয় Git সোর্স কোড ভান্ডারকে এবং গ্রাফিক্যাল এডিটরকে ইউজার ইন্টারফেস, ইন্সট্রুমেনটেশান, ডিবাগিং টুলস এবং ইন্টিগ্রেটেড ডকুমেন্টেশন তৈরিতে। XCode চালানোর জন্য আপনার Mac OS X এর প্রয়োজন এবং এটা চার্জ মুক্ত।

IntelliJ AppCode: (iOS)

IntelliJ IDEA এর স্রষ্টা Jetbrains অবজেক্টিভ সি ডেভেলপমেন্ট এর একটি এনভাইরনমেন্ট প্লাটফর্ম দিয়ে থাকে। ফ্লাই কোড বিশ্লেষণ, ডিবাগিং এবং আরো অনেক ক্ষেত্রে তাদের Java IDE এর মতন AppCode আরো সম্প্রসারিত রিফ্যাক্টরিং কেপাবিলিটি নিয়ে আসে। আপনি একটি ট্রায়াল ভার্সন ডাউনলোড বা $ 89 থেকে লাইসেন্স কিনতে পারেন ।

Android Sudio (Android):

এটিও IntelliJ IDEA এর উপর ভিত্তি করে একটি অ্যান্ড্রয়েড স্টুডিও। অ্যান্ড্রয়েড স্টুডিও সাপোর্ট করে Gradle build, Lint tools, প্রো-গার্ড অ্যাপ্লিকেশন সাইনিং টুলস কমন অ্যাপসকম্পোনেন্টস এর জন্য টেম্পল বেইজড উইজার্ড। বর্তমানে অ্যান্ড্রয়েড স্টুডিও একটি আর্লি বার্ড সংস্করণ হিসাবে বিনামূল্যে ডাউনলোড করা যাবে.

Android Developer Tools for Eclipse (Android)

অ্যান্ড্রয়েড ডেভেলপার টুলস (ADT) প্লাগইন এর সাহায্যে, Android এর অ্যাপ্লিকেশন উন্নয়নের জন্য Eclipse পূর্ণ সমর্থন লাভ করেছে । অ্যান্ড্রয়েডের নির্দিষ্ট কোডিং সমর্থন প্রদানের পাশাপাশি ADT ডেভেলপারদের বিভিন্ন অন ডিভাইস ডিবাগিং টুলস, গ্রাফিকাল UI বিলডার, ইমুলেটরস বা সম্পূর্ণরূপে স্ক্রিপ্টেবল টেস্ট অটোমেশন সাপোর্ট দেয় । ADT প্লাগইন বিনামূল্যে ব্যাবহার করা যায়।

Microsoft Visual Studio Express (Windows Phone)

মাইক্রোসফট, ডট নেট এর সাথে উইন্ডোজ ফোন অ্যাপ্লিকেশন ডেভেলপিং এর জন্য একটি ভিন্ন ভিস্যুয়াল স্টুডিও প্রস্তাব করে। ভিসুয়াল স্টুডিও এক্সপ্রেস একসাথে অনুমোদিত ভিসুয়াল স্টুডিও ফাংশনালিটির কাজ করে উইন্ডোজ ফোন স্পেসেফিক টুলিং যেমন গ্রাফিকাল UI বিলডার অথবা ফোন ইমুলেটর এর সাথে।ভিসুয়াল স্টুডিওর 90 দিনের একটি ট্রায়াল সংস্করণ আছে যা মাইক্রোসফট উইন্ডোজ 8 (x64) এর সাথে চালানো যেতে পারে।

Windows Phone App Studio (Windows Phone)

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

Adobe PhoneGap / Apache Cordova (cross-platform, hybrid)

এ্যাপাচি Cordova একটি ওপেন সোর্স ফ্রেমওয়ার্ক যা মোবাইল ডিভাইসে একটি বিশেষ লোকাল কনটেইনার এর ভিতরে এইচটিএমএল / জাভাস্ক্রিপ্ট ভিত্তিক অ্যাপ্লিকেশন চালানোর জন্য ব্যাবহার হয়। লোকাল ডিভাইস কার্যকারিতা জাভাস্ক্রিপ্ট API এবং এইচটিএমএল ভিত্তিক অ্যাপ্লিকেশনের মাধ্যমে উন্মুক্ত হয় যা সেন্সর বা ক্যামেরার মত নির্দিষ্ট ফাংশন গুলোকে এক্সেস করতে পারে। PhoneGap তার কোর হিসাবে Cordova ব্যবহার করে এবং ডেভেলপারদের ক্লাউডে অ্যাপ্লিকেশন নির্মাণ করতে দেয় লোকাল SDK এর ইনস্টল করার প্রয়োজনীয়তা ছাড়াই। বেসিক PhoneGap ফাংশনালিটি এবং এ্যাপাচি Cordova বিনামূল্যে ব্যাবহারযোগ্য।

Adobe Flex (cross-platform, app engine)

PhoneGap এর পাশাপাশি, মোবাইল অ্যাপ্লিকেশন তৈরি করার জন্য অ্যাডোবির ফ্লেক্স রয়েছে। অ্যাডোবি ফ্ল্যাশ বিলডার দিয়ে অ্যাপ্লিকেশন ডেভেলপ করা যেতে পারে এবং লোকাল ডিভাইসে অ্যাক্সেসর ক্ষমতা রয়েছে।ফ্ল্যাশ বিলডার কোড টেম্পলেট, জেনারেশন, সিগনেচার টুলিং এবং ডিবাগিং সাপোর্ট এর মাধ্যমে ডেভেলপমেন্ট প্রসেস কে সাহায্য করে।ফ্ল্যাশ বিলডার প্রিমিয়াম $ 699 দিয়ে ম্যাক অপারেটিং সিস্টেম এবং উইন্ডোজের জন্য পাওয়া যায়।

Unity (cross-platform, app engine)

গেমিং এর ক্ষেত্রে, Unity ডেভেলপারদের অনেক প্ল্যাটফর্মের জন্য সিঙ্গেল কোড বেজড এপ্লিকেশন তৈরী করার সুযোগ দেয়। অডিও, অ্যানিমেশন বা পদার্থবিদ্যা জন্য উন্নত বিল্ট ইন সমর্থন ছাড়াও এপ্লিকেশন ফ্রাগমেন্ট কেনার জন্য Unity সমৃদ্ধশালী শপ হোষ্ট করে। Unity কেনা যাবে $ 1500 দিয়ে বা $ 75 দিয়ে মাসিক বেস এর উপর।

AppGuyver Steroids.js (cross platform, hybrid)

Steroids.js ব্যাবহার করা যেতে পারে ক্রস প্ল্যাটফর্ম HTML5 ভিত্তিক অ্যাপ্লিকেশন যেমন PhoneGap তৈরি করতে এবং তার কোর হিসাবে এটি এ্যাপাচি Cordova ব্যবহার করে । Cordovas এর কার্যকারিতা প্রসারিত করতে এবং পারফর্মেন্স বাড়ানোর জন্য এটি লোকাল UI কম্পোনেন্ট, নেভিগেশন এবং এনিমেশন কে এক্সেস করতে দেয়। Steroids.js ফ্রি, এছাড়া অটোমেটিক অ্যাপসষ্টোর আপডেট অথবা এপগুলোর এর এড-হক শেয়ারিং এর জন্য অতিরিক্ত ক্লাউড ভিত্তিক সার্ভিস কেনা যাবে।
এইচটিএমএল5 ও জাভাস্ক্রিপ্ট ভিত্তিক ফ্রেমওয়ার্ক:

jQuery Mobile

jQuery মোবাইল একটি জাভাস্ক্রিপ্ট ফ্রেমওয়ার্ক যা টাচ সক্রিয় HTML ওয়েবসাইট তৈরিতে ব্যাবহার করা যায়। সাইটগুলো স্বয়ংক্রিয়ভাবে রেস্পন্সিভ এবং ব্যাপক পরিসরের ফোন ও ট্যাবলেট এর উপর ব্যবহার করা যেতে পারে। jQuery মোবাইল ওপেন সোর্স এবং বিনা মূল্যে ব্যবহার হয়।

Sencha Touch

jQuery মোবাইল অনুরূপ সেঞ্চা টাচ এর রয়েছে বিস্তৃত পরিসরের রেডি টু ইউস এইচটিএমএল উইজেট যা পরিপূর্ণ HTML5 অ্যাপ্লিকেশন তৈরি করতে পারে। সেঞ্ছা ইউজার দের হাই পারফর্মেন্স অভিজ্ঞতা দিতে অধিক গুরুত্ব দেয়। পিউর সেঞ্চা টাচ ফ্রেমওয়ার্ক ফ্রি যেখানে স্ট্যান্ডার্ড সাপোর্টের সেঞ্চা টাচ বাণ্ডলের লাইসেন্স মূল্য শুরু হয় $ 695 থেকে।

Dojo Mobile

Dojo টুলকিট একটি ডাটা বাইন্ডিং সহ MVC ফ্রেমওয়ার্ক যা মোবাইল অ্যাপস তৈরি করে।এর রয়েছে বিভিন্ন প্রি ডিফাইন উইজেট যেমন স্লাইডার বা সুইচ সাথে জনপ্রিয় মোবাইল প্ল্যাটফর্মের যা ব্যাবহারকারীকে সহজাত লুক এবং অনুভুতি দিয়ে থাকে। এটি অ্যাপ্লিকেশন প্যাকেজ এর জন্য PhoneGap এর সঙ্গে ব্যবহার করা যেতে পারে. এবং অ্যাপসস্টোরে পাবলিশ করা যায়। Dojoবিনামূল্যে ব্যাবহার করা যায়।
ক্রস কম্পাইলেশান এবং জেনারেটিং

Xtend (Android)

Xtend জাভা সোর্স কোড কম্পাইল করে, এর রয়েছে জেনারেশন ফিচার যা ডেভেলপারদের বয়লার-প্লেট কোড ছাড়াই অ্যানড্রইড প্ল্যাটফর্মের জন্য অ্যাপ্লিকেশন তৈরি করার সুযোগ দেয়।

Apportable

ডেভেলপারগণ iOS এর জন্য Objective-C তে অ্যাপ্লিকেশন লিখতে পারে এবং অ্যানড্রইড এর সাথে ক্রস কম্পাইল করতে পারেন।Apportable কোনো ভার্চুয়াল মেশিন বা এমুলেটর ব্যবহার করে না কিন্তু অ্যান্ড্রয়েড ডিভাইসের জন্য নেটিভ মেশিন কোড জেনারেট করে। সীমিত কার্যকারিতার সেট বিনামূল্যে ব্যাবহার করা যায় কিন্তু ফুল ফিচার সেট ব্যাবহার করতে চায়লে বাৎসরিক ভিত্তিতে ক্রয় করা আবশ্যক।

Xamarin

Apportable এর মতন, Xamarin ডেভেলপারদেরএকাধিক প্ল্যাটফর্মের জন্য এপ্লিকেশন তৈরী করার সুযোগ দেয়। এপ্লিকেশন সি শার্প এ লেখা যেতে পারে এবং নেটিভ Android ও iOS বাইনারির সাথে ক্রস-কম্পাইল করা যাবে। এমনকি সি শার্প কোডের অন্তর্গত ডিভাইসের স্পেসেফিক API এবং ফাংশনালিটিও ব্যবহার সম্ভব. Xamarin এর লাইসেন্সবাৎসরিক ভিত্তিতে কিনতে হয়।
কমপ্লিট সলিউশান ষ্ট্যাক

Appcelerator

Appcelerator টাইটানিয়াম শুধুমাত্র HTML5 ভিত্তিক মোবাইল অ্যাপস তৈরির জন্য জাভাস্ক্রিপ্ট API- এবং MBC ফ্রেমওয়ার্ক সমৃদ্ধ নয় এটি একটি ইন্টিগ্রেটেড ডেভেলপমেন্ট এনভায়রনমেন্ট এবং একটি মোবাইল ব্যাকএন্ড সার্ভিসের (MBaaS) প্লাটফর্ম। ডেভেলপারগন অ্যাপসতৈরি বিতরন এবং তাদের বিভিন্ন সার্ভিস যেমন SAP অথবা সিকিউর এবং স্কেলেবল MBaaS কানেকশনের মাধ্যমে PayPal ব্যাবহার যুক্ত করতে টাইটেনিয়াম ব্যাবহার করতে পারে। Appcelerator ব্যক্তিগত ডেভেলপারদের দ্বারা বিনামূল্যে জন্য ব্যবহার করা যেতে পারে, এন্টারপ্রাইজ পরিকল্পনা SLAs এবং কার্যকারিতা উপর নির্ভর করে.

IBM Worklight

আইবিএম Worklight ইকো-সিস্টেমের মধ্যে অ্যাপ্লিকেশনগুলো HTML5 / Javascript এপস যারা Dojo, সেঞ্চা, jQuery এবং PhoneGap এর ফ্রেম ওয়ার্ক ব্যাবহার করছে। এছাড়া Worklight ডেভেলপমেন্ট এবং ম্যানেজমেন্ট টুলস সমৃদ্ধ যা ক্লাউড ভিত্তিক ব্যাকএন্ড সার্ভিসে এক্সেস করতে পারে।
ইন্সটলেশন প্লাটফর্ম এবং মোবাইল ক্লাইন্ট এর সংখ্যার উপর ভিত্তি করে এর মূল্য নির্ধারিত হয়।

SAP Mobile Platform

এসএপি মোবাইল প্ল্যাটফর্ম মোবাইল অ্যাপ্লিকেশন ডেভেলপমেন্ট এবং এডমিনিসট্রেশান সাপোর্ট দেয় যা এসএপি এন্টারপ্রাইজ সিস্টেমে এক্সেস করতে পারে।বিভিন্ন প্রযুক্তিগত ষ্ট্যাক এর উপর B2B, B2E এবং B2C অ্যাপ্লিকেশন তৈরি করা সম্ভব।

Salesforce1

এসএপি এর মতন, Salesforce তার সার্ভিসগুলোর সাথে ইন্টিগ্রেটেড অ্যাপসসিস্টেম হিসেবে কানেক্ট থাকে। অ্যাপ্লিকেশনগুলো নেটিভ, হাইব্রিড এবং HTML5 অ্যাপ্লিকেশন অথবা বিদ্যমান মোবাইল অ্যাপস হিসেবে তৈরি করা যেতে পারে।

 

জাভাস্ক্রিপ্ট অ্যাসাইনমেন্ট JavaScript Assignment

জাভাস্ক্রিপ্ট অ্যাসাইনমেন্ট অপারেটর

অ্যাসাইনমেন্ট অপারেটর ভেরিয়েবল এর মান নির্ধারণ করে।

অপারেটর উদাহরণ একই হিসাবে
= x = y x = y
+= x += y x = x + y
-= x -= y x = x – y
*= x *= y x = x * y
/= x /= y x = x / y
%= x %= y x = x % y

 

= অ্যাসাইনমেন্ট অপারেটরটি ভেরিয়েবল এর মান নির্ধারণ করে।


var x = 10;


 

 

+= অ্যাসাইনমেন্ট অপারেটরটি ভেরিয়েবল এর সাথে একটি মান যোগ করে।


var x = 10;
x += 5;


 

 

-= অ্যাসাইনমেন্ট অপারেটরটি ভেরিয়েবল থেকে একটি মান বিয়োগ করে।


var x = 10;
x -= 5;


 

 

*= অ্যাসাইনমেন্ট অপারেটরটি ভেরিয়েবল এর সাথে একটি মান গুণন করে।


var x = 10;
x *= 5;


 

 

/= অ্যাসাইনমেন্ট অপারেটরটি ভেরিয়েবলকে একটি মান দ্বারা ভাগ করে।


var x = 10;
x /= 5;


 

 

%= অ্যাসাইনমেন্ট অপারেটরটি ভেরিয়েবলকে একটি মান দ্বারা ভাগ করে ভাগশেষ প্রদান করে।


var x = 10;
x %= 5;


 

 

গাণিতিক জাভাস্ক্রিপ্ট (JavaScript Arithmetic)

গাণিতিক জাভাস্ক্রিপ্ট (JavaScript Arithmetic)

সাধারণভাবে সংখ্যা নিয়ে কাজ করাই হচ্ছে গাণিতিক

জাভাস্ক্রিপ্ট গাণিতিক অপারেটরস

গাণিতিক অপারেটর সংখ্যা (আক্ষরিক বা ভেরিয়েবল) নিয়ে গাণিতিক কার্য সম্পাদন করে।

 

অপারেটর বর্ণনা
+ যোগ
বিয়োগ
* গুণ
/ ভাগ
% ভাগশেষ
++ বৃদ্ধি
হ্রাস

 

গাণিতিক অপারেশন

একটি সাধারণ গাণিতিক অপারেশন দুটি সংখ্যার উপর কাজ করে।

সংখ্যা দুইটি লিটারেল (স্বাভাবিক সংখ্যা) হতে পারে

উদাহরণ


var x = 100 + 50;


 

বা ভেরিয়েবল

উদাহরণ


var x = a + b;


অথবা এক্সপ্রেশন (রাশিমালা)


var x = (100 + 50) * a;


 

 

অপারেটর ও অপারেন্ডস (অপারেশন বা কার্যসম্পাদনের সংখ্যা)

সংখ্যাকে (গাণিতিক অপারেশন এ) বলা হয় অপারেন্ডস।

অপারেশন (ক্রিয়াপ্রণালী) (দুইটি অপারেন্ডস এর মধ্যে সম্পন্ন হয়) কে বলা অপারেটর দ্বারা সংঙ্গায়িত করা হয়।

অপারেন্ড অপারেটর অপারেন্ড
100 + 50

এডিশন (যোগ) অপারেটর সংখ্যাগুলোকে যোগ করে


var x = 5;
var y = 2;
var z = x + y;


সাবস্ট্রাকশন (বিয়োগ) অপারেটর সংখ্যাগুলোকে বিয়োগ করে


var x = 5;
var y = 2;
var z = x – y;


 
মাল্ডিপ্লিকেশন (গুণ) অপারেটর সংখ্যাগুলোকে গুণ করে


var x = 5;
var y = 2;
var z = x * y;


ডিভিশন (ভাগ) অপারেটর সংখ্যাগুলোকে ভাগ করে


var x = 5;
var y = 2;
var z = x / y;


মডুলার (ভাগশেষ) অপারেটর ভাগশেষ প্রদান করে


var x = 5;
var y = 2;
var z = x % y;


ইনক্রেমেন্ট অপারেটর সংখ্যার মান বৃদ্ধি করে


var x = 5;
x++;
var z = x;


ডিক্রিমেন্ট অপারেটর সংখ্যার মান হ্রাস করে


var x = 5;
x–;
var z = x;


 

 

অপারেটর প্রাধান্য (Operator Precedence)

কোন অপারেটর এর কাজ আগে সম্পন্ন হবে তা গাণিতিক নিয়ম অনুযায়ীই সম্পন্ন হয়।


var x = 100 + 50 * 3;


 

এর ফলালাল কি 130*3 এর সমান নাকি 100 + 150 এর সমান?

যোন নাকি গুণ এর কাজ আগে সম্পন্ন হবে?

প্রথাগত স্কুল এর গণিত এর নিয়ম অনুসারে গুণ এর কাজ আগে সম্পন্ন হবে।

গুণ (*) এবং ভাগ (/) কে যোগ (+) এবং বিয়োগ (-) এর থেকে অধিক প্রাধান্য দেয়া হয়।

এবং (স্কুল গণিতের নিয়ম অনুসারে) বন্ধনি চিহ্ন প্রদানের মাধ্যমে প্রাধান্য পরিবর্তণ করা যায়।

উদাহরণ


var x = (100 + 50) * 3;


 

বন্ধনি চিহ্ন ব্যবহার কররে বন্ধনির ভিতরের কার্য আগে সম্পন্ন হয়।
যখন অনেকগুলো অপারেশন সমগুরুত্বের হয় (যেমন গুণ এবং ভাগ), তারা বাম এরটি আগে এবং ক্রমান্নয়ে ডানেরগুলো নির্ণয় করে।
উদাহরণ


var x = 100 + 50 – 3;


 

 

গাণিতিক অপারেটর প্রাধান্য

নিম্নের টেবিলে উচ্চ হতে নিম্ন প্রাধান্য অনুসারে জাভাস্ক্রিপ্ট এর গাণিতিক অপারেটর এর তালিকা প্রদান করা হয়েছে।

অপারেটর প্রাধান্য
( ) বন্ধনি
++ — বৃদ্ধি এবং হ্রাস
* / % গুণন, বিভাজন, এবং ভাগশেষ
+ – যোগ এবং বিয়োগ

নোট : প্রথম বন্ধনির মধ্যকার অংশ অন্য যেকোন অংশের পূর্বে নির্ণয় করা হয়।

জাভাস্ক্রিপ্ট টিউটোরিয়াল JavaScript Tutorial

জাভাস্ক্রিপ্ট টিউটোরিয়াল JavaScript Tutorial

  • জাভাস্ক্রিপ্ট হচ্ছে এইচটিএমএল ও ওয়েব এর একটি প্রোগ্রামিং ভাষা।
  • প্রোগ্রামিং ভাষা আপনি কম্পিউটারকে যেভাবে কাজ করাতে চান সেভাবে কাজ করায়।
  • জাভাস্ক্রিপ্ট শেখা সহজ।
  • এই টউটোরিয়ালটি আপনাকে প্রাথমিক থেকে উচ্চতর জাভাস্ক্রিপ্ট শেখাবে।

 

প্রতি অধ্যায় এ উদাহরণ

প্রতি অধ্যায় এ উদাহরণ সন্নিবেশিত করা হয়েছে।

যেমন:


<!DOCTYPE html>
<html>
<body>
<h1>My First JavaScript</h1>
<button type="button"
onclick="document.getElementById('demo').innerHTML = Date()">
Click me to display Date and Time.</button>
<p id="demo"></p>
</body>
</html>

ফলাফল


My First JavaScript


 

উদাহরণ এর সাহায্যে শেখা

উদাহরণ 1000 শব্দ দ্বারা বর্ণনা করা থেকেও ভাল। শেখার জন্য অনেক ক্ষেত্রে উদাহরণ ব্যাখ্যা দেখে শেখার চেয়েও সহজতর।

নোট: আপনি যদি সকল উদাহরণ ব্যবহার করে দেখেন, তাহলে আপনি খুব অল্প সময়ে জাভাস্ক্রিপ্ট সম্পর্কে প্রচুর জানতে পারবেন।

 

জাভাস্ক্রিপ্ট কেন শিখবেন?

জাভাস্ক্রিপ্ট হচ্ছে তিনটি ল্যাংগুয়েজ এর মধ্যে একটি যা প্রত্যেক ওয়েব ডেভেলপারকে অবশ্যই শিখতে হয়:

  1. HTML ওয়েব পেজ উপাদানগুলো সন্নিবেশিত করতে
  2. CSS ওয়েব পেজ এর বিন্যাস/সাজসজ্জা নির্দিষ্ট করতে
  3. JavaScript ওয়েব পেজ এর আচরণ প্রোগ্রামিং এর সাহায্যে নিয়ন্ত্রণ করতে

এই টিউটোরিয়ালটি হচ্ছে জাভাস্ক্রিপ্ট সম্পর্কে, এবং জাভাস্ক্রিপ্ট কিভাবে এইচটিএমএল এবং সিএসএস এর সাথে কাজ করে সে সম্পর্কে।

 

শেখার গতি

  • এই টউটোরিয়ার এ শেখার গতি আপনার পছন্দের উপর নির্ভর করে।
  • সবকিছুই আপনার উপর।
  • আপনি যদি কোন কিছু পুরোপুরি বুঝতে না পারেন তাহলে আপনি বিরতি নিতে পারেন বা পু্ণরায় পড়তে পারেন।
  • সবসময়ই নিশ্চিত হয়ে নিন যে আপনি উদাহরণগুলো বুঝতে পেরেছেন।

সফটওয়ার প্রকৌশলঃ সফটওয়ার বিশ্লেষণ ও ডিজাইন টুলস (Software Analysis & Design Tools)

সফটওয়ার প্রকৌশলঃ সফটওয়ার বিশ্লেষণ ও ডিজাইন টুলস
রিদওয়ান বিন শামীম

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

সফটওয়ার বিশ্লেষণ ও ডিজাইন মধ্যবর্তী ধাপ যা মানুষের পঠনযোগ্য ডকুমেন্টকে প্রকৃত কোডে রূপান্তরিত করে।

সফটওয়ার ডিজাইনাররা ব্যবহার করেন এমন কিছু বিশ্লেষণ ও ডিজাইন টুলস নিয়ে আলোচনা করা যাক।

ডাটা ফ্লো ডায়াগ্রামঃ কোন ইনফরমেশন সিস্টেমের ডাটা ফ্লোয়ের গ্রাফিক্যাল উপস্থাপনা হল ডাটা ফ্লো ডায়াগ্রাম। এটি গৃহীত ডাটা ফ্লো, বহির্গামী ডাটা ফ্লো ও সঞ্চিত ডাটা প্রকাশ করে। কীভাবে সিস্টেমে ডাটা ফ্লো প্রবাহিত হয় সেটি ডাটা ফ্লো ডায়াগ্রাম দেখায় না।

ডাটা ফ্লো ডায়াগ্রামের প্রকারঃ ডাটা ফ্লো ডায়াগ্রাম দুই প্রকার হয়, লজিকাল ও ফিজিকাল।

• লজিকাল ডাটা ফ্লো ডায়াগ্রামঃ সিস্টেমের প্রক্রিয়া ও সিস্টেমে ডাটা ফ্লোয়ের উপর মনোনিবেশ করে। যেমন, ব্যাংকিং সফটওয়ারে যেভাবে তথ্যগুলো বিভিন্ন সত্ত্বার মধ্যে চলাচল করে তা লজিকাল ডাটা ফ্লো ডায়াগ্রাম সিস্টেমের উদাহরণ।

• ফিজিকাল ডাটা ফ্লো ডায়াগ্রামঃ এটি দেখায় কীভাবে সিস্টেমে প্রয়োগ করা হয়, এটি প্রয়োগের দিক থেকে অনেক বেশি সংশ্লিষ্ট ও বিস্তারিতভাবে বিবৃত।

ডাটা ফ্লো ডায়াগ্রামের উপাদানঃ ডাটা ফ্লো ডায়াগ্রাম নিচের উপাদানগুলো ব্যবহার করে তথ্যের উৎস, গন্তব্য, স্টোরেজ, ও প্রবাহ প্রকাশ করতে পারে।

• সত্তাঃ বিভিন্ন সত্ত্বাগুলো তথ্যের উৎস ও গন্তব্য। ডাটা ফ্লো ডায়াগ্রামে একে সমকোণী চতুর্ভুজাকারে দেখানো হয়, তাদের সংশ্লিষ্ট নাম সহ।

• প্রক্রিয়াঃ তথ্যের উপর নেয়া পদক্ষেপ ও কার্যক্রম যা ডাটা ফ্লো ডায়াগ্রামে বৃত্ত বা গোলাকার কোনবিশিষ্ট চতুর্ভুজাকারে প্রকাশ করা হয়।

• ডাটা স্টোরেজঃ ডাটা ফ্লো ডায়াগ্রামে ডাটা স্টোরেজকে দুইভাবে দেখানো যেতে পারে, একে সমকোণী চতুর্ভুজাকারে দেখানো হয় যার ছোট বাহুদুটির একটি বা উভয়দুটিই অনুপস্থিত থাকতে পারে।

• ডাটা ফ্লোঃ ডাটার চলাফেরা তীরচিহ্ন দিয়ে প্রকাশ করা হয়, তীরের মাথা তথ্যের প্রবাহের দিক নির্দেশ করে।

ডাটা ফ্লো ডায়াগ্রামের লেভেলসমূহঃ

• লেভেল জিরোঃ ডাটা ফ্লো ডায়াগ্রামের সবচেয়ে বিমূর্ত লেভেলকে লেভেল জিরো দ্বারা প্রকাশ করা হয়,এটি সমস্ত তথ্যসিস্টেমকে অন্যান্য তথ্য ছাপিয়ে একটি মাত্র ডায়াগ্রামে প্রকাশ করে। একে কনটেক্সট লেভেল ডাটা ফ্লো ডায়াগ্রামও বলে।
• লেভেল ওয়ানঃ লেভেল জিরোকে আরও বিস্তারিত প্রকাশের জন্য ভেঙ্গে লেভেল ওয়ান দ্বারা প্রকাশ করা হয়। লেভেল ওয়ান সিস্টেমের মডিউল ও বিভিন্ন মডিউলে তথ্যের প্রবাহ প্রকাশ করে। মৌলিক প্রক্রিয়া ও তথ্যের উৎসও লেভেল ওয়ান প্রকাশ করে।
• লেভেল টুঃ লেভেল টুতে দেখানো হয় লেভেল ওয়ানে কীভাবে ডাটা ফ্লো সজ্জিত থাকে।

উঁচু শ্রেণীর ডাটা ফ্লো ডায়াগ্রাম বিভাজিত হতে হতে আরও বিস্তারিতভাবে নির্ধারিত নিচু শ্রেণীর ডাটা ফ্লো ডায়াগ্রামে বিশ্লেষিত হতে পারে যতক্ষণ পর্যন্ত না কাঙ্খিত মানের লেভেল পাওয়া যায়।

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

• মডিউলঃমডিউল কাজের প্রক্রিয়া বা সাবরুটিন বা কাজকেই প্রকাশ করে। কন্ট্রোল মডিউল একাধিক সাবমডিউলকে নিয়ন্ত্রণ করে। লাইব্রেরী মডিউল পুনরায় ব্যবহারযোগ্য ও অন্য মডিউলে তথ্যশেয়ারের যোগ্য ।
• কন্ডিশনঃ কাঠামো চার্টে মডিউলের নিচে হীরকাকৃতির চিহ্ন দ্বারা প্রকাশ করা হয়। কন্ট্রোল মডেল কিছু শর্তানুসারে যেকোনো সাবরুটিন নির্দেশ করতে পারে, এটিই কন্ডিশন নির্দেশ করে।
• জাম্পঃ মডিউলে একটি তীরচিহ্ন দ্বারা প্রকাশ করা হয়, এটি প্রকাশ করে কন্ট্রোল কোন সাবমডিউলের মাঝখানে নির্দেশিত হতে পারে।
• লুপঃএকটি বাঁকানো তীরচিহ্ন। সাবমডিউলের পুনরাবৃত্তিক অবস্থা প্রকাশে ব্যবহার করা হয়।
• ডাটা ফ্লোঃ লেজে ফাঁকা বৃত্তসহ তীরচিহ্নই ডাটা ফ্লো নির্দেশ করে।
• কন্ট্রোল ফ্লোঃ লেজে ভরাট বৃত্তসহ তীরচিহ্ন কন্ট্রোল ফ্লো নির্দেশ করে।

হিপো ডায়াগ্রামঃ HIPO (Hierarchical Input Process Output) ডায়াগ্রাম সিস্টেম বিশ্লেষণ ও ডকুমেন্টেশনের দুটি সুগঠিত পদ্ধতির সমন্বয়, ১৯৭০ সালে আইবিএম এই মডেলটি উদ্ভাবন করেছিল। হিপো ডায়াগ্রামে সফটওয়ার সিস্টেমের মডেলগুলোকে ক্রমানুসারে দেখানো হয়। বিশ্লেষকরা সিস্টেম ফাংশনের উঁচু মানের পর্যবেক্ষণের জন্য হিপো ডায়াগ্রাম ব্যবহার করে থাকেন। এটি ফাংশনকে স্তরবিন্যাসগত পদ্ধতিতে সাবফাংশনে ভাগ করে। এটি সিস্টেমের কৃত ফাংশন প্রকাশ করে।

ডকুমেন্টেশনের জন্য হিপো ডায়াগ্রাম খুব উপযোগী, এর গ্রাফিক্যাল রিপ্রেজেন্টেশন সিস্টেম কাঠামোর দৃশ্যমান পরিকল্পনা করতে ডিজাইনার ও ব্যবস্থাপকদের সহায়তা করে থাকে।

আইপিও ডায়াগ্রামের(IPO,Input Process Output) তুলনায়, যেটি এক মডিউলে কন্ট্রোল ফ্লো ও ডাটা প্রকাশ করে, হিপো ডায়াগ্রাম কোন ডাটা ফ্লো বা কন্ট্রোল ফ্লোয়ের কোন তথ্য প্রকাশ করে না।

উদাহরণঃ হিপো ডায়াগ্রামের দুটি অংশ, স্তরবিন্যাসগত প্রেজেন্টেশন ও আইপিও চার্ট দুটিই সফটওয়ার প্রোগ্রামের কাঠামোগত ডিজাইন ও ডকুমেন্টেশনের জন্য ব্যবহৃত হয়।

কাঠামোগত ইংরেজিঃ বেশিরভাগ প্রোগ্রামারই সফটওয়ারের বৃহৎ চিত্র সম্পর্কে ধারণা করতে পরে না তাই তাদের ব্যবস্থাপকের নির্দেশনার উপর নির্ভর করে থাকতে হয়।
উচ্চতর সফটওয়ার ব্যবস্থাপনার দায়িত্ব হল প্রোগ্রামারদের পর্যাপ্ত তথ্য সরবরাহ করা যেন তারা দ্রুত কিন্তু নির্ভুল কোড ডেভেলাপ করতে পারেন।

অন্যান্য পদ্ধতি যেগুলো ডায়াগ্রাম বা গ্রাফ ব্যবহার করে গঠিত, সেগুলো বিভিন্ন মানুষের কাছে বিভিন্ন অর্থ প্রকাশ করতে পারে।

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

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

কাঠামোগত ইংরেজি কাঠামোগত প্রোগ্রামিং প্রেক্ষাপটে বিশুদ্ধ ইংরেজি শব্দ ব্যবহার করে। এটি বিশুদ্ধ কোড নয় কিন্তু কোডিঙের জন্য কি দরকার আর কীভাবে দরকার তার বিবরণ এর সাথে সম্পর্কযুক্ত। কাঠামোগত প্রোগ্রামিংএর কিছু টোকেন নিম্নরূপ,
IF-THEN-ELSE,
DO-WHILE-UNTIL
বিশ্লেষকরা একই চলক ও নাম ব্যবহার করেন যা ডাটা ডিরেক্টরিতে সংরক্ষিত থাকে এবং কোড বোঝা ও লিখা সহজ করে।

উদাহরণঃ অনলাইন বাণিজ্যিক পরিবেশে গ্রাহক প্রত্যয়ন লাভের জন্য কোন প্রোগ্রামে কাঠামোগত ইংরেজিতে লিখা যেতে পারে,
Enter Customer_Name
SEEK Customer_Name in Customer_Name_DB file
IF Customer_Name found THEN
Call procedure USER_PASSWORD_AUTHENTICATE()
ELSE
PRINT error message
Call procedure NEW_CUSTOMER_REQUEST()
ENDIF

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

সিওডো কোডঃ সিওডো কোড প্রোগ্রামিং ল্যাঙ্গুয়েজের কাছাকাছি ভাবে লেখা হয়। একে মন্তব্য ও বিবরণে সমৃদ্ধ তুলনামূলক প্রোগ্রামিং ল্যাঙ্গুয়েজ বলে ধরা যায়। সিওডো কোড চলক বিবৃতি এড়িয়ে চলে কিন্তু C, Fortran, Pascal এসব মৌলিক প্রোগ্রামিং ল্যাঙ্গুয়েজের উপাদান ব্যবহার করে।

সিওডো কোড কাঠামোগত ইংরেজির চেয়ে বেশি প্রোগ্রামিং ডিটেলস ব্যবহার করে, এটি কাজ করার জন্য এমন একটি পদ্ধতি ব্যবহার করে যাতে করে কম্পিউটার কোডগুলোকে সম্পাদন করতে পারে।

উদাহরণঃ ফিবনাচ্চি সংখ্যারাশিকে n পর্যন্ত প্রিন্ট করতে যে কোড লিখব তা হল,
void function Fibonacci
Get value of n;
Set value of a to 1;
Set value of b to 1;
Initialize I to 0
for (i=0; i< n; i++)
{
if a greater than b
{
Increase b by a;
Print b;
}
else if b greater than a
{
increase a by b;
print a;
}
}
ডিসিশন টেবিলঃ ডিসিশন টেবিল সংবদ্ধ উপায়ে কন্ডিশন ও তা সম্পন্ন করার জন্য কার্যাবলী প্রকাশ করে। এটি সংশোধন ও ভুল এড়ানোর ক্ষেত্রে একটি শক্তিশালী টুল। এটি সদৃশ তথ্যগুলোকে গ্রুপে সাজিয়ে একটি টেবিলে সাজাতে সাহায্য করে, এরপর টেবিলগুলোকে একসাথে করে সহজ ও সুবিধাজনক সিদ্ধান্ত নিতে সাহায্য করে।
ডিসিশন টেবিল তৈরি করাঃ ডিসিশন টেবিল তৈরি করতে প্রোগ্রামারদের চারটি মৌলিক নিয়ম মেনে চলতে হয়,
• সম্ভাব্য সব কন্ডিশন খুঁজে বার করা,
• সব কন্ডিশনের জন্য কর্মপন্থা খুঁজে বার করা,
• সম্ভাব্য সর্বাধিক নিয়ম তৈরি করা,
• প্রত্যেক নিয়মের জন্য কর্মপন্থা খুঁজে বার করা

এন্ড ইউজারদের দ্বারা ডিসিশন টেবিল ভেরিফাই করাতে হয়। পরে ডুপ্লিকেট নিয়ম ও কর্মকাণ্ড খুঁজে বের করে বাদ দিয়ে প্রক্রিয়া সহজ করে ফেলা যায়।

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

Conditions/Actions Rules
Conditions Shows Connected N N N N Y Y Y Y
Ping is Working N N Y Y N N Y Y
Opens Website Y N Y N Y N Y N
Actions Check network cable X
Check internet router X X X X
Restart Web Browser X
Contact Service provider X X X X X X
Do no action

এনটিটি রিলেশনশিপ মডেলঃ এনটিটি রিলেশনশিপ মডেল একধরনের ডাটাবেস মডেল যেটি বাস্তব জগতের সত্ত্বা ও তাদের মধ্যেকার সম্পর্কের ধারনাকে কাজে লাগানো হয়েছে।আমরা বাস্তব জগতের সত্ত্বাকে এনটিটি রিলেশনশিপ মডেলের মাধ্যমে তুলে ধরতে পারি। এনটিটি রিলেশনশিপ মডেল স্বতন্ত্র সত্ত্বা ও তাদের প্রয়োগের একটি সেট তৈরি করে, সীমাবদ্ধতার একটি সেট তৈরি করে তাদের মধ্যে সম্পর্ক বিবৃত করে।

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

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

• এক থেকে এক
• এক থেকে অনেক
• অনেক থেকে এক
• অনেক থেকে অনেক
ডাটা ডিকশনারিঃ ডাটা ডিকশনারি ডাটা সম্পর্কিত তথ্যের কেন্দ্রীভূত সমষ্টি। এটি ডাটার উৎস ও অর্থ, অন্য ডাটার সাথে সম্পর্ক, ডাটার প্রায়োগিক ফরম্যাট ইত্যাদি সংরক্ষণ করে। ডাটা ডিকশনারি সকল নামের বিবৃতি কঠোরভাবে ও সংগঠিতভাবে সংরক্ষণ করে ডিজাইনার ও ব্যবহারকারীদের সুবিধার জন্য। ডাটা ডিকশনারিকে মেটা ডাটা(তথ্য বিষয়ে তথ্য!) সংগ্রহস্থলও বলা হয়। এটি সফটওয়ার প্রোগ্রামের ডাটা ফ্লো ডায়াগ্রামের সাথে তৈরি হয় এবং ডাটা ফ্লো ডায়াগ্রামের সাথেই আপডেটও হতে পারে।
ডাটা ডিকশনারির প্রয়োজনীয়তাঃ সফটওয়ার ডিজাইন ও প্রয়োগের সময় ডাটা ডিকশনারির সাহায্যে ডাটা সমন্বয় করা হয়, কোন অস্পষ্টতা থাকলে ডাটা ডিকশনারির সাহায্যে তা দূর করা হয়। প্রোগ্রামের সর্বত্র একই ধরণের অবজেক্ট রেফারেন্স ব্যবহার করার সময় এটি প্রোগ্রামার ও ডিজাইনারদের সাহায্য করে থাকে।
ডাটা ডিকশনারি পুরো ডাটাবেস সিস্টেমকে এক জায়গায় ডকুমেন্টেশন করতে সাহায্য করে। ডাটা ফ্লো ডায়াগ্রামের ভ্যালিডেশন ও ডাটা ডিকশনারির সাহায্যে হয়।
উপাদানঃ ডাটা ডিকশনারি যে বিষয়গুলোর তথ্য রাখতে পারে সেগুলো হল,
• ডাটা ফ্লো
• ডাটা কাঠামো
• ডাটার উপাদান
• ডাটা সংরক্ষণ
• ডাটা প্রক্রিয়াকরণ

ডাটা ফ্লো, ডাটা ফ্লো ডায়াগ্রামের নিয়ম মেনে চলে ও নিচে বর্ণিত গাণিতিক প্রকরণ মেনে চলে।
= Composed of
{} Repetition
() Optional
+ And
[ / ] Or

উদাহরণঃ ঠিকানা=বাড়ি নং+রাস্তা/ এলাকা+নগর+রাষ্ট্র।
কোর্স আইডি=কোর্স নাম্বার+কোর্স নাম+কোর্স লেভেল+কোর্স গ্রেড।

ডাটার উপাদানঃ ডাটার নাম ও বর্ণনা ডাটার উপাদানের অন্তর্ভুক্ত যাতে উপাদান, অভ্যন্তরীণ বা বাইরের ডাটা স্টোরেজ সহ নিচের বর্ণনাগুলিও সংশ্লিষ্ট ।

• প্রাথমিক নাম
• মাধ্যমিক নাম(Alias)
• ব্যবহার বিধি
• উপাদানের বর্ণনা
• সম্পুরক তথ্য(পূর্বনির্ধারিত ভ্যলু,সীমাবদ্ধতা ইত্যাদি)

ডাটা সংরক্ষণঃ এটি সেখানে তথ্য সংরক্ষণ করে যেখানে সিস্টেমের তথ্য আসে ও যেখান থেকে তথ্য চলে যায়। ডাটা সংরক্ষণে যে বিষয়গুলো থাকে তা হল,
ফাইলঃ
• অভ্যন্তরীণ থেকে সফটওয়ারে
• বাইরে থেকে সফটওয়ারে কিন্তু একই মেশিনে
• বাইরে থেকে সফটওয়ার ও সিস্টেমে, ভিন্ন মেশিনে।

টেবিলঃ
• নামের সন্নিবেশ
• বৈশিষ্ট্য লিপিবদ্ধকরণ
ডাটা প্রক্রিয়াকরণঃ দুই ধরণের ডাটা প্রক্রিয়াকরণ দেখা যায়,
লজিকালঃ ব্যবহারকারী দেখতে পারেন।
ফিজিকালঃ সফটওয়ার দেখতে পায়।

তথ্যসূত্রঃ http://www.tutorialspoint.com/software_engineering/software_analysis_design_tools.htm