know yourselves. information, computer, 7 wonders, various.

Saturday, March 7, 2020

JavaScript_part7_জাভাস্ক্রিপ্ট লুপ, While loop, Do while লুপ ও For loop ব্যবহার



জাভাস্ক্রিপ্ট লুপ (loop)
একই Statement বারবার না লিখে Loop এর মাধ্যমে একাধিক বার ব্যবহার করা যায়।  যখন একটি শর্ত সত্য হয় তখন প্রোগ্রামটি বারবার চলতে থাকে শর্তটি মিথ্যা হওয়া মাত্র লুপটি বন্ধ হয় অর্থাৎ প্রোগ্রামটি থেমে যায়। জাভাস্ক্রিপ্ট এ মোট ৩ ধরনের Loop ব্যবহার করা হয় ।
1.      While
2.      do ...... while
3.      for
While loop:
While লুপ কে While statementও বলা হয়। While লুপ এ প্রথমেই Condition (শর্ত) থাকে, যদি শর্তটি সত্য হয় তবে While লুপটি এক্সিকিউশন হওয়া শুরু করে এবং অন্যান্য কোডিং অনুসারে কাজ করে। যদি Condition (শর্ত)টি সত্য না হয় তবে প্রোগ্রাম থেমে যায়।
While লুপের Structure নিন্মরূপ
While (Condition)
{
            Statements
}
এবার While loop ব্যবহার করে প্রোগ্রাম লিখব।
প্রোগ্রামঃ While loop ব্যবহার
১।        আপনার এডিটরে নিচের কোডিং এর মত করে প্রোগ্রাম লিখুন । এবার ফাইলটিকে কে একটি নির্দিষ্ট  নামে  সেভ করুন। আমরা এখানে program_0028.html নামে সেভ করেছি
<html>
<head>
<title>While Example</title>
<script type="text/JavaScript">
function CalculateLoop()
{
var number=document.getElementById("txtNumber").value;
number=parseInt(number);
var i=1;
while(i<=number)
{
document.write("The Line Number is "+i);
document.write("<br/>");
i++;
}
}
</script>
<head>
<body>
Input  Number: <input type="text" id="txtNumber" /><br />
<button onclick="CalculateLoop();">OK</button>
</body>
</html>
৩।     ব্রাউজারে  program_0028.html ফাইলটিকে ওপেন করুন।

৪।        ইনপুট বক্সে যে কোন একটি নম্বর দিন।

৫।        OK বাটনে ক্লিক করুন। ঠিক তত সংখ্যক লাইন দেখতে পাবেন।
ব্যাখ্যা:   ইনপুট বক্স থেকে যে ভ্যালুটি নিলাম সেটি number ভেরিয়েবলে অ্যাসাইন করলাম। এবার  number-টিকে পূর্বের ন্যায় integer এ কনসার্ট করে নিলাম। কারণ আমাদের কন্ডিশনের চেক করার জন্য যে ভেরিয়েবলটি (i) নেওয়া সেটি  integer টাইপের ভেরিয়েবল । i=1 অ্যাসাইন করে নিলাম ।
বিঃদ্রঃ   কন্ডিশন চেক সব সময় এভাবেই টাইপ এর ভ্যালুর মধ্যে হতে হয়, ভিন্ন টাইপ দ্বারা কন্ডিশন চেক করা যায় না।
এবার while(i<=number)
ব্যাপারটা এরকম যে লুপটা ঘোরো ততক্ষণ পর্যন্তু, যতক্ষণ না i এবং number এর ভ্যালু সমান হয়।
এবার Statement এর মধ্যে document.write(“this is line number”+i) লাইন নাম্বার প্রিন্ট করার কোড।এবার ইনক্রিমেন্ট স্টেটমেন্ট i++ অর্থ্যাৎ একবার লুপ ঘরে i এর মান বৃদ্ধি দিল।
উপরোক্ত নিয়মে i এর মান বাড়তে বাড়তে number এর সমান হলে while লুপের মধ্যের স্টেটমেন্ট  Execute হবে না।
 While loop ব্যবহার
এবার while লুপ ব্যবহার করে ১ থেকে n পর্যন্তু যোগফলের একটি প্রোগাম দেখব।
১।        নিচের মত করে কোড লিখুন।
<html>
<head>
<title>While Example</title>
<script type="text/JavaScript">
function CalculateSum()
{
var number=document.getElementById("txtNumber").value;
number=parseInt(number);
var i=1;
sum=0;
document.write("This Seris is : ");
while(i<=number)
{
sum=sum+i;
document.write(" "+i);
i++;
}
document.write(" = "+sum);
}
</script>
<head>
<body>
Input  Number: <input type="text" id="txtNumber" /><br />
<button onclick="CalculateSum();">OK</button>
</body>
</html>
২।        কোডটিকে  একটি নির্দিষ্ট  নামে  সেভ করুন। আমরা এখানে program_0029.html নামে সেভ করেছি
৩।        ব্রাউজারে program_0029.html ফাইলটিকে ওপেন করুন।
৪।        ইনপুট বক্সে একটি number ইনপুট দিন। OK বাটন প্রেস করুন। নিম্নোক্ত ফলাফল দেখুন।

Do while লুপ
do ..... while লুপটি অনেকটা While লুপের মত তবে While লুপের প্রথমেই Condition (শর্ত) থাকে এবং শর্তটি সত্য না হলে প্রোগ্রাম লুপের মধ্যে প্রবেশ করে না। অপরদিকে  do ..... while লুপে Condition (শর্ত) থাকে সবচেয়ে শেষে। এই কারনে শর্ত সত্য/মিথ্যা যাই হোক প্রথম একবার প্রোগ্রামটি রান করবে এবং শেষে শর্ত না মিললে দ্বিতীয়বার আর রান করবে না। do .... while লুপের Structure নিম্নরূপ:
do
{
Statement
}
while (Condition)
পূর্বের উদাহরণটিকে (program_0028) আমরা do while ব্যবহার শিখব। এক্ষেত্রে নিচের মত করে কোড লিখুন।
প্রোগ্রামঃ Do while লুপ ব্যবহার
১।        নিচের মত করে কোড লিখুন।
<html>
<head>
<title>While Example</title>
<script type="text/JavaScript">
function CalculateDo()
{
var number=document.getElementById("txtNumber").value;
number=parseInt(number);
var i=1;
do
{
document.write("The Line Number is "+i);
document.write("<br/>");
i++;
}
while(i<=number)
{
}
}
</script>
<head>
<body>
Input  Number: <input type="text" id="txtNumber" /><br />
<button onclick="CalculateDo();">OK</button>
</body>
</html>
২।        কোডটিকে এবার ফাইলটিকে কে একটি নির্দিষ্ট  নামে  সেভ করুন। আমরা এখানে program_0030.html নামে সেভ করেছি   ব্রাউজারে program_0030.html ফাইলটিকে ওপেন করুন।
৪।        ইনপুট বক্সে একটি number ইনপুট দিন। OK বাটন প্রেস করুন। নিম্নোক্ত ফলাফল দেখুন।

For loop
for ,While এবং do ...... while লুপ  কাজ মূলত একই শুধু এদের গঠন কেবল আলাদা। for লুপে তিনটি বিষয় এখানে বিবেচ্য, initialization-লুপের মান কত থেকে শুরু হবে, Test বা Condition-লুপ কখন শেষ হবে, সেই শর্ত দেওয়া হয়। Condition যখন False হয় তখন লুপ শেষ হয়।
Re-initialization-লুপের সংখ্যা লুপ পরিবর্তনের সাথে সাথে কত করে বাড়বে/কমবে সেটি নির্দিষ্ট করে দেওয়া হয়।
for .... Loop এর Structure হচ্ছে নিম্নরূপ
for(initilization; test; re-initilization)
{
body;
}
প্রোগ্রামঃ আমরা for লুপ ব্যবহার করে n! বের করব।

১। আপনার এডিটরে নিম্নোক্ত প্রোগ্রামটি লিখুন। এবার ফাইলটিকে কে একটি নির্দিষ্ট  নামে  সেভ করুন। আমরা এখানে program_0031.html নামে সেভ করেছি
<html>
<head>
<title>For Loop Example</title>
<script type="text/JavaScript">
function CalculateFact()
{
var number=document.getElementById("txtNumber").value;
number=parseInt(number);
var fact=1;
var i;
for(i=1;i<=number;i++)
{
fact=fact*i;
}
alert(" The Factrial of "+number+ " is = " +fact);
}
</script>
<head>
<body>
Input  Number: <input type="text" id="txtNumber" /><br />
<button onclick="CalculateFact();">OK</button>
</body>
</html>
ফলাফল :           ব্রাউজারে program_0031.html ফাইলটি ওপেন করুন। যে নম্বরের ফ্যাক্টরিয়াল বের করতে চান তা ইনপুট বক্সে ইনপুট দিন।OK বাটন ক্লিক করুন। নিচের ছবির মত ফলাফল দেখতে পাবেন।আমরা উদাহরণস্বরূপ 6 ইনপুট দিয়েছি। তাই ফলাফল 720 হয়েছে।


বিঃদ্রঃ ভালভাবে প্রোগ্রাম শিখতে হলে লুপ এবং কন্ডিশনাল স্টেটমেন্ট অবশ্য অবশ্য ভালভাবে জানতে হবে।
ব্যাখ্যা: পূর্বের ন্যায় ভ্যালু ইনপুট নিয়ে number ভেরিয়েবলের মধ্যে রাখা হল বা অ্যাসাইন করা হল।
এখানে দেখা গেছে লুপটি (i=1) অর্থ্যাৎ ১ বার হতে (c £ number)i এর মান number থেকে ছোট বা সমান সংখ্যকবার হওয়া পর্যন্তু ঘুরবে। এখানে increment অপারেটর রয়েছে i++ অর্থ্যাৎ i এর মান প্রতি ধাপে ১ করে বৃদ্ধি করবে।এরপর fact এর মধ্যে পূর্বের fact এর ভ্যালুর সাথে i গুণ হয়ে অ্যাসাইন হবে। এভাবে লুপ শেষ হলেই আমরা ইনপুট করা number এর factional বা ১ থেকে সেই সংখ্যা পর্যন্তু গুণফল বের করতে পারা।

Break Statement: আমরা for loop এর factional উদাহরণে break statement ব্যবহার করেছি।
প্রোগ্রামঃ Break Statement ব্যবহার
১।        আপনার এডিটরে নিচের কোডিং এর মত করে প্রোগ্রাম লিখুন ।এবার ফাইলটিকে কে একটি নির্দিষ্ট  নামে  সেভ করুন। আমরা এখানে program_0032.html নামে সেভ করেছি
<html>
<head>
<title>While Example</title>
<script type="text/JavaScript">
function CalculateGrade()
{
var number=document.getElementById("txtNumber").value;
number=parseInt(number);
var i;
var fact=1;
for(i=1;i<=number;i++)
{
fact=fact*i;
if(i==6)
{
break;
}
}
alert(" The Factrial of "+i+ " is = " +fact);
}
</script>
<head>
<body>
Input  Number: <input type="text" id="txtNumber" /><br />
<button onclick="CalculateGrade();">OK</button>
</body> </html>
ফলাফল :           ব্রাউজারে program_0032.html ফাইলটি ওপেন করুন। যে কোন ভ্যালু ইনপুট দিন।



ব্যাখ্যা:   দেখা যাবে যে, যত বারই বেশি সংখ্যা দিন না কেন প্রতি বারেই ফলাফল আসবে 720। কারণ এখানে বলা হয়েছে যদি i এর মান 6 হয় তবে লুপ ব্রেক হয়ে পরবর্তী ইন্সট্রাকশন এক্সিকিউট করবে।
if (i==6)
{ break ;
}

অর্থাৎ লুপে i এর মান বৃদ্ধিতে হত 6 এর সমান হলে লুপ থেকে লুপ ব্রেক হয়ে যাবে এবং তখনকার factorial টি দেখাবে।
Previous Post                                                                                           Next Post

  বিস্তারিত জানতে নিচের বইটি সংগরহ করে নিন।

Book Name: Mastering Microsoft  Word
Writer: Bappi Ashraf
Published By: Gyankosh Prokashani
Amount of Pages: 464
First Publish: October-2004
Last Edition: We've February-2015 edition. Future edition may be existed!
Book Price: BDT 350 (30% Discount)
 The writer of this book has told that he has written this book with the concept of "teach yourself". On the other hand, Web Design is a thing which is interesting to learn. He has also told that the book is full of fan and enjoyment so that a person can learn Web Design by himself by playing with the example projects of this book.  Book's CD Link below... 

 cd

RELATED POST LINKS BELOW ********************************************

JavaScript_part6_Conditional Statement ও Switch Case



Conditional Statement
এই অংশে আমরা জানব-
        If ....... কন্ডিশনাল স্টেটমেন্ট
       if ....... Else  কন্ডিশনাল স্টেটমেন্ট
      Else if  কন্ডিশনাল স্টেটমেন্ট
     Switch Case কন্ডিশনাল স্টেটমেন্ট
Relational এবং Logical অপারেটর বোঝার জন্য if ..... else কন্ডিশনাল স্টেটমেন্ট ব্যবহার করে প্রোগ্রাম তৈরী করলে সহজেই বোঝা যাবে। একজন প্রোগ্রামার দুই বা ততোধিক সিদ্ধামত্ম তুলনা করে একটি সিদ্ধামত্ম নিয়ে থাকেন। যেমন - যদি বার্ষিক ছুটি গ্রীষ্মকালে হয়ে থাকে তবে আপনি রাঙামাটি বেড়াতে যাবেন আর যদি শীতকালে হয়ে থাকে তবে কুয়াকাটা বেড়াতে যাবেন।
if দিয়ে তিনটি বেসিক Structure দাঁড় করানো যায়। যেমন If ....... , if ....... Else এবং Else if । প্রতিটি আলাদা গুরম্নত্ত্ব বহন করে এবং বিভিন্ন ভাবে সাজিয়ে লেখা যায়। IF এবং ELSE উভয়ের পরেই একজোড়া Curly braces ({ }) ব্যবহার করা হয়। এই Curly braces প্রোগ্রামে একটি Container হিসেবে ব্যবহৃত হয়ে থাকে।

IF ...... ELSE স্ট্রাকচারে দুইটি Condition উলেস্নখ থাকে, এক্ষেত্রে যদি প্রথম কন্ডিশনটি সত্য হয় তবে সংযুক্ত কাজটি ঘটবে আর যদি প্রথমটি সত্য না হয়ে দ্বিতীয়টি সত্য হয় তবে অন্য আর একটি কাজ ঘটবে। কিন্তু প্রথমটি সত্য হলে দ্বিতীয় কন্ডিশনে প্রোগ্রাম না গিয়ে প্রথম কন্ডিশন পুরনের পর প্রোগ্রাম বন্ধ হয়ে যাবে। যেমন বলা যায় -   যদি
{বৃষ্টি হয় তবে ভিজবো}
নতুবা
{গল্প করবো}
এক্ষেত্রে বৃষ্টি হলে আর গল্প করার অপশন থাকবে না। If এরপর Else ব্যবহার করলে প্রতিটি ক্ষেত্রেই একজোড়া Curly braces ব্যবহার করতে হয়।
আগেই বলেছি এক্ষেত্রে একটি কন্ডিশন এবং দুইটি Statement থাকে। কন্ডিশন সত্য হলে প্রথম Statement ঘটবে নতুবা দ্বিতীয় Statement ঘটবে। IF ..... Else  এর Structure হবে নিম্নরূপ :
if (condition = True/False)
{
Statement 1 (True)
}
else
{
Statement 2 (False )
}
সুতরাং কল্পনা করুন - if rain comes Then I will wet (finish) either (else) I will gossip
যেহেতু রিলেশন এবং লজিক্যাল অপারেটরসমূহ কন্ডিশনাল স্টেটমেন্ট এর মাধ্যমে ব্যবহার হয় ; সেহেতু আমরা রিলেশন, লজিক্যাল অপারেটর এবং কন্ডিশনাল স্টেটমেন্ট তিনটি অংশ নিম্নোক্ত উদাহরণের মাধ্যমে বুঝাব।
 if উদাহরণ
১। আপনার এডিটরে নিম্নোক্ত প্রোগ্রামটি লিখুন। এবার ফাইলটিকে কে একটি নির্দিষ্ট  নামে  সেভ করুন। আমরা এখানে program_0025.htmlনামে সেভ করেছি
<html>
<head>
<title>Relational Oparetor Example</title>
<head>
<body>
<script type="text/JavaScript">
var marks=30;
if(marks>=40)
{
document.write("Your Mark is =" +marks + " And You are Passed" );
}
else
{
document.write("Your Mark is =" +marks + " And You are Failed");
}
</script>
</body> </html>

ফলাফল :           ব্রাউজারে program_0025.html ফাইলটি ওপেন করুন। নিম্নের চিত্রের মত ফলাফল দেখতে পাবেন।
ব্যাখ্যা:   উপরোক্ত উদাহরণে আমরা প্রথমে marks=30 ধরে নিয়েছি।প্রথম শর্তে লেখা আছে, যদি marks 40 এর থেকে বড় বা সমান হয় তবে, document.write(your mark is =+ mark + “and you are passed”) আর যদি তা না হয়, অর্থ্যাৎ 40 এর থেকে কম হয় তবে, document.write(your mark is =+ mark + “and you are failed”)
এখন আপনি Marks এর অ্যাসাইন করা ভেলু আপনার ইচ্ছামত পরিবর্তন যেমন: 50, 60, 20 ইত্যাদি করে দেখুন। ফলাফলের পরিবর্তন এবং প্রোগ্রামটি বোঝার চেষ্টা করুন।
 if......else..........else if উদাহরণ
১। আপনার এডিটরে নিম্নোক্ত প্রোগ্রামটি লিখুন    
২। এবার ফাইলটিকে কে একটি নির্দিষ্ট  নামে  সেভ করুন। আমরা এখানে program_0026.htmlনামে সেভ করেছি
[বুঝে বুঝে নিচের প্রোগ্রামটি আপনার নোটপ্যাডে লিখুন]
<html>
<head>
<title>Relational Oparetor Example</title>
<script type="text/JavaScript">
function CalculateGrade()
{
var marks=document.getElementById("txtMarks").value;
if  (marks>=0 && marks<40)                                                              
{
alert("Your Mark is =" +marks + " And You are Failed");
}
else if(marks>=40 && marks<50)
{
alert("Your Mark is =" +marks + " And Your Grade is D" );
}
else if  (marks>=50 && marks<60)                                                              
{
alert("Your Mark is =" +marks + " And Your Grade is C");
}
else if  (marks>=60 && marks<70)                                                              
{
alert("Your Mark is =" +marks + " And Your Grade is B");
}
else if  (marks>=70 && marks<80)                                                              
{
alert("Your Mark is =" +marks + " And Your Grade is A");
}
else if  (marks>=80 && marks<=100)                                                              
{
alert("Your Mark is =" +marks + " And Your Grade is A+");
}
else
{
alert("Sorry!!!!!You Have Entered Greater than 100 Marks");
}
}
</script>
<head>
<body>
Input Your Marks: <input type="text" id="txtMarks" /><br />
<button onclick="CalculateGrade();">OK</button>
</body>
</html>
১।        ব্রাউজারে program_0026.html ফাইলটি ওপেন করুন। নিম্নের চিত্রের মত ফলাফল দেখতে পাবেন।
উপরোক্ত উদাহরণে আমরা if......else..........else if এবং > = < = অপারেটর ব্যবহার করছি।
এখানে গ্রেড ক্যালকুলেশনের একটি প্রোগ্রাম দেওয়া হল:
ব্যাখ্যা: আপনি html ফরমের input বক্সে যে input দিবেন সেটির মান javascript ফাংশন। নিম্নোক্ত document.getelementById(txtmarks).value দ্বারা পাওয়া যাবে। “txtmarks” হল textbox টির id ; আর একে আমরা marks নামক ভেরিয়েবলের মধ্যে অ্যাসাইন করলাম। এখন if......else ব্যবহার করে Grade এর কন্ডিশন চেক করব। মনে মনে Grade টা ক্যালকুলেট করুন, এভাবে যদি মার্ক 0 এর থেকে বড় হয় এবং 40 এর চেয়ে ছোট হয় তবে F গ্রেড। যদি (else if) 40 থ থেকে বড় এবং 50 থেকে ছোট হয় তবে D গ্রেড।
 Switch Case
যদি কখনও অনেকগুলো If ব্যবহার করার প্রয়োজন হয়, সেÿÿত্রে If ব্যবহার না করে Switch Case ব্যবহার করা উত্তম। কোন দিন কোন বার এরূপ একটি প্রোগ্রাম দেখব সেজন্য Switch Case ব্যবহার করব।
১।     নিচের মত করে প্রোগ্রামটি লিখুন।
<html>
<head>
<title>Switch Case Example</title>
<script type="text/JavaScript">
function CalculateDay()
{
var day=document.getElementById("txtDay").value;
day=parseInt(day);   // to Convert day into integer Value
switch (day)
{
case 1:
  x="Today it's SaturDay";
  break;
case 2:
  x="Today it's SunDay";
  break;
case 3:
  x="Today it's MonDay";
  break;
case 4:
  x="Today it's TuesDay";
  break;
case 5:
  x="Today it's WendsDay";
  break;
case 6:
  x="Today it's ThirsDay";
  break;
  case 6:
  x="Today it's FriDay";
  break;
  default:
  x="Input Number 1 to 7";}
alert(x);
}
</script>
<head>
<body>
Input Day Number: <input type="text" id="txtDay" /><br />
<button onclick="CalculateDay();">OK</button>
</body> </html>
২।        এবার ফাইলটিকে কে একটি নির্দিষ্ট  নামে  সেভ করুন। আমরা এখানে program_0027.htmlনামে সেভ করেছি
৩।        ব্রাউজারের প্রোগ্রামটি ওপেন করুন এবং টেক্সট বক্সে যে কোন Number দিন।
৪।        এবার OK বাটনে ক্লিক করুন, নিম্নের চিত্রের মত ফলাফল দেখতে পাবেন।

ব্যাখ্যা: পূর্বের ন্যায় আমরা ইনপুট দেওয়া ভ্যালুকে জাভাস্ক্রিপ্টের ভেরিয়েবল day-তে অ্যাসাইন করলাম। যেহেতু day এর টাইপ এখানে integer বা বর্ণসংখ্যা নয়, তাই একে আমরা পূর্ণ সংখ্যায় রূপামত্মর করলাম। এভাবে parseInt(day) পুনরায় রূপামত্মর করা ভ্যালু day-তে অ্যাসাইন করলাম।
day=parseInt(day)
এই রূপামতরের কারণ হল Case1, Case2 এখানে 1, 2 পূর্ণ সংখ্যা।

এবার যে ভ্যালু আপনি টেক্সট বক্সে ইনপুট দিবেন, জাভাস্ক্রিপ্ট আপনাকে Switch করে সেই স্টেপ/Case নিয়ে যাবে। ঐ Case এর কাজ শেষ হবার পর break কী ওয়ার্কের মাধ্যমে প্রোগ্রাম Execute বন্ধ হবে। যদি ইনপুটকৃত ভ্যালু কোন Case এর সাথে না মিলে তবে তা Default এর বস্নক Execute করবে।
Previous Post                                                                                           Next Post

  বিস্তারিত জানতে নিচের বইটি সংগরহ করে নিন।

Book Name: Mastering Microsoft  Word
Writer: Bappi Ashraf
Published By: Gyankosh Prokashani
Amount of Pages: 464
First Publish: October-2004
Last Edition: We've February-2015 edition. Future edition may be existed!
Book Price: BDT 350 (30% Discount)
 The writer of this book has told that he has written this book with the concept of "teach yourself". On the other hand, Web Design is a thing which is interesting to learn. He has also told that the book is full of fan and enjoyment so that a person can learn Web Design by himself by playing with the example projects of this book.  Book's CD Link below... 

 cd

RELATED POST LINKS BELOW ********************************************