ICT & others Information

JavaScript_part11_জাভাস্ক্রিপ্ট স্পেশাল ক্যারেকটরসমূহ ও জাভাস্ক্রিপ্ট অবজেক্টেসসমূহ

March 07, 2020 Sharmin Khan Ishita

JavaScript objects

JavaScript Special cheracters
Back-sasnyasa (\), using the ayapostapeja, new lines, quotes and other special characters into a text can be.
Codes:
Code Output

            \ 'Single Quotes
            \ "Double quotation
            \\ ....
            \ N new line
            \ R Carriage Return
            \ T Tab
            \ B back space
            \ F Form feed
            \ & End
Lets see a small example.
Program: Special characters, for example,
1. write the following codes in Editor. and save the file with file name program_0042.html

<! DOCTYPE html>
<Html>
<Body>
<Script type = "text / javascript">
alert ( "My Mother \ 's Name is Selina Begum. \ nShe is a Teacher. \ nI Love you \" MoM \ "");
</ Script>
</ Body>
</ Html>
Results: Open the file program_0041.html in browser. As a result you will see the following image.

This way you can insert special character in between the text .

<hr \>
জাভাস্ক্রিপ্ট স্পেশাল ক্যারেকটরসমূহ:

ব্যাক-সস্ন্যাশ ( \ ) ব্যবহার করে অ্যাপোস্টপেজ, নতুন লাইন, কোটেশন এবং অন্যান্য স্পেশাল ক্যারেক্টার এর একটি টেক্সটের মাঝে দেয়া যায়।

কোডসমূহ:

কোড আউটপুট

\’ সিঙ্গেল কোটেশন

\” ডাবল কোটেশন

\\ ....

\n নতুন লাইন

\r ক্যারেজ রিটার্ন

\t ট্যাব

\b ব্যাক স্পেস

\f ফরম ফিড

\& এন্ড

একটা ছোট উদাহরণ দেওয়া যাক।

প্রোগ্রাম : স্পেশাল ক্যারেকটর উদাহরন

১. আপনার এডিটরে নিম্নোক্ত কোডগুলো লিখুন।এবার program_0042.html নামে ফাইলটটিকে সেভ করুন।

<!DOCTYPE html>

<html>

<body>

alert("My Mother\'s Name is Selina Begum. \nShe is a Teacher. \nI Love you \"MoM\" ");

</script>

</body>

</html>

ফলাফল : ব্রাউজারে program_0041.html ফাইলটি ওপেন করুন। নিম্নের চিত্রের মত ফলাফল দেখতে পাবেন।

এভাবে কোন টেক্সটের মধ্যে স্পেশাল ক্যারেকটর দেওয়া যায়।

জাভাস্ক্রিপ্ট অবজেক্টেস

এই অংশে আমরা শিখব-

অবজেক্ট অরিয়েন্টেড প্রোগ্রামিং কি

প্রোপার্টিজ কি

অবজেক্ট অরিয়েন্টেড প্রোগ্রামিং:

অবজেক্ট অরিয়েন্টেড ওয়েব অ্যাপিস্নকেশনের জন্য জাভাস্ক্রিপ্ট একটি চমৎকার ল্যাগুয়েজ। এটি অবজেষ্ট অরিয়েন্টেড প্রোগ্রামিং( OOP) সাপোর্ট করে কেননা এটি প্রোটোটাইপিং এর মাধ্যেমে ইনহেরিটেন্স এবং প্রোপাটিজ ও মেথডের মাধ্যেমে ইনহেরিটেন্স সাপোর্ট করে। অনেকে ভেবে থাকেন যে জাভাস্ক্রিপ্ট ইনহেরিটেন্স সাপোর্ট করে। যখন আপনি কোন অবজেক্ট অরিয়েন্টেড কোড লিখেন তখন এটি আপনি পুনরায় ব্যবহার করতে পারেন এবং এই প্রক্রিয়াই হল encapsulation. এখন আমরা জাভাস্ক্রিপ্টের বিল্ট-ইন অবজেক্ট কিভাবে ব্যবহৃত হয় তা দেখব।

প্রোপার্টিজ

ধরা যাক মোবাইল একটি অবজেক্ট। তাহলে মোবাইলের প্রেপাটিজ আমরা বলতে পারি keypad ব্যটারী screen ইত্যাদি তাহলে যায় প্রোপার্টিজ হল অবজেক্টের সাথে জড়িত ভ্যালু সমূহ। নিচের প্রোগ্রামটি লক্ষ্য করুন।

প্রোগ্রাম : প্রোপার্টিজ -এর উদাহরন

আপনার এডিটরে নিম্নোক্ত কোডগুলো লিখুন।বার ফাইলটিকে কে একটি নির্দিষ্ট নামে সেভ করুন। আমরা এখানে program_0050.html নামে সেভ করেছি।

<html>

<head>

<title>String Object </title>

</head>

<body>

var name = "Adobe Photoshop By Bappi Ashraf";

alert(name.length)

</script>

</body>

</html>

ফলাফল : এবার আপনার ব্রাউজারে program_0050.html ফাইলটি ওপেন করুন। নিম্নের চিত্রের মত ফলাফল দেখতে পাবেন।

ব্যাখ্যা: এখানে প্রোপাটি হল length এবং অবজেক্ট হল দ্বারা name; ভেরিয়েবল যে স্টিং টি রয়েছে সেটি কয়টি ক্যারেক্টাররের সমন্নয়ে গঠিত তা দেখব।

JavaScript_part10_জাভাস্ক্রিপ্ট ইভেন্ট, স্পেশাল ক্যারেক্টার ও try... catch

March 07, 2020 Sharmin Khan Ishita

জাভাস্ক্রিপ্ট ইভেন্ট, স্পেশাল ক্যারেক্টার, try... catch

এই অংশে আমরা শিখব-

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

জাভাস্ক্রিপ্ট স্পেশাল ক্যারেক্টার

জাভাস্ক্রিপ্ট try... catch statement

থ্রো স্টেটমেন্ট

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

ইভেন্ট ব্যাপারটি একটু সহজভাবে বলার চেষ্টা করি। জাভাস্ক্রিপ্ট এর ইভেন্ট হল এমন বিষয় যা পেজ এর কোনো এলিমেন্ট এর সাথে মাউস বা কীবোর্ড এর কোন অপারেশন কিভাবে হবে তা বুঝায়, যেমন মাউস ক্লিক হবে না মাউস ডাবল ক্লিক হবে ইত্যাদি।

কোন একটি ফাংশন লেখা হলে তাকে অবশ্যই কোন না কোন ইভেন্টের মাধ্যমে কল করতে হবে। একক ইভেন্টগুলে মূলত: html এর DOM ইভেন্ট। আর এই ইভেন্টগুলো জাভাস্ক্রিপ্টে ক্লিক করে থাকে।

নিচে ইভেন্ট সমূহের লিষ্ট এবং কাজ দেওয়া হল।

মাউস ইভেন্ট

ইভেন্ট	অ্যাট্রিবিউট	বর্ননা
ক্লিক	onclick	ইভেন্টটি ঘটে যখন ব্যবহারকারী কোনো একটি এলিমেন্টের উপর ক্লিক করে
ডাবল ক্লিক	ondblclick	ইভেন্টটি ঘটে যখন ব্যবহারকারী কোনো একটি এলিমেন্টের উপর ডাবল ক্লিক করে
মাউস ডাউন	onmousedown	ইভেন্টটি ঘটে যখন কোন ব্যবহারকারী একটি এলিমেন্ট উপর মাউসের একটি বাটন প্রেস করে
মাউস মুভ	onmousemove	ইভেন্টটি ঘটে যখন কোন ব্যবহারকারী একটি এলিমেন্ট উপর থেকে মাউস পয়েন্টার সরিয়ে নিয়ে যায়
মাউসওভার	onmouseover	ইভেন্টটি ঘটে যখন কোন ব্যবহারকারী একটি এলিমেন্ট উপর মাউস পয়েন্টার নিয়ে যায়
মাউস আউট	onmouseout	ইভেন্টটি ঘটে যখন কোন ব্যবহারকারী একটি এলিমেন্ট উপর থেকে মাউস পয়েন্টার সরিয়ে নিয়ে যায়
মাউস আপ	onmouseup	ইভেন্টটি ঘটে যখন কোন ব্যবহারকারী একটি এলিমেন্ট উপর মাউস একটি বাটন নিয়ে যায়

কী- ইভেন্ট

ইভেন্ট	অ্যাট্রিবিউট	বর্ননা
কী-ডাউন	onkeydown	ইভেন্টটি ঘটে যখন একটি কী প্রেস করা হয় বা একটি কী প্রেস করে ধরে রাখা হয়
কী-প্রেস	onkeyup	ইভেন্টটি ঘটে যখন একটি কী প্রেস করা হয় বা একটি কী প্রেস করে ধরে রাখা হয়
কী-আপ	onmousedown	যখন একটি কী প্রেস করে ছেড়ে দেয়া হয়

ফ্রেম বা অবজেক্ট ইভেন্টস

ইভেন্ট	অ্যাট্রিবিউট	বর্ননা
abort	onabort	কোন ইমেজ সম্পূর্ণরম্নপে লোড হবার পুর্বে যদি ইমেজটি লোড হওয়া বন্ধ হয়ে যায়, তখন এই ইভেন্টটি ঘটে থাকে। (<object> এর ক্ষেত্রে)
error	onerror	যখন ইমেজ সঠিকভাবে লোড না হয় তখন ইভেন্টটি ঘটে। (<object>, <body> and <frameset> এর ক্ষেত্রে)
load	onload	যখন a document, frameset, or <object> লোড হয় তখন ইভেন্টটি ঘটে
resize	onresize	যখন কোন একটি document resized অবস্থায় দেখা হয় তখন ইভেন্টটি ঘটে
unload	onunload	যখন কোন document একটি উইন্ডো বা ফ্রেম থেকে রিমুভ করা হয়
scroll	onscroll	যখন কোন একটি document scrolled অবস্থায় দেখা হয় তখন ইভেন্টটি ঘটে

ফর্ম ইভেন্টস

ইভেন্ট	অ্যাট্রিবিউট	বর্ননা
blur	onblur	যখন কোন একটি ফর্ম এলিমেন্ট তার ফোকাস লস করে তখন ইভেন্টটি ঘটে থাকে।
change	onchange	যখন কোন একটি ফর্ম এলিমেন্ট এর কোন সিলেকশন, চেক এরকম কোন অবস্থার পরিবর্তন ঘটে তখন এ ইভেন্টটি ঘটে। ( <input>, <select>, and <textarea>)
focus	onfocus	যখন কোন একটি ফর্ম এলিমেন্ট ফোকাস হয় তখন ইভেন্টটি ঘটে থাকে। (<label>, <input>, <select>, textarea>, and <button>)
resize	onresize	যখন কোন একটি document resized অবস্থায় দেখা হয় তখন ইভেন্টটি ঘটে
reset	onreset	যখন কোন একটি ফর্ম reset হয় তখন ইভেন্টটি ঘটে
select	onselect	যখন কোন ইউজার কোন টেক্সট সিলেক্ট করে তখন ইভেন্টটি ঘটে (<input> and <textarea>)
submit	onsubmit	যখন কোন একটি ফর্ম submit হয় তখন ইভেন্টটি ঘটে

line break

পপ আপ বক্সের message টিকে ভেঙে এক বা একাধিক লাইনে লেখার জন্য message এর মধ্যে \n ক্যারেকটর দিতে হবে। যেমন: alert(“Here is \n My pen)।

try... catch statement

অনেক সময় এমন লক্ষ্য করা যায় যে যখন কোন ওয়েব সাইট ব্রাউজ করছেন সে সময় alert() বক্স রানটার্নে Error দেখায়। এ ধরনের error ভিজিটরের জন্য দৃশ্যও সুখকর কোন বিষয় নয় এজন্য ঐ ভিজিটর আপনার পেজ-এ আর ব্রাউজ নাও করতে পারে।

এই সমস্ত error দূর করার জন্যেই জাভাস্ক্রিপ্ট try... catch ব্যবহার করা হয়।

try... catch স্টেটমেন্ট একটি কোড বস্নককে error test করতে ব্যবহৃত হয়। try বস্নকের কোডগুলো execute হয় এবং catch বস্নকের স্টেটমেন্টগুলো execute করা হয়। যদি try বস্নকে কোন স্টেটমেন্ট-এ error হয়।

Syntax

try

}

statement

}

catch (err)

{

handle error here

}

এবার চলুন নিচের প্রোগ্রামটি দেখা যাক।

প্রোগ্রাম : try... catch উদাহরন

১. আপনার এডিটরে নিম্নোক্ত কোডগুলো লিখুন।এবার ফাইলটিকে কে একটি নির্দিষ্ট নামে সেভ করুন। আমরা এখানে program_0040.html নামে সেভ করেছি।

<!DOCTYPE html>

<html>

<head>

var txt="";

function message()

{

try

{

promptBox("Welcome guest!","Bappi");

}

catch(err)

{

txt+="Error description: " + err.message + "\n\n";

txt+="Click OK to continue.\n\n";

alert(txt);

}

</script>

</head>

<body>

</body>

</html>

ফলাফল : ব্রাউজারে program_0040.html ফাইলটি ওপেন করুন। নিম্নের চিত্রের মত ফলাফল দেখতে পাবেন। View message -এ ক্লিক করুন। নিম্নের চিত্রের মত ফলাফল দেখতে পাবেন।

ব্যাখ্যা: উপরোক্ত উদাহরণ আসলে error প্রদান করে। কারণ promptBox() নামে কোন ফাংশন সেই জাভাস্ক্রিপ্ট-এ তাই error ... underline দেখা যাচ্ছে।

বিঃদ্রঃ try এবং catch ছোট হাতের লেখা হতে হবে।

থ্রো স্টেটমেন্ট

Throw স্টেটমেন্টটি মূলত: try... catch এর সাথে সমন্বয় করে আপনার প্রোগ্রামের ত্রম্নটিগুলো নিয়ন্ত্রণ করতে পারেন এবং উপযুক্ত Error মেসেজ জেনারেট করতে পারেন।

Throw exeception স্ট্রং, ইনটিজার, বুলিয়ান বা অবজেক্টে হতে পারে।

চলুন নিচের প্রোগ্রামটি দেখা যাক:

প্রোগ্রাম : থ্রো স্টেটমেন্ট উদাহরন

১. আপনার এডিটরে নিম্নোক্ত কোডগুলো লিখুন। এবার ফাইলটিকে কে একটি নির্দিষ্ট নামে সেভ করুন। আমরা এখানে program_0041.html নামে সেভ করেছি।

<!DOCTYPE html>

<html>

<body>

var x=prompt("Enter your Age:","");

try

{

if(x>18)

{

throw "Err1";

}

else if(x<18)

{

throw "Err2";

}

else if(isNaN(x))

{

throw "Err3";

}

catch(err)

{

if(err=="Err1")

{

alert("You are a adult Person.");

}

if(err=="Err2")

{

alert("You are too young.");

}

if(err=="Err3")

{

alert("Error! The value is not a number.");

}

</script>

</body>

</html>

ফলাফল : ব্রাউজারে program_0041.html ফাইলটি ওপেন করুন। একটি prompt বক্স আসবে। এখানে আপনার Age লিখুন।

এবার আউটপুট দেখুন এবং আস্তে আস্তে কোডের ধাপগুলো বুঝুন।

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...