diff options
Diffstat (limited to 'files/bn/web/javascript')
14 files changed, 0 insertions, 3345 deletions
diff --git a/files/bn/web/javascript/a_re-introduction_to_javascript/index.html b/files/bn/web/javascript/a_re-introduction_to_javascript/index.html deleted file mode 100644 index b8d2499b2a..0000000000 --- a/files/bn/web/javascript/a_re-introduction_to_javascript/index.html +++ /dev/null @@ -1,968 +0,0 @@ ---- -title: নতুন করে শিখি জাভাস্ক্রিপ্ট (জাভাস্ক্রিপ্ট টিউটোরিয়াল) -slug: Web/JavaScript/A_re-introduction_to_JavaScript -tags: - - জাভা স্ক্রিপ্ট - - জাভাস্ক্রিপ্ট - - জাভাস্ক্রিপ্ট টিউটোরিয়াল -translation_of: Web/JavaScript/A_re-introduction_to_JavaScript ---- -<div>{{jsSidebar}}</div> - -<h2 id="ভূমিকা">ভূমিকা</h2> - -<p><a href="/bn-BD/JavaScript" title="/bn-BD/JavaScript">জাভাস্ক্রিপ্ট</a> নিয়ে কেন নতুন করে ভূমিকা দেওয়ার দরকার পরল? কারণ <a href="http://javascript.crockford.com/javascript.html" title="http://javascript.crockford.com/javascript.html">দুনিয়ায় সবচেয়ে ভুল বোঝা প্রোগ্রামিং ভাষা</a> হিসেবে জাভাস্ক্রিপ্টের ব্যাপক খ্যাতি (!) আছে। আমাদের অনেকেই সি/জাভা/পিএইচপি বা অন্য কোন ভাষায় কোডে মোটামোটি ভালভাবে শিখে ফেলার পরে জাভাস্ক্রিপ্ট শিখতে গিয়ে দেখি বাহ, এটা তো সি/জাভা'র মতই! তারপর ভালমত না শিখেই কাজ করতে যাই জাভাস্ক্রিপ্টে... প্রত্যাশা মত ফলাফল আসে না আর এরপর গলা খুলে জাভাস্ক্রিপ্টের গালমন্দ করি। অথচ জাভাস্ক্রিপ্ট অনেক শক্তিশালী - যেটা অনেক সময় ভাষাটির সহজ-সরল চেহারা দেখে বুঝে ওঠা হয় না। ২০০৫ এ আমরা দেখেছি অনেক নামী-দামী জাভাস্ক্রিপ্ট এপ্লিকেশন বাজারে এসেছে - কাজেই জাভাস্ক্রিপ্টে গভীর জ্ঞান রাখা যে যেকোন ডেভেলপারের জন্য আবশ্যকীয় সেটা না বললেও চলবে!</p> - -<p>ভাষাটির ইতিহাস দিয়ে শুরু করা যাক। ১৯৯৫ সালে নেটস্কেপের প্রকৌশলী Brendan Eich জাভাস্ক্রিপ্ট তৈরি করেন, যেটা মুক্তি পায় ১৯৯৬ সালের শুরুর দিকে নেটস্কেপ ২ (ব্রাউজার) এর সাথে। এর নাম দেয়া হয়েছিল LiveScript, কিন্তু মার্কেটিং কৌশলের গ্যাড়াকলে পড়ে দুর্ভাগ্যজনত এর নাম জাভাস্ক্রিপ্ট হয়ে যায়, সান মাইক্রোসিস্টেম এর জাভা ল্যাংগুয়েজের জনপ্রিয়তাকে পুঁজি করার জন্য। জাভা আর জাভাস্ক্রিপ্টের মাঝে তেমন কোন মিল না থাকা সত্ত্বেও সেই থেকে তাই জাভাস্ক্রিপ্ট নামটা নিয়ে বিভ্রান্তি থেকে গেছে।</p> - -<p>মাইক্রোসফট এই প্রোগ্রামিং ভাষার সাথে প্রায় মিলে যায় এরকম একটি ল্যাংগুয়েজ JScript নাম দিয়ে প্রায় ৩ মাস পর ইন্টারনেট এক্সপ্লোরারের সাথে বাজারে নিয়ে আসে। এদিকে নেটস্কেপ <a class="external" href="http://www.ecma-international.org/">Ecma International</a> (স্ট্যান্ডার্ড নির্ধারণ করে এরকম একটি ইউরোপীয়ান সংস্থা) এর কাছে ল্যাংগুয়েজটি উপস্থাপন করে - যার ফলাফল ১৯৯৭ সালে <a href="https://developer.mozilla.org/en/JavaScript/Language_Resources" title="en/ECMAScript">ECMAScript</a> এর প্রথম সংস্করণ হিসেবে বাজারে আসে। ১৯৯৯ সালে এই স্ট্যান্ডার্ডটি আরো উন্নত হয় <a class="external" href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMAScript সংস্করণ ৩</a> হিসেবে - আর সেই থেকে ভাষাটির তেমন কোন বড় পরিবর্তন হয়নি। চতুর্থ সংস্করণটি ভেস্তে যায়, ভাষাটির জটিলতা নিয়ে মতবিরোধের ফলাফল হিসেবে। তবে এই চতুর্থ সংস্করণের অনেক অংশবিশেষ কে ভিত্তি হিসেবে ধরে ২০০৯ সালে নতুন ECMAScript এর পঞ্চম সংস্করণ প্রকাশ করা হয় এবং এর ৬ষ্ঠ মূখ্য সংস্করণ বের হয় ২০১৫ সালের জুনে। </p> - -<p>Specification মোটামোটি অপরিবর্তিত থাকাটা আসলে ডেভেলপারদের জন্য খুশির খবর, কারণ অনেকেই এর মাঝে ভাষাটির সাথে খাপ খাইয়ে নিতে পেরেছেন। আমি বিশেষভাবে, ৩য় সংস্করণের বিশেষ বিশেষ অংশ নিয়ে আলোচনা করব এখন, আর সবার পরিচিত নাম জাভাস্ক্রিপ্ট ব্যাবহার করব।</p> - -<p>অন্য সব প্রোগ্রামিং ভাষার সাথে জাভাস্ক্রিপ্টের বড় অমিল হল - এতে কোন ইনপুট/আউটপুটের বালাই নেই। একটা হোস্ট এনভায়রনমেন্টে চলবে ধরে নিয়েই জাভাস্ক্রিপ্ট ডিজাইন করা হয়েছে - সবচেয়ে পরিচিত হোস্ট এনভায়রনমেন্ট হচ্ছে ব্রাউজার। হোস্ট এনভায়রনমেন্টের দায়িত্ব হচ্ছে জাভাস্ক্রিপ্ট কীভাবে বাইরের জগতের সাথে ডেটা আদান প্রদান বা যোগাযোগ করবে সেটার আয়োজন করা। ব্রাউজার ছাড়াও Adobe Acrobat, Photoshop, Yahoo!'র Widget engine এমনকি সার্ভারে-চলে এরকম পরিবেশেও জাভাস্ক্রিপ্ট ইন্টারপ্রেটারের ব্যবহার দেখা যায়।</p> - -<h2 id="হালকা_পাতলা_ধারণা">হালকা পাতলা ধারণা</h2> - -<p>জাভাস্ক্রিপ্ট একটি ওবজেক্ট-ওরিয়েন্টেড, ডায়নামিক প্রোগ্রামিং ভাষা। এতে আছে ডেটা টাইপ, অপারেটর, গুরুত্বপূর্ণ কিছু অবজেক্ট (যেগুলো সব সময় আপনি ব্যবহার করতে পারবেন) আর ফাংশন বা মেথড। জাভা আর সি প্রোগ্রামিং ভাষা থেকে বেশ কিছু সিন্ট্যাক্স ধার করে নেওয়ায় যারা এসব ভাষায় পারদর্শী তাদের জন্য সুখবর আরকি! তবে অন্য অনেক ভাষার সাথে জাভাস্ক্রিপ্ট এর একটা বড় পার্থক্য হল এতে কোন ক্লাস (class) নেই, বরং "প্রটোটাইপ" নামের নতুন এক ধারণা কে কাজে লাগিয়ে ক্লাস এর কাজ কর্ম করা হয়ে থাকে। আরো একটা বড় পার্থক্য হল জাভাস্ক্রিপ্ট এ যেকোন "ফাংশন" আসলে একেককটি অবজেক্ট! ফাংশনে আপনি কোড রাখতে পারবেন, আরো পারবেন অবজেক্টের মত কোডের এক জায়গা থেকে আরেক জায়গায় পাস (pass) করাতে।</p> - -<p>চলুন শুরু করি যেকোন ভাষার মৌলিক উপাদান নিয়ে: type মানে কী কী রকমের ডেটা থাকতে পারে। জাভাস্ক্রিপ্টে যেসব টাইপ আছে সেগুলো হলঃ</p> - -<ul> - <li><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">সংখ্যা (Numbers)</a></li> - <li><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">স্ট্রিং (Strings</a>)</li> - <li><a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Boolean">বুলিয়ান (Boolean)</a></li> - <li><a href="/en/JavaScript/Reference/Global_Objects/Function" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Function">ফাংশন (Functions)</a></li> - <li><a href="/en/JavaScript/Reference/Global_Objects/Object" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Object">অবজেক্ট (Objects)</a></li> -</ul> - -<p>... আরও আছে বিশেষ দু'টি টাইপ - "Undefined" আর "Null". আর আছে <a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Array">Arrays</a>, যেটি আসলে অবজেক্টের-ই একটি বিশেষ ধরণ। আছে তারিখ নিয়ে কাজকারবারের জন্যে <a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Date" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Date">Dates</a>, আছে <a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/RegExp" title="en/Core_JavaScript_1.5_Reference/Global_Objects/RegExp">Regular Expressions</a> - এগুলোও অবজেক্ট। আর আগেই তো বলা হয়েছে জাভাস্ক্রিপ্টে ফাংশন-ও আসলে অবজেক্ট। টাইপ হচ্ছে তাই:</p> - -<ul> - <li>সংখ্যা (Number)</li> - <li>স্ট্রিং (String)</li> - <li>বুলিয়ান</li> - <li>অবজেক্ট - <ul> - <li>ফাংশন</li> - <li>Array</li> - <li>Date</li> - <li>RegExp</li> - </ul> - </li> - <li>Null (নাল)</li> - <li>Undefined (অসংজ্ঞায়িত)</li> -</ul> - -<p>ওহ আর বলতে প্রায় ভুলেই গিয়েছিলাম, ত্রুটি ধরার জন্যে কিছু <a href="/en/JavaScript/Reference/Global_Objects/Error" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Error">Error</a> টাইপও আছে।</p> - -<h2 id="সংখ্যা_বা_Numbers">সংখ্যা বা Numbers</h2> - -<p>সংখ্যা টাইপ জাভাস্ক্রিপ্ট এ "<a href="http://en.wikipedia.org/wiki/Double-precision_floating-point_format" title="http://en.wikipedia.org/wiki/Double-precision_floating-point_format">double-precision 64-bit format IEEE 754 values</a>", নির্দেশনা অনুসরণ করে। ফলস্বরূপ কিছু বিশেষ ঘটনা ঘটতে পারে। জাভাস্ক্রিপ্টে কোন "Integer" ধরণের টাইপ নাই, তাই অংক কষার সময় মাঝে মাঝে একটু সচেতন থাকবেন C অথবা জাভা ডেভেলপাররা। যেমন ধরুনঃ</p> - -<pre class="eval">0.1 + 0.2 == 0.30000000000000004 -</pre> - -<p>বাস্তবে integer গুলোকে ৩২-বিট ইন্টেজার ধরে নিয়ে কাজ করে জাভাস্ক্রিপ্ট (আর সংরকষণ ও একই ভাবে কিছু ব্রাউজারে করা হয়ে থাকে)। Bit-wise অপারেশন করার সময় এটা মাথায় রাখতে হবে। বিস্তারিত দেখতে পারেন <a href="http://www.hunlock.com/blogs/The_Complete_Javascript_Number_Reference" title="http://www.hunlock.com/blogs/The_Complete_Javascript_Number_Reference">জাভাস্ক্রিপ্টের পূর্ণাঙ্গ Number রেফারেন্স </a>এ।</p> - -<p>অংক কষার জন্য স্ট্যান্ডার্ড সব <a href="/en/JavaScript/Reference/Operators/Arithmetic_Operators" title="/en/JavaScript/Reference/Operators/Arithmetic_Operators">অপারেটর</a> জাভাস্ক্রিপ্টে আছে, যোগ বিয়োগ, ভাগশেষ (modulus) ইত্যাদি নিয়ে কাজ করা যায়। বলতে ভুলে গেছি <a href="/en/JavaScript/Reference/Global_Objects/Math" title="/en/JavaScript/Reference/Global_Objects/Math">Math</a> নামে একটি গ্লোবাল অবজেক্ট আছে গণিত নিয়ে বিশদভাবে কাজকারবার করার জন্যেঃ</p> - -<pre class="brush: js">Math.sin(3.5); -var d = Math.PI * r * r; -</pre> - -<p>বিল্ট-ইন <code><a href="/en/JavaScript/Reference/Global_Objects/parseInt" title="en/Core_JavaScript_1.5_Reference/Global_Functions/parseInt">parseInt()</a></code> ফাংশন ব্যবহার করে কোন string কে integer এ রূপান্তর করতে পারবেন। আর ফাংশনের দ্বিতীয় প্যারামিটার হিসেবে রূপান্তরের ভিত্তি (base) দিতে পারবেন, যদিও এই দ্বিতীয় প্যারামিটার টা ঐচ্ছিক এটা অবশ্যই দেওয়া উচিতঃ</p> - -<pre class="brush: js">> parseInt("123", 10) -123 -> parseInt("010", 10) -10 -</pre> - -<p>২য় প্যারামিটারে base না পাঠালে অপ্রত্যাশিত ফলাফল আসতে পারেঃ</p> - -<pre class="brush: js">> parseInt("010") -8 -</pre> - -<p>এমন ফল এসেছে কারণ শুরুতে 0 দেখে parseInt ফাংশনটা ধরে নিয়েছে ১ম প্যারামিটারে পাঠানো সংখ্যাটা অকটাল ভিত্তিতে আছে।</p> - -<p>বাইনারী সংখ্যাকে দশমিক ভিত্তিতে নিয়ে আসা একদম সোজাঃ</p> - -<pre class="brush: js">> parseInt("11", 2) -3 -</pre> - -<p>একইভাবে <code><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/parseFloat" title="en/JavaScript/Reference/Global Objects/parseFloat">parseFloat()</a> </code>নামেও বিল্ট-ইন ফাংশন আছে যেটা দিয়ে ভগ্নাংশ (floating point number) এ রূপান্তর (parse) করা যায়। তবে parseInt() এর সাথে এর একট অমিল - এটা সবসময় দশমিক ভিত্তিতে আছে ধরে নিয়ে কাজকর্ম করে।</p> - -<p>"+" অপারেটর ব্যবহার করেও কোন মান কে সংখ্যায় রূপান্তর করা যায়। এখানে "+" ইউনারী অপারেটর হিসেবে কাজ করেঃ</p> - -<pre>> + "42" -42 -</pre> - -<p>তবে আপনি যদি সংখ্যা নয়, এমন কোন String কে পার্স করতে যান তাহলে বিশেষ এক ধরণের মান ফাংশনের return ভ্যালু হিসেবে পাওয়া যায় - <code><a href="/en/JavaScript/Reference/Global_Objects/NaN" title="en/Core_JavaScript_1.5_Reference/Global_Properties/NaN">NaN</a></code> ("Not a Number" এর সংক্ষিপ্ত রূপ):</p> - -<pre class="brush: js">> parseInt("hello", 10) -NaN -</pre> - -<p><code>গাণিতিক কোন অপারেটর এর কোন এক </code><code>NaN</code><code> পাশে থাকলেই ফলাফাল হিসেবে </code><code>NaN</code><code> পাওয়া যাবেঃ</code></p> - -<pre class="brush: js">> NaN + 5 -NaN -</pre> - -<p>বিল্ট-ইন <code><a href="/en/JavaScript/Reference/Global_Objects/isNaN" title="en/Core_JavaScript_1.5_Reference/Global_Functions/isNaN">isNaN()</a></code> ফাংশন ব্যবহার করে বের করতে পারবেন কোন কিছু NaN কিনাঃ</p> - -<pre class="brush: js">> isNaN(NaN) -true -</pre> - -<p>জাভাস্ক্রিপ্টে অসীম মান নিয়ে কাজ করার জন্য আছে বিশেষ মান <code><a href="/en/JavaScript/Reference/Global_Objects/Infinity" title="en/Core_JavaScript_1.5_Reference/Global_Properties/Infinity">Infinity</a></code> এবং <code>-Infinity</code>:</p> - -<pre class="brush: js">> 1 / 0 -Infinity -> -1 / 0 --Infinity -</pre> - -<p>কোন মান <code>Infinity</code>, <code>-Infinity</code> অথবা <code>NaN</code> কিনা টেস্ট করতে পারবনে বিল্ট-ইন <code><a href="/en/JavaScript/Reference/Global_Objects/isFinite" title="en/Core_JavaScript_1.5_Reference/Global_Functions/isFinite">isFinite()</a></code> ফাংশন দিয়েঃ</p> - -<pre class="brush: js">> isFinite(1/0) -false -> isFinite(-Infinity) -false -> isFinite(NaN) -false -</pre> - -<div class="note"><strong>খেয়াল করুনঃ </strong><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/parseInt" title="en/JavaScript/Reference/Global Objects/parseInt"><code>parseInt()</code></a> আর <code><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/parseFloat" title="en/JavaScript/Reference/Global Objects/parseFloat">parseFloat()</a></code> ফাংশন দুইটি আপনার দেয়া প্যারামিটারকে ততক্ষণ পার্স করতে থাকবে যতক্ষণ না এটি প্যারামিটারে এমন কোন অক্ষর (character) পাচ্ছে যেটা কিনা অবৈধ (মানে যে ভিত্তিতে বা base থেকে রূপান্তর করা হচ্ছে সেই ভিত্তিতে এই অক্ষরটি থাকতে পারে না)। ফাংশনদুটি এই প্রথম অবৈধ অক্ষর এর আগ পর্যন্ত পার্স করে রিটার্ন করবে। তবে, "+" অপারেটর টি অন্যরকম, প্যারামিটারে কোন অবৈধ ক্যারেকটার থাকলে এটা সোজাসাপটা NaN রিটার্ন করে। ব্যাপারটা ভাল মত বুঝার জন্যে "10.2abc" এটাকে দুইটা ফাংশন দিয়ে পার্স করার কোড লিখে দেখুন!</div> - -<h2 id="স্ট্রিং">স্ট্রিং</h2> - -<p>জাভাস্ক্রিপ্টে স্ট্রিং হল অন্য সব ভাষার মত পরপর অনেকগুলো ক্যারেকটার (character) - আরো ভালো মত বলতে গেলে <em>ইউনিকোড</em> ক্যারেক্টার। প্রতিটা ক্যারেকটারকে ১৬-বিট নাম্বার দিয়ে প্রকাশ করা যায়। তাই যাদের এপ্লিকেশনে বিভিন্ন ভাষাভাষী দেশের জন্যে সাপোর্ট দেয়া লাগবে তারা তালিয়া বাজাতে পারেন!</p> - -<p>আপনার যদি কখনো একটা মাত্র ক্যারেকটার ব্যবহার করার প্রয়োজন পরে, তাহলে ১ লেংথ (length) এর স্ট্রিং ব্যবহার করুন যেহেতু ক্যারেকটার বলে কোন টাইপ জাভাস্ক্রিপ্টে নাই।</p> - -<p>আগেই বলেছি জাভাস্ক্রিপ্টে সব স্ট্রিং ই একেক্টা অব্জেক্ট। কয়টা ক্যারেকটার আছে স্ট্রিং এ জানতে হলে <code><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String/length" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String/length">length</a></code> প্রোপার্টি (অবজেক্ট এর ফাংশন) ব্যবহার করুন।</p> - -<pre class="brush: js">> "hello".length -5 -</pre> - -<p>এই প্রথম আমরা কোন অব্জেক্ট ব্যবহারের কোড দেখলাম! স্ট্রিং অবজেক্ট এর আরো অনেক <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String#Methods" title="/En/Core_JavaScript_1.5_Reference/Global_Objects/String#Methods">ফাংশন</a> ও কিন্তু আছেঃ</p> - -<pre class="brush: js">> "hello".charAt(0) -h -> "hello, world".replace("hello", "goodbye") -goodbye, world -> "hello".toUpperCase() -HELLO -</pre> - -<h2 id="অন্যান্য_টাইপ">অন্যান্য টাইপ</h2> - -<p>জাভাস্ক্রিপ্টের একটা অনন্য বৈশিষ্ট্য হল এটা null আর undefined এ দুটি জিনিস এক না। Null হচ্ছে 'অবজেক্ট' টাইপের এক ধরণের অবজেক্ট যেটা কোডার স্বেচ্ছায় কোন ভ্যারিয়েবলে এসাইন (asign) করেছেন। আর undefined হল 'undefined' টাইপের একটা অবজেক্ট - কোন ভ্যারিয়েবল যদি কোন ভ্যালু দিয়ে ইনিশিয়ালাইজ (initialize) করা না হয় (সোজা বাংলায় ভ্যারিয়েবল ডিক্লেয়ার করার সময় বা পরে যদি তাতে "=" চিহ্ন দিয়ে কোন মান এ্যাসাইন না করা হয়) তাহলে সেটা undefined অবস্থায় থাকে। ভ্যারিয়েবল নিয়ে আমরা পরে আলোচনা করব। জাভাস্ক্রিপ্টে ভ্যারিয়েবলে কোন ভ্যালু না দিয়েই ভ্যারিয়েবলটি তৈরি করা যায় - তখন তার ভ্যালু হিসেবে থাকে এই 'undefined'।</p> - -<p>জাভাস্ক্রিপ্টে বুলিয়ান বলে একটা টাইপ আছে, যার মান হতে পারে শুধুমাত্র true অথবা false (এই দুইটাই কি-ওয়ার্ড)। নিচের নিয়ম অনুযায়ী যেকোন ভ্যালু কে বুলিয়ানে কনভার্ট করা যায়ঃ</p> - -<ol> - <li><code>false</code>, <code>0</code>, শূন্য স্ট্রিং (<code>""</code>), <code>NaN</code>, <code>null</code>, এবং <code>undefined</code> এগুলাকে বুলিয়ানে কনভার্ট করলে <code>false পাওয়া যাবে।</code></li> - <li>অন্য যেকোন টাইপের ভ্যলু বুলিয়ানে কনভার্ট করলে <code>true পাওয়া যায়।</code></li> -</ol> - -<p><code>Boolean()</code> ফাংশন ব্যবহার করে আপনি এই কনভার্সন করেই ছাড়তে পারেনঃ</p> - -<pre class="brush: js">> Boolean("") -false -> Boolean(234) -true -</pre> - -<p>কিন্তু আমাদের এভাবে explicitly কনভার্ট করতে হবে না, কারণ জাভাস্ক্রিপ্ট যখন কোথাও বুলিয়ান প্রত্যাশা করে কিন্তু অন্য কোন টাইপ পায়, তখন সে চুপিচুপি এই কনভার্ট টি করে নেয়।</p> - -<p>অন্য ভাষার মত বুলিয়ান অপারেটর যেমন && (লজ্যিকাল AND), , <code>||</code> (লজ্যিকাল <em>or</em>), আর <code>!</code> (লজ্যিকাল <em>not</em>) আছে।</p> - -<h2 id="ভ্যারিয়েবল_(চলক!)">ভ্যারিয়েবল (চলক?!)</h2> - -<p><code><a href="/en/JavaScript/Reference/Statements/var" title="en/Core_JavaScript_1.5_Reference/Statements/var">var</a></code> কী-ওয়ার্ড ব্যবহার করে নতুন কোন ভ্যারিয়েবল তৈরি করুনঃ</p> - -<pre class="brush: js">var a; -var name = "simon"; -</pre> - -<p>আগেই বলেছি, ভ্যারিয়েবলে কোন ভ্যালু এসাইন না করলে সেটা <code>undefined</code> টাইপ হয়ে বসে থাকে।</p> - -<p><span style="color: #ff0000;">গুরুত্বপূর্ণঃ</span> অন্যান্য প্রোগ্রামিং ভাষার সাথে বড় একটা পার্থক্য হল জাভাস্ক্রিপ্ট কোডে ব্লক লেভেলে ভ্যারিয়েবলের স্কোপ বলে কিছু নেই। ভ্যারিয়েবল টা যেই ফাংশনে আছে, পুরা ফাংশনে এই ভ্যারিয়েবলের একটাই স্কোপ থাকে। তাই যদি কোন if বা লুপের মধ্যে কোন ভ্যারিয়েবল তৈরি করেন তাহলে পুরা ফাংশনেই সেটার স্কোপ থাকবে।</p> - -<h2 id="অপারেটর">অপারেটর</h2> - -<p>জাভাস্ক্রিপ্টের নিউমেরিক (numeric) অপারেটরগুলো হল <code>+</code>, <code>-</code>, <code>*</code>, <code>/</code> আর <code>%</code> - মানে কিনা ভাগশেষ বের করার অপারেটর। <code>= ব্যবহার করে ভ্যারিয়েবলে ভ্যালু দেয়া হয়। জটিল এসাইনমেন্ট অপারেটরও আছে যেমন</code> <code>+=</code> আর <code>-=</code>। এই জটিল অপারেটরগুলোকে ভেঙ্গে এইভাবে কল্পনা করতে পারেনঃ <code>x = x <em>অপারেটর</em> y</code>.</p> - -<pre class="brush: js">x += 5 -x = x + 5 -</pre> - -<p>ভ্যারিয়েবলের ভ্যালু এক বাড়াতে বা কমাতে যথাক্রমে ++ আর -- অপারেটর ব্যবহার করতে পারেন। সি/জাভার মত এগুলোর প্রিফিক্স/পোস্টফিক্স দুটো ফর্ম-ই আছে।</p> - -<p>আর আমরা তো আগেই জেনেছি <a href="/en/JavaScript/Reference/Operators/String_Operators" title="en/Core_JavaScript_1.5_Reference/Operators/String_Operators"><code>+</code> অপারেটর</a> দিয়ে স্ট্রিং জোড়া লাগানো যায় (concatenation)</p> - -<pre class="brush: js">> "hello" + " world" -hello world -</pre> - -<p>আপনি যদি স্ট্রিং কে অন্য কোন সংখ্যা (বা অন্য কোন মান) এর সাথে যোগ করতে যান তাহলে সবকিছু প্রথমে স্ট্রিং এ কনভার্ট করে নেওয়া হয়ঃ</p> - -<pre class="brush: js">> "3" + 4 + 5 -345 -> 3 + 4 + "5" -75 -</pre> - -<p>কোন মানকে স্ট্রিং এ কনভার্ট করার তাই আরেকটা চোরাই বুদ্ধি হচ্ছে ঐ মানের সাথে <em>শূন্য স্ট্রিং</em> ("")যোগ করা।</p> - -<p><a href="/en/JavaScript/Reference/Operators/Comparison_Operators" title="/en/JavaScript/Reference/Operators/Comparison_Operators">তুলনা</a> (Compare) করার জন্যে জাভাস্ক্রিপ্টের কাছে আছে <code><</code>, <code>></code>, <code><=</code> আর <code>>=</code> অপারেটর। এগুলো সংখ্যা আর স্ট্রিং দুইটার বেলাতেই কাজ করে। তবে == অপারেটর ব্যবহার করে দুইটা মান সমান কিনা সেটা চেক করাটা একটু অপ্রত্যাশিত হতে পারে, কারণ == অপারেটরের দুই পাশে দুই ধরণের টাইপের ভ্যালু দিলে জাভাস্ক্রিপ্ট প্রয়োজন মত কনভার্ট করে নেয়ঃ</p> - -<pre class="brush: js">> "dog" == "dog" -true -> 1 == true -true -</pre> - -<p>জাভাস্ক্রিপ্টের এই মাতব্বরী বন্ধ করতে চাইলে === অপারেটর ব্যবহার করুনঃ</p> - -<pre class="brush: js">> 1 === true -false -> true === true -true -</pre> - -<p>আপনি হয়ত ভাবছেন <code>!=</code> আর <code>!==</code> অপারেটেরের কথা - হ্যা এগুলো তো আছেই।</p> - -<p>জাভাস্ক্রিপ্ট দিয়ে <a href="/en/JavaScript/Reference/Operators/Bitwise_Operators" title="/en/JavaScript/Reference/Operators/Bitwise_Operators">বিট-লেভেলে (bitwise) অপারেশন</a> ও করতে পারবেন।</p> - -<h2 id="কন্ট্রোল_স্ট্রাকচার">কন্ট্রোল স্ট্রাকচার</h2> - -<p>C বা জাভাতে ব্যবহার করে আসা if অথবা else জাভাস্ক্রিপ্টেও একইভাবে ব্যবহার করা যাবেঃ</p> - -<pre class="brush: js">var name = "kittens"; -if (name == "puppies") { - name += "!"; -} else if (name == "kittens") { - name += "!!"; -} else { - name = "!" + name; -} -name == "kittens!!" -</pre> - -<p>জাভাস্ক্রিপ্টে while আর do-while লুপ আছে, হুবুহু সি-জাভার মত। যদি চান যে লুপটি অন্ততঃ একবার চালাতেই হবে তাহলে do-while ব্যবহার করুন।</p> - -<pre class="brush: js">while (true) { - // an infinite loop! -} - -var input; -do { - input = get_input(); -} while (inputIsNotValid(input)) -</pre> - -<p>সি-জাভার মত for লুপ ব্যবহার করে এক লাইনেই লুপ কন্ট্রোল করতে পারেনঃ</p> - -<pre class="brush: js">for (var i = 0; i < 5; i++) { - // Will execute 5 times -} -</pre> - -<p>শর্ট-কাটে লজিক প্রয়োগ করতে পারেন && আর || অপারেটরের একটি অন্যরকম ব্যবহার করে। অপারেটর গুলোর ২য় অপারেন্ড কার্যকর (execute) হবে কিনা নির্ভর করে ১ম অপারেন্ডের ওপরঃ</p> - -<pre class="brush: js">var name = o && o.getName(); -</pre> - -<p>অথবা ডিফল্ট মান বসানোর জন্যঃ</p> - -<pre class="brush: js">var name = otherName || "default"; -</pre> - -<p>কন্ডিশনাল এক্সপ্রেশনের জন্য সি-জাভার মত টার্নারী অপারেটর (যেগুলোর অপারেন্ড ৩টি) ব্যবহার করতে পারেনঃ</p> - -<pre class="brush: js">var allowed = (age > 18) ? "yes" : "no"; -</pre> - -<p>একাধিক ব্রাঞ্চের কন্ট্রোল লজিকের জন্যে switch ব্যবহার করতে পারেন। জাভাস্ক্রিপ্টের switch-case স্ট্রিং এর জন্যে কাজ করেঃ</p> - -<pre class="brush: js">switch(action) { - case 'draw': - drawit(); - break; - case 'eat': - eatit(); - break; - default: - donothing(); -} -</pre> - -<p>break না ব্যবহার করলে পরের case এও আপনার কোডের কন্ট্রোল চলে যাবে - এরকম কোডিং সাধারণতঃ করা হয়না। তাই আপনি যদি break ব্যবহার না করেন তাহলে কমেন্টে লিখে রাখুন যাতে কনফিউশন তৈরি না হয়।</p> - -<pre class="brush: js">switch(a) { - case 1: // fallthrough - case 2: - eatit(); - break; - default: - donothing(); -} -</pre> - -<p>default ক্লজটি ঐচ্ছিক। আরেকটি মজার দিক হল switch আর case দু'জায়গাতেই আপনি এক্সপ্রেশন লিখতে পারেন। তুলনা করা হয় === অপারেটর ব্যবহার করেঃ</p> - -<pre class="brush: js">switch(1 + 3) { - case 2 + 2: - yay(); - break; - default: - neverhappens(); -} -</pre> - -<h2 id="অবজেক্ট">অবজেক্ট</h2> - -<p>জাভাস্ক্রিপ্টে অবজেক্ট হচ্ছে এক কথায় name-value pair। নিচে যেগুলো পয়েন্ট করা হয়ছে সেগুলোর সাথে কোন পার্থক্য নেইঃ</p> - -<ul> - <li>Python এর dictionary</li> - <li>Perl আর ruby'র hash</li> - <li>C/C++ এর hashtable</li> - <li>জাভা'র HashMap</li> - <li>PHP'র associative array</li> -</ul> - -<p>এই ডেটা-স্ট্রাকচারটা এত বেশি ব্যবহৃত হয় যে এটা সম্পর্কে নতুন করে বলার সুযোগ কম। যেহেতু জাভাস্ক্রিপ্টে সবকিছুই অবজেক্ট এটা আশা করা স্বাভাবিক যে জাভাস্ক্রিপ্ট প্রোগ্রামে অনেক বেশি হ্যাশটেবিল লুক-আপ হবে... আমরা বেঁচে গেছি কারণ অনেক দ্রুত এই লুক-আপ করা যায়!</p> - -<p>জাভাস্ক্রিপ্ট অবজেক্টের "name" হিসেবে স্ট্রিং ব্যবহার করতে হবে, আর "value" অংশে যা মন চায় ব্যবহার করতে পারবেন। তার মানে ভ্যালু হিসেবে অন্য অবজেক্ট ও রাখতে পারেন। এভাবে যত জটিল চান সেরকম অবজেক্ট-ই তৈরি করতে পারবেন।</p> - -<p>একটা শূণ্য অবজেক্ট ২ভাবে তৈরি করতে পারেনঃ</p> - -<pre class="brush: js">var obj = new Object(); -</pre> - -<p>আরঃ</p> - -<pre class="brush: js">var obj = {}; -</pre> - -<p>ওপরের দুইটা উপায় সমার্থক। নিচের পদ্ধটি-তিকে বলা হয় অবজেক্ট লিটারেল, আর এটি JSON সিন্ট্যাক্সের ও একটি অংশ। তাই নিচের পদ্ধটি-তি যত বেশি ব্যবহার করা যায় ভাল!</p> - -<p>অবজেক্ট তৈরি হয়ে যাওয়ার পর এর প্রোপার্টি (সম্পদ?!) দুইভাবে এক্সেস করতে পারবেনঃ</p> - -<pre class="brush: js">obj.name = "Simon"; -var name = obj.name; -</pre> - -<p>এবং...</p> - -<pre class="brush: js">obj["name"] = "Simon"; -var name = obj["name"]; -</pre> - -<p>দুইটা পদ্ধতি-ই সমার্থক, তবে ২য় পদ্ধটিতে দেখুন, অবজেক্টের name স্ট্রিং হিসেবে দেওয়া হচ্ছে, মানে এই নামটি আমরা ভ্যারিয়েবলে রেখে রানটাইমে দিতে পারি! অবশ্য এই পদ্ধটিতি ব্যবহার করলে কিছু জাভাস্ক্রিপ্ট ইঞ্জিন আর মিনিফায়ার (কোড সংক্ষিপ্ত করে যেসব টুলস) কোড অপ্টিমাইজ করতে পারে না। আবার এই পদ্ধতি ব্যবহার করে <a href="/en/JavaScript/Reference/Reserved_Words" title="/en/JavaScript/Reference/Reserved_Words">সংরক্ষিত name সমূহ</a> গেট-সেট করতে পারেনঃ</p> - -<pre class="brush: js">obj.for = "Simon"; // Syntax error, because 'for' is a reserved word -obj["for"] = "Simon"; // works fine -</pre> - -<p>আগেই দেখানো অবজেক্ট লিটেরাল সিন্ট্যাক্স ব্যবহার করে পুরো অবজেক্ট গোড়াতেই ইনিশিয়ালাইজ করে নিতে পারেনঃ</p> - -<pre class="brush: js">var obj = { - name: "Carrot", - "for": "Max", - details: { - color: "orange", - size: 12 - } -} -</pre> - -<p>অবজেক্টের এট্রিবিউট এক্সেস একের-পর-এক (চেইন) করতে পারেনঃ</p> - -<pre class="brush: js">> obj.details.color -orange -> obj["details"]["size"] -12 -</pre> - -<h2 id="Array">Array</h2> - -<p>জাভাস্ক্রিপ্টের Array আসলে বিশেষ ধরণের অবজেক্ট - রেগুলার অবজেক্টের মতই array কাজ করে বেশিরভাগ সময়ে ( numeric প্রোপার্টি, মানে ০,১,২,... ইন্ডেক্সে থাকা প্রোপার্টি শুধুমাত্র [] সিন্ট্যাক্স দিয়েই এক্সেস করা যাবে)। সব array'র 'length" ম্যাজিক প্রোপার্টি আছে, যার মান হচ্ছেঃ (ওই array'র সর্বোচ্চ ইন্ডেক্স + ১)</p> - -<p>প্রাগৈতিহাসিক(!) নিয়মে array ব্যবহার-পদ্ধতিঃ</p> - -<pre class="brush: js">> var a = new Array(); -> a[0] = "dog"; -> a[1] = "cat"; -> a[2] = "hen"; -> a.length -3 -</pre> - -<p>তবে স্মার্ট এপ্রোচ হচ্ছে <em>array লিটেরাল</em> ব্যবহার করাঃ</p> - -<pre class="brush: js">> var a = ["dog", "cat", "hen"]; -> a.length -3 -</pre> - -<p>সাবধানঃ লিটের্যাল ব্যবহার করে সবশেষের প্রোপার্টির পর কমা রেখে দিলে ব্রাউজার-ভেদে বিভিন্ন অবস্থা তৈরি হতে পারে - তাই সর্বশেষ array element এর পর কমা রেখে দেওয়া চলবে না।</p> - -<p>খেয়াল করুনঃ array.length মানেই যে array তে কয়টা প্রোপার্টি আছে তা কিন্তু সবসময় ঠিক না। নিচের কোড দেখুনঃ</p> - -<pre class="brush: js">> var a = ["dog", "cat", "hen"]; -> a[100] = "fox"; -> a.length -101 -</pre> - -<p>আবারো বলছিঃ length প্রোপার্টি হচ্ছে: (সবথেকে বড় ইন্ডেক্স + ১)</p> - -<p>আপনি যদি এমন কোন প্রোপার্টি নিয়ে কাজ করতে চান যেটির ইন্ডেক্স ভুল, তাহলে 'undefined' পাবেন মান হিসেবে।</p> - -<pre class="brush: js">> typeof a[90] -undefined -</pre> - -<p>ওপরে যা বলা হল তা মাথায় রেখে নিচের কোড দিয়ে array এর সব এলিমেন্ট নিয়ে কাজ করতে পারবেন (iteration):</p> - -<pre class="brush: js">for (var i = 0; i < a.length; i++) { - // Do something with a[i] -} -</pre> - -<p>তবে ওপরের কোডিং টা অত ভাল হল না, কারণ বারবার array.length প্রোপার্টি'র মান খুঁজতে হচ্ছে। নিচের কোড টা বেশি ভাল (কার্যকরী):</p> - -<pre class="brush: js">for (var i = 0, len = a.length; i < len; i++) { - // Do something with a[i] -} -</pre> - -<p>আর নিচেরটা হচ্ছে <em>বস-লেভেলের</em> কোডিং ;-)</p> - -<pre class="brush: js">for (var i = 0, item; item = a[i++];) { - // Do something with item -} -</pre> - -<p>খেয়াল করুনঃ লুপের দুই সেমিকোলনের মাঝের অংশ ভ্যারিয়েবল এসাইনমেন্ট আর false কিনা টেস্টিং দুই-ই করা হচ্ছে। এই লুপ ব্রেক করবে প্রথম "falsy" এলিমেন্ট (যেমন 'undefined') পাওয়া মাত্রই।</p> - -<p>কাজেই, যদি array'র কোন এলিমেন্ট "falsy" হওয়ার সম্ভাবনা থাকে, তাহলে ওপরের তথাকতিত "বস-লেভেল" কোডিং ব্যবহার করা যাবে না। যেমন, কোন array এলিমেন্ট এর মান false হিসেবে গণ্য হলেই (যেমন শূণ্য স্ট্রিং) পরের ভ্যালিড এলিমেন্ট ও কিন্তু আর এক্সেস করা যাবে না। আপনি যদি নিশিচ থাকেন যে array তে কোন "falsy" এলিমেন্ট নেই (যেমন অবজেক্টের array অথবা <a href="/en/DOM" title="en/DOM">DOM</a> নোড ইত্যাদি) তাহলেই ওপরের পদ্ধতি ব্যবহার করুন।</p> - -<p><code><a href="/en/JavaScript/Reference/Statements/for...in" title="en/Core_JavaScript_1.5_Reference/Statements/for...in">for...in</a></code> লুপ ব্যবহার করেও array এলিমেন্টগুলোতে <em>iterate </em>করতে পারবেন। কেউ যদি Array.prototype (পরে আলোচনা করেছি) ব্যবহার করে নতুন নতুন প্রোপার্টি যোগ করেন এরে তে, তাহলে সেগুলোও এই লুপ দিয়ে iterate করা যাবে:</p> - -<pre class="brush: js">for (var i in a) { - // Do something with a[i] -} -</pre> - -<p>Array তে নতুন এলিমেন্ট যোগ করার সবচাইতে নিরাপদ পদ্ধতিঃ</p> - -<pre class="brush: js">a[a.length] = item; // same as a.push(item); -</pre> - -<p>যেহেতু a.length সবসময় এরে এর সর্বোচ্চ ইন্ডেক্স + ১ কাজেই আপনি নিশ্চিত থাকতে পারেন যে আপনি ফাকা স্থানেই নতুন এলিমেন্ট বসাচ্ছেন।</p> - -<p>Array'র সাথে অনেক ফাংশন প্যাকেট করে দেওয়া হয়েছেঃ</p> - -<table style="height: 124px; width: 598px;"> - <thead> - <tr> - <th scope="col">Method name</th> - <th scope="col">Description</th> - </tr> - </thead> - <tbody> - <tr> - <td><code>a.toString()</code></td> - <td> </td> - </tr> - <tr> - <td><code>a.toLocaleString()</code></td> - <td> </td> - </tr> - <tr> - <td><code>a.concat(item[, itemN])</code></td> - <td>প্রদত্ত আইটেম (এলিমেন্ট) গুলো সহ নতুন একটি Array রিটার্ন করে।</td> - </tr> - <tr> - <td><code>a.join(sep)</code></td> - <td> </td> - </tr> - <tr> - <td><code>a.pop()</code></td> - <td>শেষ এলিমেন্ট-টিকে এরে থেকে মুছে দিয়ে রিটার্ন করে।</td> - </tr> - <tr> - <td><code>a.push(item[, itemN])</code></td> - <td><code>এরে'র শেষে এক/একাধিক আইটেম যোগ করে</code></td> - </tr> - <tr> - <td><code>a.reverse()</code></td> - <td> </td> - </tr> - <tr> - <td><code>a.shift()</code></td> - <td> </td> - </tr> - <tr> - <td><code>a.slice(start, end)</code></td> - <td>একটি সাব-এরে রিটার্ন করে</td> - </tr> - <tr> - <td><code>a.sort([cmpfn])</code></td> - <td>তুলনা করার জন্য একটি ফাংশন প্যারামিটারে দিতে পারেন (ঐচ্ছিক)</td> - </tr> - <tr> - <td><code>a.splice(start, delcount[, itemN])</code></td> - <td>এরে'র আইটেমগুলো মুছে দিয়ে/রিপ্লেস করতে পারবেন।</td> - </tr> - <tr> - <td><code>a.unshift([item])</code></td> - <td>এরে'র শুরুতে আইটেম কে যোগ করে।</td> - </tr> - </tbody> -</table> - -<h2 id="ফাংশন">ফাংশন</h2> - -<p>জাভাস্ক্রিপ্ট ভালোমত শিখতে হলে অবজেক্টের পাশাপাশি ফাংশন সম্পর্কেও ভাল ধারণা থাকা দরকার। নিচে খুবই নিরীহ-দর্শন একটা ফাংশন দেখা যাচ্ছেঃ</p> - -<pre class="brush: js">function add(x, y) { - var total = x + y; - return total; -} -</pre> - -<p>ফাংশনের বেসিক জানার জন্যে এইটুকুই যথেষ্ট। ফাংশনে এক/একাধিক প্যারামিটার/আর্গুমেন্ট পাঠাতে পারেন। ফাংশনের বডিতে যত খুশি স্টেটমেন্ট লিখুন, নিজের ইচ্ছামত "লোকাল" ভ্যারিয়েবল তৈরি করুন। ফাংশনের যেকোন জায়গায় return স্টেটমেন্ট ব্যবহার করতে পারেন - এই স্টেটমেন্টের পরের কোন স্টেটমেন্ট আর কার্যকর হবে না মানে ফাংশন থেকে তখন-ই প্রোগ্রাম বের হয়ে যাবে। return এর পর যেই ভ্যালু দিবেন ফাংশনটি তার caller কে সেই ভ্যালুটি রিটার্ন করবে। return এর পর কোন ভ্যালু না দিলে (অথবা আদৌ কোন রিটার্ন স্টেটমেন্ট ব্যবহার না করলে) জাভাস্ক্রিপ্ট undefined কে রিটার্ন ভ্যালু হিসেবে পাঠিয়ে থাকে।</p> - -<p>আপনি যদি ফাংশন কল করার সময় কোন প্যারামিটারের ভ্যালু না পাঠান, তাহলে 'undefined' ঐ প্যারামিটারের ভ্যালু হিসেবে চলে যাবে ফাংশনের কাছেঃ</p> - -<pre class="brush: js">> add() -NaN // You can't perform addition on undefined -</pre> - -<p>অন্য প্রোগ্রামিং ভাষার সাথে একটুখানি অমিলঃ আপনি চাইলে ফাংশন যতগুলো প্যারামিটার নিয়ে কাজ করে, তার থেকে বেশি প্যারামিটারও পাঠাতে পারেন!</p> - -<pre class="brush: js">> add(2, 3, 4) -5 // added the first two; 4 was ignored -</pre> - -<p>একটু হাস্যকর মনে হলেও, ফাংশনের নিজস্ব <a href="/en/JavaScript/Reference/Functions_and_function_scope/arguments" title="En/Core_JavaScript_1.5_Reference/Functions_and_function_scope/arguments"><code>arguments</code></a> নামের একটা array এর মত ভ্যারিয়েবল আছে - এর এলিমেন্ট হিসেবে ফাংশনে যতগুলো ভ্যালু প্যারামিটার হিসেবে পাঠানো হয়েছে সবগুলোই থাকে। আসুন add ফাংশনটিকে এমনভাবে লিখি যাতে যত খুশি প্যারামিটার পাঠানো হোক না কেন সবগুলোই যোগ করা যায়ঃ</p> - -<p>কিছুটা "আজাইরা" ধাঁচের মনে হলেও জাভাস্ক্রিপ্টে ফাংশগুলোর মধ্যে <a href="/en/JavaScript/Reference/Functions_and_function_scope/arguments" title="En/Core_JavaScript_1.5_Reference/Functions_and_function_scope/arguments"><code>arguments</code></a> নামের একটি ভ্যারিয়েবল আছে, যাতে ফাংশনটিতে পাস করা সকল ভ্যালু থাকে! আসুন ফাংশনটিকে এমনভাবে পরিবর্তন করি যেন তা ইচ্ছেমত আর্গুমেন্ট নিতে পারে!</p> - -<pre class="brush: js">function add() { - var sum = 0; - for (var i = 0, j = arguments.length; i < j; i++) { - sum += arguments[i]; - } - return sum; -} - -> add(2, 3, 4, 5) -14 -</pre> - -<p>এবার গড় বের করার একটি ফাংশন (ফাংশন নাম্বার ১) লিখে ফেলিঃ</p> - -<pre class="brush: js">function avg() { - var sum = 0; - for (var i = 0, j = arguments.length; i < j; i++) { - sum += arguments[i]; - } - return sum / arguments.length; -} -> avg(2, 3, 4, 5) -3.5 -</pre> - -<p>এটা কাজের ফাংশন সন্দেহ নাই, তবে নতুন একটা ঝামেলা তৈরি করলঃ avg() ফাংশন কমা-দিয়ে-আলাদা-করা এক গাদা আর্গুমেন্ট নেয় - কিন্তু আপনি যদি আর্গুমেন্ট হিসেবে শুধু একটি array পাঠাতে চান? তাহলে avg() ফাংশনটা এভাবে (ফাংশন নাম্বার ২) লেখা যেতে পারেঃ</p> - -<pre class="brush: js">function avgArray(arr) { - var sum = 0; - for (var i = 0, j = arr.length; i < j; i++) { - sum += arr[i]; - } - return sum / arr.length; -} -> avgArray([2, 3, 4, 5]) -3.5 -</pre> - -<p>কিন্তু নতুন করে না লিখে আগের ১-নাম্বার ফাংশনটা-ই ব্যবহার করতে পারলে ভাল হত! এক কাজের জন্য কয়টা ফাংশন লিখব, আর কি কাজ কর্ম নাই নাকি? সৌভাগ্যবশতঃ, জাভাস্ক্রিপ্ট দিয়ে যেকোন ফাংশনের <a href="/en/JavaScript/Reference/Global_Objects/Function/apply" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Function/apply"><code>apply()</code></a> মেথড কল করে (যেহেতু ফাংশন-ও এক ধরণের অবজেক্ট, তাই ফাংশনের-ও মেথড/প্রোপার্টি ইত্যাদি থাকতে পারে!) আর্গুমেন্ট হিসেবে যেকোন array পাঠাতে পারেনঃ</p> - -<pre class="brush: js">> avg.apply(null, [2, 3, 4, 5]) -3.5 -</pre> - -<p>এই apply() মেথডের ২য় প্যারামিটারের ভ্যালুটাই ফাংশনের <a href="/en/JavaScript/Reference/Functions_and_function_scope/arguments" title="En/Core_JavaScript_1.5_Reference/Functions_and_function_scope/arguments"><code>arguments</code></a> হিসেবে ব্যবহৃত হবে। প্রথম আর্গুমেন্টের কাজ কি সেটা পরে বলব। আর হ্যা, এখন তো বুঝতে পারলেন যে ফাংশন-ও জাভাস্ক্রিপ্টে আসলে অবজেক্ট! (প্রমাণিত)</p> - -<p>জাভাস্ক্রিপ্টে <strong>বেওয়ারিশ </strong>(anonymous!) ফাংশন তৈরি করতে পারবেনঃ</p> - -<pre class="brush: js">var avg = function() { - var sum = 0; - for (var i = 0, j = arguments.length; i < j; i++) { - sum += arguments[i]; - } - return sum / arguments.length; -} -</pre> - -<p>ওপরের "বেওয়ারিশ" ফাংশন আর function avg() এর মাঝে কোন পার্থক্য নাই, অন্ততঃ সিমান্ট্যাকালি। কিন্তু এই anonymous ফাংশন অনেক পাওয়ারফুল - কারণ এভাবে আপনি কোডের যেকোন জায়গায় ফাংশন তৈরি করে নিতে পারেন - যেখানে হয়ত আগে সাদামাটা এক্সপ্রেশন দেওয়া লাগত। যেমন, একটা ট্রিক দেখুনঃ আমরা জানি জাভাস্ক্রিপ্টে "ব্লক" লেভেলে ভ্যারিয়েবলের নতুন কোন স্কোপ নাই, কিন্তু ফাংশন লেভেলে ভ্যারিয়েবলের স্কোপ আছে। এখন যদি আমরা কোন ফাংশনের ভেতর C ল্যাংগুয়েজের মত ব্লক লেভেলে কোন ভ্যারিয়েবলের স্কোপ চাই, তাহলে চট করে একটা বেওয়ারিশ ফাংশন লিখে ফেলতে পারিঃ</p> - -<pre class="brush: js">var a = 1; -var b = 2; -(function() { - var b = 3; // b ভ্যারিয়েবলের নতুন স্কোপ তৈরি করলাম! - a += b; -})(); -a; // 4 -b; // 2 - b এর মান আগেরটাই আছে। -</pre> - -<p>জাভাস্ক্রিপ্টে ফাংশন রিকারসিভলি (কোন ফাংশনের ভেতর নিজেকেই আবার কল করা) কল করতে পারবেন। Tree - সদৃশ ডেটা স্ট্রাকচার নিয়ে কাজ করতে এটা উপকারী। যেমন, <a href="/en/DOM" title="en/DOM">DOM</a> নিয়ে কাজ করার সময় কাজে লাগে।</p> - -<pre class="brush: js">function countChars(elm) { - if (elm.nodeType == 3) { // TEXT_NODE - return elm.nodeValue.length; - } - var count = 0; - for (var i = 0, child; child = elm.childNodes[i]; i++) { - count += countChars(child); - } - return count; -} -</pre> - -<p>অবশ্য এভাবে কাজ করতে গিয়ে anonymous ফাংশন কল করতে গেলে ঝামেলা হবেঃ এনোনিমাস ফাংশনকে রিকার্সিভ কল কিভাবে করবেন? ওদের তো নাম-ই নাই! এই ঝামেলা দূর করতে এসে গেল "named anonymous ফাংশন":</p> - -<pre class="brush: js">var charsInBody = (function counter(elm) { - if (elm.nodeType == 3) { // TEXT_NODE - return elm.nodeValue.length; - } - var count = 0; - for (var i = 0, child; child = elm.childNodes[i]; i++) { - count += counter(child); - } - return count; -})(document.body); -</pre> - -<p>এভাবে এনোনিমাস ফাংশনকে দেওয়া নাম শুধুমাত্র ঐ ফাংশনের ভেতরেই কাজ করবে। এভাবে যেমন জাভাস্ক্রিপ্ট ইঞ্জিন অপ্টিমাইজ ভাবে কাজ করতে পারে, সেরকম আপনার কোডও সহজবোধ্য হয়।</p> - -<h2 id="মনের_মত_অবজেক্ট">মনের মত অবজেক্ট</h2> - -<div class="note"><strong>খেয়াল করুন:</strong> জাভাস্ক্রিপ্ট দিয়ে অবজেক্ট-ওরিয়েন্ট প্রোগ্রামিং করতে চাইলে আরো বিস্তারিত আলোচনা দেখুন এখানেঃ <a href="/en/JavaScript/Introduction_to_Object-Oriented_JavaScript" title="/en/JavaScript/Introduction_to_Object-Oriented_JavaScript">জাভাস্ক্রিপ্টে অবজেক্ট-ওরিয়েন্টেডের হাতেখড়ি</a></div> - -<p><em>এই প্যারার টাইটেল নিয়ে একটু মজা করলাম... হেহে। ইংরেজিতে টাইটেল ছিল "Custom Objects" :-P</em></p> - -<p>ক্ল্যাসিক অবজেক্ট অরিয়েন্টেড প্রোগ্রামিং মানেই class নামের কী-ওয়ার্ড... জাভাস্ক্রিপ্ট একটু অন্যরকম। আমরা সাধারণত অবজেক্ট কে ডেটা আর সেইসব ডেটার ওপর কাজ করার জন্য মেথড এর একটা কালেকশনকেই বুঝি। জাভাস্ক্রিপ্টে কোন class স্টেটমেন্ট নাই, জাভাস্ক্রিপ্ট prototype-ভিত্তিক প্রোগ্রামিং ভাষা, তাই সবার এই ব্যাপারটা একটু শিখে নেওয়ার দরকার আছে। জাভাস্ক্রিপ্টে আসলে <strong>ফাংশন-ই</strong> ক্লাস হিসেবে কাজ করে। আসুন একটা person অবজেক্ট চিন্তা করি... যাতে firstname আর lastname দু'টি প্রোপার্টি আছে। এখন, কোন ব্যাক্তির নাম প্রিন্ট করার ২টা পদ্ধতি চিন্তা করিঃ একটা হল আগে firstname প্রিন্ট করব, পরে lastname। আর অন্য পদ্ধতিটা উল্টা, আগে lastname প্রিন্ট করবঃ</p> - -<pre class="brush: js">function makePerson(first, last) { - return { - first: first, - last: last - } -} -function personFullName(person) { - return person.first + ' ' + person.last; -} -function personFullNameReversed(person) { - return person.last + ', ' + person.first -} -> s = makePerson("Simon", "Willison"); -> personFullName(s) -Simon Willison -> personFullNameReversed(s) -Willison, Simon -</pre> - -<p>কিন্তু... ওপরের আজব কোড দেখে যেকারর-ই মেজাজ খারাপ হওয়ার কথা। এভাবে কোড করতে থাকলে শেষপর্যন্ত আপনার স্ক্রিপ্টের global স্কোপেই হাজার হাজার ফাংশন পয়দা হয়ে বসে থাকবে। আমরা চাই অবজেক্টের সদস্য মেথডগুলো শুধু ওই অবজেক্টের স্কোপেই থাকুক। যেহেতু ফাংশন == অবজেক্ট, আমরা নিমেষেই সুন্দর কোডিং করে ফেলতে পারিঃ</p> - -<pre class="brush: js">function makePerson(first, last) { - return { - first: first, - last: last, - fullName: function() { - return this.first + ' ' + this.last; - }, - fullNameReversed: function() { - return this.last + ', ' + this.first; - } - } -} -> s = makePerson("Simon", "Willison") -> s.fullName() -Simon Willison -> s.fullNameReversed() -Willison, Simon -</pre> - -<p>ওপরের কোডে দেখুন আমরা প্রথমবারের মত '<code><a href="/en/JavaScript/Reference/Operators/this" title="en/Core_JavaScript_1.5_Reference/Operators/Special_Operators/this_Operator">this</a></code>' কীওয়ার্ড ব্যবহার করলাম। কোন ফাংশনের ভেতর যখন this ব্যবহার করা হয় তখন সেটি ঐ ফাংশনটি'র অবজেক্ট কে রেফার (refer) করে থাকে, যদি কিনা আপনি <a href="/en/JavaScript/Reference/Operators/Member_Operators" title="/en/JavaScript/Reference/Operators/Member_Operators">ডট (.) অথবা ব্রাকেট</a> ব্যবহার করে মেথডটিকে কল করে থাকেন। কিন্তু অন্য কোন ভাবে কল করলে this আসলে global অবজেক্ট কে রেফার করে। এই ব্যাপারটা ঠিকমত না বুঝতে পারলে ভুল করার সম্ভাবনা থাকে। উদাহরণ দেখুনঃ</p> - -<pre class="brush: js">> s = makePerson("Simon", "Willison") -> var fullName = s.fullName; -> fullName() -undefined undefined -</pre> - -<p>যখন আমরা <code>fullName()</code> কল করলাম (s.fullname() না) , '<code>this</code>' আসলে global অবজেক্ট কে রেফার করে। এই গ্লোবাল অবজেক্ট এর যেহেতু <code>first</code> অথবা <code>last</code> নামের কোন প্রোপার্টি নাই, তাই <code>undefined</code> পাওয়া যাচ্ছে।</p> - -<p>নতুনদের জন্য এই বিষয়টা একটু ভ্রান্তিকর মনে হতে পারে... যাই হোক! এই this কী-ওয়ার্ড ব্যবহার করে আমরা makePerson কে আরেকটু ভাল চেহারা দিতে পারিঃ</p> - -<pre class="brush: js">function Person(first, last) { - this.first = first; - this.last = last; - this.fullName = function() { - return this.first + ' ' + this.last; - } - this.fullNameReversed = function() { - return this.last + ', ' + this.first; - } -} -var s = new Person("Simon", "Willison"); -</pre> - -<p>দেখুন, নতুন কী-ওয়ার্ড '<code><a href="/en/JavaScript/Reference/Operators/new" title="en/Core_JavaScript_1.5_Reference/Operators/Special_Operators/new_Operator">new</a></code>' এর ব্যবহার - এই new এর সাথে this এর সম্পর্ক খুবই শক্ত-পোক্ত! কোন ফাংশন কল করার আগে new ব্যবহার করলে যা হয়ঃ একটি নতুন অবজেক্ট তৈরি হয়, এরপর ফাংশনটিকে কল করা হয় যেন this নতুন তৈরি করা অবজেক্ট টিকে রেফার করে থাকে। যেসব ফাংশন কে new কী-ওয়ার্ড দিয়ে কল করা উচিত তাদের নাম সাধারণতঃ বড় হাতের অক্ষরে লেখা হয় প্রথম হরফটি - যাতে ডেভেলপার সহজেই বুঝতে পারে যে ফাংশনটি new কী-ওয়ার্ড দিয়ে কল করতে হবে ।</p> - -<p>দেখতে সুন্দর লাগলেও আসলে এখনো একটা ঝামেলা রয়ে গেছে, যত বার আমরা new ব্যবহার করে makePerson এর অবজেক্ট তৈরি করব, প্রতিটা অবজেক্টের জন্য fullName() আর fullNameRevesed() ফাংশনদুটি'র নতুন কপি তৈরি হবে! কিন্তু আসলে তো উচিত শুধু ক্লাসের সদস্য ভ্যারিয়েবল গুলোর অবজেক্ট-প্রতি কপি তৈরি হওয়া, ফাংশন এর কপি তৈরি করাটা অপ্রয়োজনীয়। প্রতিটা অবজেক্টের জন্য এভাবে মেম্বার ফাংশন তৈরি না করে আসলে প্রচলিত অবজেক্ট-ওরিয়েন্টেড প্রোগ্রামিং এর ধারণা অনুযায়ী কোন ক্লাসের সকল অবজেক্ট বা ইন্সট্যান্সের উচিত ক্লাসের সদস্য ফাংশন <strong>শেয়ার </strong>করা।</p> - -<pre class="brush: js">function personFullName() { - return this.first + ' ' + this.last; -} -function personFullNameReversed() { - return this.last + ', ' + this.first; -} -function Person(first, last) { - this.first = first; - this.last = last; - this.fullName = personFullName; - this.fullNameReversed = personFullNameReversed; -} -</pre> - -<p>এখন প্রতিটা অবজেক্টের জন্য ফাংশন গুলোর নতুন কপি তৈরি না করে ফাংশনগুলো একবার-ই তৈরি করে শেয়ার করা নেওয়া হল। কিন্তু আসলে এর থেকেও ভালভাবে কোড করা সম্ভবঃ</p> - -<pre class="brush: js">function Person(first, last) { - this.first = first; - this.last = last; -} -Person.prototype.fullName = function() { - return this.first + ' ' + this.last; -} -Person.prototype.fullNameReversed = function() { - return this.last + ', ' + this.first; -} -</pre> - -<p><code>Person.prototype এমন একটি অবজেক্ট যা Person ফাংশনের সব ইন্সট্যান্স বা অবজেক্ট শেয়ার করে। এভাবে "prototype chain" নামের বিশেষ ধরণের লুক-আপ চেইন তৈরি হয়ঃ যখন আপনি Person এর এমন কোন প্রোপার্টি এক্সেস করতে চান যেটা এখনো সেট করা হয়নি, জাভাস্ক্রিপ্ট Person.prototype</code> এ <code>খুজে দেখবে (লুক-আপ) সেখানে এই প্রোপার্টি টি সেট করা আছে কিনা। <strong>সহজ বাংলায়, Person.prototype এ আমরা যে সকল প্রোপার্টি (ফাংশন বা ডেটা) সেট করব সেটা Person এর সকল ইন্সট্যান্স/অবজেক্ট এক্সেস করতে পারবে।</strong></code></p> - -<div class="note"> -<p><em><code>অবজেক্ট-ওরিয়েন্টেড প্রোগ্রামিং করার জন্য নতুন রা চোখ বন্ধ করে ওপরে দেখানো প্রটোটাইপ পদ্ধতি ব্যবহার করতে পারেন। ভাল-মন্দ এতগুলো উদাহরণ শুধুমাত্র কন্সেপ্ট পরিষ্কার করার জন্যই দেখানো হল - তবে গুলিয়ে ফেললে ভয় পাওয়ার কিছু নাই।</code></em></p> -</div> - -<p>এই প্রটোটাইপ আসলে অনেক পাওয়ারফুল টুল। জাভাস্ক্রিপ্ট আপনাকে যেকোন কিছুর প্রটোটাইপ যেকোন সময় পরিবর্তন করার সুযোগ দেয়। যার মানে, রানটাইমেই আপনি অবজেক্টে নতুন নতুন মেথড যোগ করতে পারেন! এটাও সি/জাভার সাথে অন্যতম পার্থক্য প্রটোটাইপ-ভিত্তিক ল্যাংগুয়েজ যেমন জাভাস্ক্রিপ্ট এর।</p> - -<pre class="brush: js">> s = new Person("Simon", "Willison"); -> s.firstNameCaps(); -TypeError on line 1: s.firstNameCaps is not a function -> Person.prototype.firstNameCaps = function() { - return this.first.toUpperCase() -} -> s.firstNameCaps() -SIMON -</pre> - -<p>মজা দেখুনঃ বিল্ট-ইন অবজেক্টের প্রটোটাইপ ও এভাবে পরিবর্তন করা সম্ভব! আসুন আমরা বিল্ট ইন String এ নতুন একটা মেথড যোগ করি স্ট্রিং উল্টে দেওয়ার জন্যঃ</p> - -<pre class="brush: js">> var s = "Simon"; -> s.reversed() -TypeError on line 1: s.reversed is not a function -> String.prototype.reversed = function() { - var r = ""; - for (var i = this.length - 1; i >= 0; i--) { - r += this[i]; - } - return r; -} -> s.reversed() -nomiS -</pre> - -<p>এই নতুন মেথড স্ট্রিং লিট্যারেল এও কাজ করবেঃ</p> - -<pre class="brush: js">> "This can now be reversed".reversed() -desrever eb won nac sihT -</pre> - -<p>আগে যেমনটা বলেছিলাম, prototype হচ্ছে একটা বিশেষ চেইনের অংশ। এই চেইনের গোড়ায় আছে Object.prototype, যার একটা মেথড হল toString() - এই মেথড টা কল হয় যখন আপনি কোন একটা অবজেক্ট কে স্ট্রিং হিসেবে পেতে চাচ্ছেন (জাভা'র toString() এর মতন)। ডিবাগিং করার জন্য এটা উপকারী হবেঃ</p> - -<pre class="brush: js">> var s = new Person("Simon", "Willison"); -> s -[object Object] -> Person.prototype.toString = function() { - return '<Person: ' + this.fullName() + '>'; -} -> s -<Person: Simon Willison> -</pre> - -<p>মনে আছে আমরা avg.apply() এর প্রথম প্যারামিটারে null পাঠিয়েছিলাম? এই apply() এর প্রথম প্যারামিটারে যেই অবজেক্ট পাঠাবেন, this সেটাকে রেফার করবে। আমরা new এর একটা সহজ-সরল ইমপ্লেমেন্টেশন করতে পারিঃ</p> - -<pre class="brush: js">function trivialNew(constructor) { - var o = {}; // Create an object - constructor.apply(o, arguments); - return o; -} -</pre> - -<p>অবশ্য এটা পুরোপুরি new হিসেবে ব্যবহার করা যাবে না কারণ প্রটোটাইপ চেইন তৈরি করা হয়নি। এরকম কোড সচরাচর দেখা যায়না, তবে চাইলে যে করতে পারবেন সেটা দেখানো হল আরকি।</p> - -<p><a href="/en/JavaScript/Reference/Global_Objects/Function/call" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Function/call"><code>call</code></a> নামের apply() এর মতই একটা ফাংশন আছে। পার্থক্য হল, array এর বদলে এটি বিশদ-ভাবে (কমা সেপারেটেড) আর্গুমেন্ট নিয়ে থাকেঃ</p> - -<pre class="brush: js">function lastNameCaps() { - return this.last.toUpperCase(); -} -var s = new Person("Simon", "Willison"); -lastNameCaps.call(s); -// Is the same as: -s.lastNameCaps = lastNameCaps; -s.lastNameCaps(); -</pre> - -<h2 id="ফাংশনের_ভেতরে_ফাংশন_(Inner_functions)">ফাংশনের ভেতরে ফাংশন (Inner functions)</h2> - -<p>জাভাস্ক্রিপ্টে ফাংশনের ভেতরে ফাংশন লেখা যায় এটা আমরা আগে makePerson() উদাহরণে দেখেছি। একটা গুরুত্বপূর্ণ ব্যাপার খেয়াল রাখতে হবে যে জাভাস্ক্রিপ্টে এই Inner ফাংশন তার প্যারেন্ট ফাংশনের স্কোপ এক্সেস করতে পারেঃ</p> - -<pre class="brush: js">function betterExampleNeeded() { - var a = 1; - function oneMoreThanA() { - return a + 1; - } - return oneMoreThanA(); -} -</pre> - -<p>তাই কোড বুঝার আওতায় রাখা আর মেইন্টেইন করা সহজ জাভাস্ক্রিপ্টেঃ যদি কোন ফাংশন (ফাংশন নাম্বার-১) এমন কয়েকটা ফাংশনের ওপর নির্ভর করে যেই ফাংশনগুলা অন্য কোথাও কাজে লাগে না, তাহলে আমরা সেই ফাংশনগুলোকে এই ১-নাম্বার ফাংশনের ইনার (inner) ফাংশন হিসেবে রেখে দিতে পারি। এতে করে, global স্কোপের আওতায় থাকা ফাংশনের সংখ্যা কমবে - এটা সবসময় ভাল অভ্যাস হিসেবে বিবেচনা করা হয়।</p> - -<p>এমন করে আসলে এক গাদা গ্লোবাল ভ্যারিয়েবল তৈরি করে গ্লোবাল স্কোপ নষ্ট করে ফেলার অভ্যাস থেকেও বেচে যাওয়া যায়। গ্লোবাল স্কোপে সুযোগ মত ভ্যারিয়েবল তৈরি করে ফাংশনে ডেটা শেয়ার করার প্রবণতা খুবই লক্ষ্যণীয় - কিন্তু এভাবে কোড করলে একটা সময় পর আর কোড মেইন্টেইন করা যায় না। জাভাস্ক্রিপ্টের inner ফাংশন ব্যবহার করে আমরা যেসব ফাংশন কোন গ্লোবাল ভ্যারিয়েবল শেয়ার করতে চায়, তাদের একটা প্যারেন্ট ফাংশনের inner ফাংশন হিসেবে ঢুকিয়ে দিতে পারি। এভাবে যেখানে প্রয়োজন, সম্পর্কিত ফাংশনগুলোকে couple করে ফেললেও গ্লোবাল স্কোপে ভ্যারিয়েবলের সংখ্যা কমে যাবে। এই অভ্যাস সতর্কতার সাথেই করা উচিত, যদিও এরকম কোড করার সুযোগ থাকাটা খুবই উপকারী।</p> - -<h2 id="ক্লোজার_(Closures)"> ক্লোজার (Closures)</h2> - -<p>ক্লোজার জাভাস্ক্রিপ্টের অফার করা সেরা এবস্ট্রাকশন (abstractions) গুলোর একটি - অবশ্য ঠিকভাবে না বুঝলে কনফিউজিং হতে পারে। এটা আসলে কী?</p> - -<pre class="brush: js">function makeAdder(a) { - return function(b) { - return a + b; - } -} -x = makeAdder(5); -y = makeAdder(20); -x(6) -? -y(7) -? -</pre> - -<p>makeAdder নাম দেখেই বুঝা যাচ্ছে এটা নতুন <strong>নতুন</strong> adder ফাংশন তৈরি করে! এই <strong>নতুন </strong>ফাংশনগুলো কে যখন কিনা আবার কল করা হবে কোন আর্গুমেন্ট দিয়ে, makeAdder ফাংশনে দেয়া আর্গুমেন্টটির সাথে এই নতুন আর্গুমেন্ট কে যোগ করবে।</p> - -<p>এখানে যা হচ্ছে অনেকটাই Inner ফাংশনের সাথে মিলে যায়ঃ একটা ফাংশনকে অন্য কোন ফাংশনের মধ্যে তৈরি করা হয়ছে - ভেতরের ফাংশনটি বাইরের (প্যারেন্ট) ফাংশনের সব ভ্যারিয়েবল এক্সেস করতে পারে। একমাত্র পার্থক্য হচ্ছে বাইরের (outer) ফাংশনটি কিন্তু রিটার্ন করে গিয়েছে, তাই কমন-সেন্স থেকে মনেহতে পারে যে এর লোকাল ভ্যারিয়েবল গুলো আর নেই। কিন্তু আসলে, এগুলো এখনো বহাল তবিয়তেই আছে - না থাকলে adder ফাংশনগুলো তো কাজ করত না! আরো লক্ষ্যণীয় যে makeAdder এর লোকাল ভ্যারিয়েবলের দু'টি আলাদা, ভিন্ন "কপি" দেখা যাচ্ছে - যার একটিতে a ভ্যারিয়েবলের মানে 5 আর অন্যটিতে এই মান 20। তাই, ওপরের ফাংশন কল দু'টির ফলাফল হবে নিম্নরূপঃ</p> - -<pre class="brush: js">x(6) // returns 11 -y(7) // returns 27 -</pre> - -<p>পর্দার আড়ালেঃ যখন জাভাস্ক্রিপ্ট কোন ফাংশন execute করে, ঐ ফাংশনের লোকাল ভ্যারিয়েবল গুলো রাখার জন্যে একটি 'স্কোপ' অবজেক্ট তৈরি করা হয়। এই স্কোপ ভ্যারিয়েবল ইনিশিয়ালাইজ করা হয় ফাংশনে প্যারামিটার হিসেবে যেসব ভ্যারিয়েবল পাঠানো হয়েছিল সেগুলো দ্বারা। এটা গ্লোবাল অবজেক্টের মতই যেখানে সব গ্লোবাল ভ্যারিয়েবল আর ফাংশনগুলো থাকে, কিন্তু দু'টি পার্থক্য সহ। প্রথমতঃ প্রতিবার একটি ফাংশন execute হওয়া শুরু করে একটি নতুন স্কোপ অবজেক্ট তৈরি হয়ে যায়। গ্লোবাল স্কোপ অবজেক্টের সাথে দ্বিতীয় পার্থক্যটি হল, গ্লোবাল স্কোপের প্রোপার্টি সরাসরি এক্সেস করা যায় (যেমন ব্রাউজারের ক্ষেত্রে এই গ্লোবাল অবজেক্ট টি হল window), কিন্তু ফাংশনের স্কোপের ক্ষেত্রে এটি সম্ভব নয়। উদাহরণস্বরূপ বলা যায়, ফাংশনের স্কোপ অবজেক্টের প্রোপার্টিকে iterate করে এক্সেস করা সম্ভব নয়।</p> - -<p>তাই যখন makeAdder কল করা হয়েছিল, একটা স্কোপ অবজেট তৈরি হয়ে গেছে। এই স্কোপ অবজেক্টের একটাই প্রোপার্টিঃ a ভ্যারিয়েবল যেটি কিনা এই ফাংশনের একমাত্র প্যারামিটার। makeAdder তারপর নতুন একটা ফাংশন তৈরি করে রিটার্ন করে। এই মুহূর্তে জাভাস্ক্রিপ্টের গারবেজ কালেকটর (কোন ভ্যারিয়েবল গুলোর আর প্রয়োজন নাই সেগুলো খুজে বের করে এরা যে মেমরি দখল করে রেখেছিল তা অন্য নতুন ভ্যারিয়েবলের জন্য ফ্রি করে দেওয়া'র পদ্ধতি) এর makeAdder এর স্কোপ অবজেট গায়েব করে ফেলার কথা, কিন্তু makeAdder যে ফাংশনটি তৈরি করে রিটার্ন করল তার মাঝে makeAdder এর স্কোপ অবজেক্টের একটা রেফারেন্স থেকে যায়। যে কারণে, যতক্ষণ makeAdder এর রিটার্ন করা ফাংশনের কোন না কোন রেফারেন্স কোডে অবশিষ্ট থাকছে (সহজভাবে যতক্ষণ এটি ব্যবহৃত হচ্ছে), ততক্ষণ makeAdder এর স্কোপ অবজেক্ট-টিও অক্ষত থাকবে।</p> - -<p>স্কোপ অবজেক্টেরা প্রোটোটাইপ চেইনে মত স্কোপ চেইন মেইনটেইন করে।</p> - -<p>ক্লোজার হচ্ছে একট ফাংশন আর এই ফাংশনকে যেই ফাংশন তৈরি করেছিল তার স্কোপ অবজেক্টের একটা সমন্বয় (combination)।</p> - -<p>ক্লোজার আপনাকে স্টেট মনে রাখার একটা সুবিধা দেয় - যে কারণে অবজেক্টের বদলে ক্লোজার ব্যবহার করা যেতে পারে।</p> - -<h3 id="মেমরি_অপচয়_(Memory_leaks)">মেমরি অপচয় (Memory leaks)</h3> - -<p>ক্লোজার ব্যবহারের একটি দুর্ভাগ্যজনক পার্শ্বপ্রতিক্রিয়া হল এটি ইন্টার্নেট এক্সপ্লোরারে মেমরি অপচয় করে। জাভাস্ক্রিপ্টে গার্বেজ কালেকশন পদ্ধতি ব্যবহার করা হয় অবজেক্টের দখল করা মেমরি ফ্রি করার জন্যে। অবজেক্ট যখন তৈরি হয় তখন তাদের মেমরি দেওয়া (allocate) করা হয় - যখন ঐ অবজেক্টের আর কোন রেফারেন্স কোডে অবশিষ্ট থাকে না তখন সেই মেমরি ফ্রি করে দেওয়া হয়। হোস্ট যেসব অবজেক্ট সরবরাহ করে সেগুলো হ্যান্ডেল সেই হোস্ট নিজেই করে।</p> - -<p>ব্রাউজার হোস্টগুলোর বিশাল পরিমাণে অবজেক্ট ম্যানেজ করা লাগে - যেই HTML পাতাটি দেখানো হচ্ছে - তার জন্যে <a href="/en/DOM" title="en/DOM">DOM</a> এর অবজেক্ট গুলো। এই অবজেক্টগুলো ম্যানেজ আর রিকভারি করার দায়িত্ব ব্রাউজারের।</p> - -<p>এই কাজের জন্যে ইন্টারনেট এক্সপ্লোরার (IE) তার নিজের গার্বেজ কালেকশন পদ্ধতি ব্যবহার করে, জাভাস্ক্রিপ্টের পদ্ধতি থেকে যেটি আলাদা। এই দুই এর মাঝে ইন্টারেকশনের জন্যে মেমরি অপচয় হতে পারে।</p> - -<p>IE তে মেমরি অপচয় হবে যখনি কোন জাভাস্ক্রিপ্ট অবজেক্ট আর নেটিভ অবজেক্টের মাঝে সার্কুলার (circular) রেফারেন্স তৈরি হবে। নিচের কোড দেখুনঃ</p> - -<pre class="brush: js">function leakMemory() { - var el = document.getElementById('el'); - var o = { 'el': el }; - el.o = o; -} -</pre> - -<p>ওপরের কোডে যে সার্কুলার রেফারেন্স তৈরি হল তার জন্যে IE, el <code>আর o অবজেক্টের দখল করা মেমরি ফ্রি করবে না যতক্ষণ না ব্রাউজার পুরোপুরি রিস্টার্ট করা হচ্ছে। ফলাফল মেমরি অপচয়...</code></p> - -<p>ওপরের কেইসটি প্রোগ্রামারের চোখ এড়িয়ে যেতে পারে, কারণ এই মেমরি অপচয় অনেক্ষণ-ধরে-চলছে এরকম বড়সর এপ্লিকেশনের ক্ষেত্রেই প্রভাব ফেলে। কোন এপ্লিকেশন জটিল ডেটা স্ট্রাকচার ব্যবহার করে বা লুপের মধ্যে মমরি অপচয় করলেও সেটা চোখে পড়বে।</p> - -<p>সার্কুলার রেফারেন্স ওপরের কোডের মত এত সহজে চোখে নাও পড়তে পারে। অনেক সময় মেমরি নষ্ট করা ডেটা স্ট্রাকচারে অনেক লেভেলের রেফারেন্সের পরে সার্কুলার রেফারেন্স তৈরি হতে পারে - তখন আর চট করে সার্কুলার রেফারেন্স ধরা যাবে না।</p> - -<p>ক্লোজার ব্যবহার করলে অনিচ্ছাকৃত মেমরি অপচয় হতে পারে। নিচের কোড টা দেখুনঃ</p> - -<pre class="brush: js">function addHandler() { - var el = document.getElementById('el'); - el.onclick = function() { - this.style.backgroundColor = 'red'; - } -} -</pre> - -<p>ওপরের কোডে HTML এলিমেন্ট টিকে লাল রং করা হবে যখন কেউ এর উপরে ক্লিক করবে। একই সাথে মেমরি লীক ও হতে থাকবে। কেন? কারণ এনোনিমাস inner ফাংশনটি'র ক্লোজারে el এর একটা রেফারেন্স অনিচ্ছাকৃতভাবে থেকে যাবে। এর ফলে একটা জাভাস্ক্রিপ্ট অবজেক্ট (ফাংশনটি) আর একটা নেটিভ অবজেক্ট (el) এর মাঝে সার্কুলার রেফারেন্স তৈরি হল।</p> - -<p>এই সমস্যা সমাধানের কয়েকটা উপায় আছে। সবথেকে সহজটি হল আদৌ কোন el ভ্যারিয়েবল ব্যবহার না করাঃ</p> - -<pre class="brush: js">function addHandler(){ - document.getElementById('el').onclick = function(){ - this.style.backgroundColor = 'red'; - } -} -</pre> - -<p>আরেকটা মজার উপায় হল এক ক্লোজার এর সার্কুলার রেফারেন্স অন্য আরেকটি ক্লোজার দিয়ে নষ্ট করাঃ</p> - -<pre class="brush: js">function addHandler() { - var clickHandler = function() { - this.style.backgroundColor = 'red'; - }; - (function() { - var el = document.getElementById('el'); - el.onclick = clickHandler; - })(); -} -</pre> - -<p>Inner ফাংশনটি সরাসরি execute হয়, এর ভেতরের সবকিছু clickHandler এর তৈরি করা ক্লোজার থেকে আড়াল করে।</p> - -<p>ক্লোজার থেকে দূরে থাকার আরেকটি ভাল বুদ্ধি হল window.onunload ইভেন্টে সার্কুলার রেফারেন্স দূর করা। অনেক ইভেন্ট লাইব্রেরী এই পদ্ধতি ব্যবহার করে। কিন্তু এরকম করলে আবার ফারায়ফক্স ১.5 এর bfcache কাজ করবে না, তাই ফায়ারফক্সে unload লিসেনার রেজিস্টার করা উচিত হবে না (যদি এমন হয় যে ব্যবহার না করে উপায় নাই তাহলে অবশ্য ভিন্ন কথা)।</p> - -<div class="originaldocinfo"> -<h2 id="Original_Document_Information" name="Original_Document_Information">মূল ডকুমেন্টের খবরাখবর...</h2> - -<ul> - <li>লেখকঃ <a class="external" href="http://simon.incutio.com/">Simon Willison</a></li> - <li>শেষ সম্পাদনাঃ মার্চ ৭, ২০০৬</li> - <li>কপিরাইটঃ © 2006 Simon Willison, contributed under the Creative Commons: Attribute-Sharealike 2.0 license.</li> - <li>আরো তথ্যঃ এই টিউটোরিয়াল নিয়ে আরো তথ্যের জন্য (আর মূল আলোচনার স্লাইডের লিংক পেতে) দেখুন Simon's <a class="external" href="http://simon.incutio.com/archive/2006/03/07/etech">Etech weblog post</a>.</li> -</ul> -</div> - -<p> </p> - -<p><em><strong>অনুবাদ সংক্রান্ত তথ্যঃ</strong> টেকনিকাল তথ্য অপরিবর্তিত রেখে ভাবানুবাদের পাশাপাশি সামান্য পরিমার্জনা করা হয়েছে।</em></p> diff --git a/files/bn/web/javascript/data_structures/index.html b/files/bn/web/javascript/data_structures/index.html deleted file mode 100644 index ab05a49d7a..0000000000 --- a/files/bn/web/javascript/data_structures/index.html +++ /dev/null @@ -1,116 +0,0 @@ ---- -title: জাভাস্ক্রিপ্টে ডেটা স্ট্রাকচার -slug: Web/JavaScript/Data_structures -tags: - - JavaScript -translation_of: Web/JavaScript/Data_structures ---- -<div>{{jsSidebar("More")}}</div> - -<p>সব প্রোগ্রামিং ল্যাংগুয়েজের নিজস্ব ডেটা স্ট্রাকচার থাকে (যা ব্যবহার করে আপনি আপনার ডেটা বা তথ্য প্রোগ্রামে রাখতে পারেন) - তবে একেক প্রোগ্রামিং ভাষায় একেক রকম ডেটা স্ট্রাকচার দেখা যায়। এই আর্টিকেলে জাভাস্ক্রিপ্টের নিজস্ব ডেটা স্ট্রাকচার আর সেগুলোর বিভিন্ন প্রোপার্টি (বৈশিষ্ট্য) নিয়ে আলোচনা করা হয়েছে। এই নিজস্ব ডেটা স্ট্রাকচার গুলো ব্যবহার করে অন্যান্য ডেটা স্ট্রাকচার বানানো যাবে। যেখানে সম্ভব অন্য ভাষার সাথে পার্থক্য ও দেখানো হয়েছে।</p> - -<h2 id="ডাইনামিক_টাইপিং">ডাইনামিক টাইপিং </h2> - -<p>JavaScript একটি loosely typed বা dynamic ভাষা। যার মানে হচ্ছে আমাদের আগে থেকে কোন variable এর type বলে দিতে বা ঠিক করে দিতে হবে না। কোন প্রোগ্রাম চলাকালে অটোমেটিক এর type ঠিক হয়ে যায়। যার মানে দাঁড়ায়, আমরা একই নামের বিভিন্ন type এর variable তৈরি করতে পারি!! </p> - -<pre><code>var foo = 42; // foo is now a Number -var foo = 'bar'; // foo is now a String -var foo = true; // foo is now a Boolean</code></pre> - -<h2 id="ডেটা_টাইপ">ডেটা টাইপ </h2> - -<p>ECMAScript স্ট্যান্ডার্ড অনুযায়ী ৭ ধরণের ডেটা স্ট্রাকচার আছেঃ</p> - -<p> </p> - -<ul> - <li>প্রথম ৬টি হল মৌলিক বা {{Glossary("Primitive", "primitives")}}: - <ul> - <li>বুলিয়ান {{Glossary("Boolean")}}</li> - <li>নাল {{Glossary("Null")}}</li> - <li>অসংগায়িত {{Glossary("Undefined")}}</li> - <li>সংখ্যা {{Glossary("Number")}}</li> - <li>স্ট্রিং {{Glossary("String")}}</li> - <li>সিম্বল {{Glossary("Symbol")}} (new in ECMAScript 6)</li> - </ul> - </li> - <li>এবং অবজেক্ট {{Glossary("Object")}}</li> -</ul> - -<p>নিচের আলোচনায় আমরা দেখব কিভাবে এগুলো ব্যবহার করে ডেটা রাখা যায় আর কীভাবে এগুলোর সাহায্যে আরও উন্নতমানের ডেটা স্ট্রাকচার তৈরি করা যায়।</p> - -<h2 id="মৌলিকবেসিক_মানসমূহ">মৌলিক/বেসিক মানসমূহ</h2> - -<p>অবজেক্ট ছাড়া বাকি সব টাইপের ডেটার মান তৈরি করার পর আর পরিবর্তন করা যায় না। বিশেষকরে, স্ট্রিং (যেখানে C ভাষায় স্ট্রিং এর মান পরিবর্তন করা যায়)। এই টাইপের ডেটাকে আমরা মৌলিক (primitive) টাইপের বলে থাকি। নিচে {{ anch("Strings") }} নিয়ে আলোচনায় এই বিষয়ে বিস্তারিত রয়েছে।</p> - -<h3 id="বুলিয়ান_নাল_এবং_অসংজ্ঞায়িত">বুলিয়ান, নাল এবং অসংজ্ঞায়িত</h3> - -<p>শুধুমাত্র চারটি ধ্রুবক (কন্সট্যান্ট) দিয়েই এই ডেটাটাইপ গুলো প্রকাশ করা সম্ভবঃ বুলিয়ান প্রকাশ করার জন্য <code>true</code>, <code>false</code>, নাল প্রকাশের জন্য <code>null</code>, আর অসংজ্ঞায়িত প্রকাশের জন্য <code>undefined</code>। যেহেতু এগুলো কন্সট্যান্ট, এগুলো উঁচুমানের ডেটা রাখতে পারে না।</p> - -<h3 id="সংখ্যা">সংখ্যা</h3> - -<p>ECMAScript স্ট্যান্ডার্ড অনুযায়ী সংখ্যা প্রকাশ করার জন্য একটি মাত্র নাম্বার-টাইপ আছেঃ "double-precision 64-bit binary format IEEE 754 value"। অন্যান্য প্রোগ্রামিং ভাষার মত Integer (পূর্ণ সংখ্যা) প্রকাশ করার জন্য আলাদা কোন টাইপ নেই! ভগ্নাংশ রাখার পাশাপাশি জাভাস্ক্রিপ্টের এই একমাত্র নাম্বার টাইপ দিয়ে <code>+Infinity</code>, <code>-Infinity</code>, এবং <code>NaN</code> (not-a-number) এই বিশেষ প্রতীক গুলোও প্রকাশ করা যায়।</p> - -<p>যদিও একটি সংখ্যা সাধারণত শুধুমাত্র এর মানই প্রকাশ করে, জাভাস্ক্রিপ্টের কিছু <a href="/en/JavaScript/Reference/Operators/Bitwise_Operators">বাইনারী অপারেটর</a> আছে, যেগুলো দিয়ে <a href="http://en.wikipedia.org/wiki/Mask_%28computing%29">বিট মাস্কিং</a> পদ্ধতিতে একটি মাত্র সংখ্যা থেকেই অনেকগুলো বুলিয়ান মান প্রকাশ করা সম্ভব। তবে এরকম ব্যবহার নিরুৎসাহিত করা হয়, কারণ জাভাস্ক্রিপ্টে অন্য পদ্ধতিতে বুলিয়ান মান রাখা যায় (যেমন বুলিয়ান মানের array ব্যবহার করে অথবা অবজেক্টে প্রত্যেকটা বুলিয়ান মানের জন্য একটা করে প্রোপার্টি ব্যবহার করে)। বিট মাসস্কিং ব্যবহার করলে কোড দুর্বোধ্য হয়, পরে এই কোড নিয়ে আর কাজ করাও যায় না। ক্ষেত্র বিশেষে বিট মাসস্কিং ব্যবহার না করে কোন উপায় থাকে না, যেমন স্টোরেজ সীমাবদ্ধতা থাকলে অথবা নেটওয়ার্ক দিয়ে প্রত্যেক্টা বিট পাঠানোর সময়। তবে যখনই পারা যায়, বিট মাসস্কিং শেষ সম্বল হিসেব রেখে দিয়ে দেখতে হবে অন্য কোন উপায়ে কোডটা করে ফেলা যায় কিনা!</p> - -<h3 id="স্ট্রিং">স্ট্রিং</h3> - -<p>স্ট্রিং হচ্ছে "বাক্য" বা একসাথে অনেকগুলো অক্ষর। C ভাষার সাথে জাভাস্ক্রিপ্টের পার্থক্য হচ্ছে জাভাস্ক্রিপ্টের স্ট্রিং তৈরি করার পর পরিবর্তন করা যায় না। তবে একটি স্ট্রিং এর ওপর কোন অপারেশন প্রয়োগ করে নতুন অন্য স্ট্রিং তৈরি করা যায়। যেমনঃ</p> - -<ul> - <li>মূল স্ট্রিং এর যেকোন অংশ থেকে যেকোন সংখ্যক অক্ষর নিয়ে সাব-স্ট্রিং তৈরি করা যায়। অথবা সরাসরি এই ফাংশন ব্যবহার করে সাবস্ট্রিং তৈরি করা যায়ঃ <a href="/en/JavaScript/Reference/Global_Objects/String/substr" title="substr"><code>String.substr()</code></a>।</li> - <li>যোগ করার অপারেটর (+) ব্যবহার করে দুইটা স্ট্রিং একের পর এক বসিয়ে নতুন আরেকটা স্ট্রিং তৈরি করা যায়। একই কাজ হয় <a href="/en/JavaScript/Reference/Global_Objects/String/concat" title="concat"><code>String.concat()</code></a> ফাংশন ব্যবহার করে।</li> -</ul> - -<h4 id="আপনার_কোডের_সব_ডেটা_স্ট্রিং_দিয়ে_প্রকাশ_করবেন_না!">আপনার কোডের সব ডেটা স্ট্রিং দিয়ে প্রকাশ করবেন না!</h4> - -<p>জটিল রকমের ডেটাকে স্ট্রিং দিয়ে প্রকাশ করার প্রবণতা খুবই লক্ষ্য করা যায়। কারণ, কিছু সুবিধা পাওয়া যায় প্রায় সবকিছু স্ট্রিং দিয়ে প্রকাশ করতে গেলেঃ</p> - -<ul> - <li>স্ট্রিং এর পর স্ট্রিং বসিয়ে অনেক জটিল ডেটা তৈরি করা যায়।</li> - <li>স্ট্রিং ডেটাকে ডিবাগ করা খুব সহজ।</li> - <li>অনেক API তেই স্ট্রিং খুব পরিচিত একটা মুখ। এসব API এর মধ্যে উদাহরণ হিসেবে <a href="/en/DOM/HTMLInputElement" title="HTMLInputElement">input fields</a>, <a href="/en/Storage" title="Storage">local storage</a> মান, {{ domxref("XMLHttpRequest") }} responses যখন <code>responseText ব্যবহার করা হচ্ছে</code>, ইত্যাদি।) তাই মনে হতে পারে সব ডেটাই তো স্ট্রিং দিয়ে প্রকাশ করা যাচ্ছে!</li> -</ul> - -<p>এটা সত্য যে প্রায় সব ডেটা স্ট্রাকচার কেই স্ট্রিং দিয়ে প্রকাশ করা সম্ভব, কিন্তু এটা ভাল আইডিয়া না। যেমন, আলাদা করার জন্য কিছু একটা ব্যবহার করে কেউ স্ট্রিং দিয়ে লিস্ট তৈরি করার চেষ্টা করতে পারে (যেখানে array বেশি উপযুক্ত হত)। এখন আলাদা করার জন্য যেই অক্ষরটা ব্যবহার করা হয়েছে, সেটিই যদি লিস্টের সদস্য হিসেবে হাজির হয় তাহলে সমস্যা দেখা দিবে। কোন এসকেপ অক্ষর ব্যবহার করা যেতে পারে হয়ত, কিন্তু এত কাহিনী কীর্তি করার তো দরকার নেই কারণ লিস্ট রাখার জন্য নিবেদিত ডেটা স্ট্রাকচার ই আছে, যেটা ব্যবহার না করে স্ট্রিং ব্যবহার করলে অপ্রয়োজনীয় বোঝা বহন করতে হবে।</p> - -<p>তাই শুধুমাত্র টেক্সট-জাতীয় ডেটা রাখার জন্যই স্ট্রিং ব্যবহার করা উচিত। জটিল ডেটা রাখার জন্য স্ট্রিংটিকে পার্স করে উপযুক্ত ডেটা স্ট্রেকচার ব্যবহার করতে হবে।</p> - -<h2 id="অবজেক্ট">অবজেক্ট</h2> - -<p>জাভাস্ক্রিপ্টে, অবজেক্টকে আমরা অনেকগুলো ডেটা রাখার জন্য একটা প্যাকেট হিসেবে চিন্তা করতে পারি। <a href="/en/JavaScript/Guide/Values,_variables,_and_literals#Object_literals">অবজেক্ট লিটেরেল সিনট্যাক্স</a> ব্যবহার করে আমরা অবজেক্টের অল্প কিছু প্রোপার্টির মান দিয়ে দিতে পারি। তবে পরে যেকোন সময় যেকোন প্রোপার্টি ঐ অবজেক্টে যোগ বা বিয়োগ করা যাবে। যেকোন টাইপের ডেটা আমরা প্রোপার্টি হিসেবে রাখতে পারি অবজেক্টের, অন্য অবজেক্টের ডেটাও। এভাবে, জটিল ডেটা স্ট্রাকচার তৈরি করা সম্ভব।</p> - -<h3 id="সাধারণ_অবজেক্ট_আর_ফাংশন">"সাধারণ" অবজেক্ট, আর ফাংশন</h3> - -<p>জাভাস্ক্রিপ্টে অবজেক্ট হচ্ছে key-value ম্যাপিং। মানে অবজেক্টের কোন একটা স্ট্রিং key এর মান হিসেবে যেকোন ডেটা টাইপের value রাখা যাবে। তাই অবজেক্ট কে <a href="http://en.wikipedia.org/wiki/Hash_table">হ্যাশ-ম্যাপের</a> বিকল্প হিসেবে ব্যবহার করা যায়। তবে, নন-স্ট্যান্ডার্ড <code><a href="/en/JavaScript/Reference/Global_Objects/Object/proto" title="__proto__">__proto__</a></code> pseudo প্রোপার্টি সাবধানে ব্যবহার করতে হবে। যেখানে প্রযোজ্য, সেখানে <code><a href="/en/JavaScript/Reference/Global_Objects/Object/proto" title="__proto__">__proto__</a></code> এর ভুল মান বসালে অবজেক্টের নিজস্ব প্রোটোটাইপ (ধরণ) বদলে যাবে। যেসব ক্ষেত্রে আমরা জানি না কোন স্ট্রিং এর উৎস কী (যেমন কোন ইনপুট ফিল্ড) সেসব ক্ষেত্রে সাবধান থাকতে হবেঃ <a href="http://productforums.google.com/forum/#!category-topic/docs/documents/0hQWeOvCcHU">অন্যরা এই সমস্যায় ভুগেছে</a>। এসব ক্ষেত্রে কোন <a class="external" href="http://code.google.com/p/google-caja/source/browse/trunk/src/com/google/caja/ses/StringMap.js?r=4779">StringMap abstraction</a> ব্যবহার করা যেতে পারে।</p> - -<p>ফাংশনও অবজেক্ট, জাভাস্ক্রিপ্টে। পার্থক্য হল, ফাংশন কে কল করা যায়।</p> - -<h3 id="Arrays">Arrays</h3> - -<p><a href="/en/JavaScript/Reference/Global_Objects/Array" title="Array">Arrays</a> ও অবজেক্ট, জাভাস্ক্রিপ্টে। তবে এখানে, প্রোপার্টি গুলোর key হচ্ছে পূর্ণ সংখ্যা আর বিশেষ 'length' প্রোপার্টি রয়েছে এদের। আরও কাহিনী হল, এরেগুলো ইনহেরিট হয় <code>Array.prototype</code> থেকে - যার ফলে বেশ কিছু দরকারি ফাংশন পাওয়া যায় এরে অবজেক্ট গুলো থেকে। যেমন, <code><a href="/en/JavaScript/Reference/Global_Objects/Array/indexOf" title="en/JavaScript/Reference/Global_Objects/Array/indexOf">indexOf</a></code> ফাংশন ব্যবহার করে array তে কোন একটা মান (সদস্য) আছে কিনা জানা যায় আবার <code><a href="/en/JavaScript/Reference/Global_Objects/Array/push" title="en/JavaScript/Reference/Global_Objects/Array/push">push</a></code> ফাংশন ব্যবহার করে এরে এর শেষে কোন সদস্য যোগ করা যায়। লিস্ট কিংবা সেট হিসেবে ব্যবহার করার জন্য তাই এরে হচ্ছে সবচেয়ে উপযুক্ত ডেটা-স্ট্রাকচার।</p> - -<h3 id="তারিখ">তারিখ</h3> - -<p>তারিখ প্রকাশ করার জন্য সবচেয়ে উপযুক্ত হবে নিজস্ব <a href="/en/JavaScript/Reference/Global_Objects/Date" title="en/JavaScript/Reference/Global_Objects/Date"><code>Date</code></a> ইউটিলিটি ব্যবহার করা। </p> - -<h3 id="WeakMaps_ম্যাপ_সেট">WeakMaps, ম্যাপ, সেট</h3> - -<p>স্ট্যান্ডার্ড নয়। আশা করা যায় ECMAScript 6. ভার্সনে স্ট্যান্ডার্ড হবে।</p> - -<p>এসব ডেটা স্ট্রাকচার কোন অবজেক্টের রেফারেন্স কে key হিসেবে নিতে পারে। সেট দিয়ে একসারি (set) অব্জেট প্রকাশ করা হয়, আবার WeakMaps আর ম্যাপ দিয়ে কোন অবজেক্ট কে ভ্যালু হিসেবে রাখা হয়। ম্যাপ আর উইকম্যাপ এর মাঝে পার্থক্য হচ্ছেঃ ম্যাপে অবজেক্ট key, enumerate করা যায়। আর উইকম্যাপে গার্বেজ-কালেকশন বেশি ভালভাবে কাজ করে।</p> - -<p>শুধুমাত্র ECMAScript 5 ব্যবহার করেই ম্যাপ ও সেট ইমপ্লিমেন্ট করা সম্ভব। কিন্তু যেহেতু অবজেক্ট compare (যেমন, কোনটা কার থেকে ছোট সেই তুলনা করতে গেলে) করা সম্ভব না, লুক-আপ পারফরমেন্স linear হয়ে যাবে এতে। এর থেকে নেটিভ ইমপ্লেমেন্টেশন ভাল হবে কারণ তাহলে লুক-আপ পারফরমেন্স লগারিদমিক থেকে কন্সটান্ট পর্যন্ত হতে পারবে।</p> - -<p>সাধারণভাবে, DOM নোডে ডেটা bind করার জন্য যে কেউ সরাসরিভাবে অবজেক্টে প্রোপার্টি হিসেবে দিয়ে দিতে পারে, অথবা <code>data-*</code> attribute গুলো ব্যবহার করতে পারে। এর সমস্যা হল একই context এ চলছে এরকম যেকোন স্ক্রিপ্ট এই ডেটা ব্যবহার করতে পারবে। ম্যাপ আর উইকম্যাপ দিয়ে ডেটা কোন অব্জেক্টের সাথে সহজেই প্রাইভেট ভাবে bind করা যায়।</p> - -<h3 id="TypedArrays">TypedArrays</h3> - -<p>স্ট্যান্ডার্ড নয়। আশা করা যায় ECMAScript 6. ভার্সনে স্ট্যান্ডার্ড হবে।</p> - -<h2 id="আরও_দেখুন">আরও দেখুন</h2> - -<ul> - <li><a class="link-https" href="https://github.com/nzakas/computer-science-in-javascript/">Nicholas Zakas এরঃ জাভাস্ক্রিপ্টে বহুল-প্রচলিত ডেটা স্ট্রাকচার আর এলগরিদমের সংগ্রহশালা </a></li> - <li><a href="https://github.com/monmohan/DataStructures_In_Javascript" title="https://github.com/monmohan/DataStructures_In_Javascript">জাভাস্ক্রিপ্টে Search Tre(i)es ইমপ্লিমেন্টেশন</a></li> -</ul> diff --git a/files/bn/web/javascript/guide/grammar_and_types/index.html b/files/bn/web/javascript/guide/grammar_and_types/index.html deleted file mode 100644 index b5dbd8bda4..0000000000 --- a/files/bn/web/javascript/guide/grammar_and_types/index.html +++ /dev/null @@ -1,635 +0,0 @@ ---- -title: 'ভ্যালু, ভ্যারিয়েবল, এবং লিটারেল' -slug: Web/JavaScript/Guide/Grammar_and_types -tags: - - জাভাস্ক্রিপ্ট -translation_of: Web/JavaScript/Guide/Grammar_and_types ---- -<p>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Introduction", "Web/JavaScript/Guide/Control_flow_and_error_handling")}}</p> - -<p>এই চ্যাপ্টারের আলোচ্য বিষয় হল ভ্যালু যা জাভাস্ক্রিপ্ট চেনে এবং জাভাস্ক্রিপ্ট এক্সপ্রেশন গঠনের মূল কাঠামো: ভেরিয়েবল, কনস্টান্ট, এবং লিটারেল সম্পর্কে বর্ণনা করে।</p> - -<h2 id="Values(মান)">Values(মান)</h2> - -<p>জাভাস্ক্রিপ্ট নিচে উল্লেখিত পাঁচ ধরণের প্রাথমিক টাইপের ভ্যালুগুলো চেনে:</p> - -<table> - <caption> </caption> - <thead> - <tr> - <th scope="col">টাইপ</th> - <th scope="col">ভ্যালু টাইপের উদাহরন / ব্যাখ্যা</th> - </tr> - </thead> - <tbody> - <tr> - <td><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Number" style="color: rgb(34, 85, 170); text-decoration: underline; line-height: 21px;" title="en-US/docs/JavaScript/Reference/Global Objects/Number">সংখ্যা/Number</a></td> - <td>42, 3.14159</td> - </tr> - <tr> - <td><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Boolean" style="color: rgb(34, 85, 170); text-decoration: underline; line-height: 21px;" title="en-US/docs/JavaScript/Reference/Global Objects/Boolean">বুলিয়ান/Boolean</a></td> - <td>true / false</td> - </tr> - <tr> - <td><a href="/en-US/docs/JavaScript/Reference/Global_Objects/String" style="color: rgb(34, 85, 170); text-decoration: underline; line-height: 21px;" title="en-US/docs/JavaScript/Reference/Global Objects/String">স্ট্রিং/String</a></td> - <td>"Howdy"</td> - </tr> - <tr> - <td><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">null</span></td> - <td><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">null বা "শুন্য"</span><span style="line-height: 21px;"> ভ্যালু নির্দেশ করার জন্য এই কী-ওয়ার্ড টি ব্যবহার করা হয়। এছাড়া নাল একপ্রকার প্রিমিটিভ ভ্যালু। যেহেতু জাভাস্ক্রিপ্ট ইংরেজী হরফের কেইস-সংবেদনশীল(</span>case-sensitive), <code style="font-size: 14px;">null তাই</code> <code style="font-size: 14px;">Null</code>, <code style="font-size: 14px;">NULL অথবা এগুলোর সমমানের </code>সবগুলো-ই ভিন্ন।</td> - </tr> - <tr> - <td><a href="/en-US/docs/JavaScript/Reference/Global_Objects/undefined" style="color: rgb(34, 85, 170); text-decoration: underline; font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;" title="en-US/docs/JavaScript/Reference/Global Objects/undefined">undefined</a></td> - <td><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">undefined হল </span>top-level প্রোপার্টি যার <span style="line-height: 1.5;">ভ্যালু হচ্ছে </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">এটা বা</span>'অসংজ্ঞায়িত' হিসেবে চিহ্নিত করার জন্য <span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">। এটা</span><span style="line-height: 1.5;">একটি প্রিমিটিভ ভ্যালু। </span></td> - </tr> - </tbody> -</table> - -<p> </p> - -<p>এই গুটিকয়েক টাইপের ভ্যালু অথবা <em>ডেটা টাইপ</em> ব্যবহার করেই আসলে যেকোন কাজের কোড লিখে ফেলা সম্ভব। Integer আর ভগ্নাংশ (floating value) রাখার জন্য পৃথক ডেটা-টাইপ নাই। একইভাবে, তারিখ রাখার জন্যে কোন আলাদা ডেটা-টাইপ নাই, অবশ্য আপনি চাইলে <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Date" title="en-US/docs/JavaScript/Reference/Global Objects/Date">Date</a></code> অবজেক্ট আর এর বিভিন্ন কাজের মেথড ব্যবহার করতে পারেন।</p> - -<p><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Object" title="en-US/docs/JavaScript/Reference/Global Objects/Object">Objects</a> আর <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Function" title="en-US/docs/JavaScript/Reference/Global Objects/Function">functions</a> হচ্ছে ভাষাটির অন্যতম গুরুত্বপূর্ণ উপাদান। ফাংশন অন্যান্য প্রোগ্রামিং ভাষার মতই - কোন একটি বিশেষ কাজ করার জন্য লেখা হয় ফাংশন। আর অবজেক্টে থাকে নাম-ভ্যালু যুগল! (key-value pairs) - নাম ব্যবহার করে ভ্যালুতে কি রাখা আছে জানতে পারবেন।</p> - -<h3 id="ডেটা-টাইপের_রূপান্তরকনভার্সন">ডেটা-টাইপের রূপান্তর/কনভার্সন</h3> - -<p>জাভাস্ক্রিপ্ট ডায়নামিক-টাইপ (dynamically typed) ভাষা, মানে কোন ভ্যারিয়েবলের টাইপ কি সেটা বলে দিতে হয়না, জাভাস্ক্রিপ্ট নিজেই রান-টাইমে বের করবে। এই টাইপ পরিবর্তন ও করা যায় রান-টাইমে। স্ক্রিপ্ট চলার সময় প্রয়োজনমত ভ্যারিয়েবলের টাইপ ও কনভার্ট করে নেওয়া হয়। ধরে নেই, আপনি নিচের মত করে ভ্যারিয়েবল ডিক্লেয়ার করেছেনঃ</p> - -<div style="overflow: hidden;"> -<pre class="brush: js">var answer = 42; -</pre> -</div> - -<p>পরে কোন এক সময় আপনি একই ভ্যারিয়েবলে স্ট্রিং মান বসালেনঃ</p> - -<div style="overflow: hidden;"> -<pre class="brush: js">answer = "Thanks for all the fish..."; -</pre> -</div> - -<p>জাভাস্ক্রিপ্ট ডায়নামিক-টাইপ বলেই এই লাইনে কোন ভুল হয়নি। কোডের ভাষা জাভা/সি হলে এই লাইনেই ভুল হত।</p> - -<p>যদি কোন এক্সপ্রেশনে সংখ্যা আর স্ট্রিং মান এর মাঝে '+' ওপারেটের ব্যবহার করেন, তাহলে সংখ্যা-ভ্যালু গুলো স্ট্রিং এ কনভার্ট হয়ে যাবে। যেমনঃ</p> - -<pre class="brush: js">x = "The answer is " + 42 // "The answer is 42" -y = 42 + " is the answer" // "42 is the answer" -</pre> - -<p>তবে '+' ব্যাতীত অন্য অপারেটরের ক্ষেত্রে কিন্তু সংখ্যাকে স্ট্রিং এ কনভার্ট করা হয় না! যেমনঃ</p> - -<pre class="brush: js">"37" - 7 // 30 -"37" + 7 // "377" - -</pre> - -<p>আসলে জাভাস্ক্রিপ্টে '+' সাইন দিয়ে যেমন নিউমেরিক সংখ্যার যোগ এর কাজ করা হয়। ঠিক তেমনি স্ট্রিং এর ক্ষেত্রে দুইটা স্ট্রিং কে জোড়া দেয়ার কাজ করে থাকে। যাকে ইংরেজিতে <code>concatenation</code> বলা হয়। এই কাজটা <code>concat()</code> নামক ফাংশন ব্যবহার করেও করা হয়ে থাকে।</p> - -<h3 id="স্ট্রিং_থেকে_সংখ্যা">স্ট্রিং থেকে সংখ্যা</h3> - -<p>স্ট্রিং কে সংখ্যায় কনভার্ট করতে পারবেন নিচের মেথডগুলো ব্যবহার করেঃ</p> - -<h4 id="parseInt()_আর_parseFloat()"><code>parseInt()</code> আর <code>parseFloat()</code></h4> - -<p>দেখুনঃ <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/parseInt" title="en-US/docs/JavaScript/Reference/Global Objects/parseInt">parseInt()</a></code> আর <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/parseFloat" title="en-US/docs/JavaScript/Reference/Global Objects/parseFloat">parseFloat()</a></code> পাতায়।</p> - -<p><code>parseInt</code> শুধুমাত্র integer রিটার্ন করে, তাই দশমিক সংখ্যা নিয়ে কাজকারবারেই এর ব্যবহার সীমিত। এছাড়া, একটি ভাল অভ্যাস হল এই ফাংশনে ২য় প্যারামিটারে কনভার্সনের ভিত্তি (base) পাঠিয়ে দেওয়া।</p> - -<h4 id="''_অপারেটর">'+' অপারেটর</h4> - -<p>স্ট্রিং কে সংখ্যায় কনভার্ট করার আরেকটা বুদ্ধি হল '+' অপারেটর ব্যবহার করাঃ</p> - -<pre class="brush: js">"1.1" + "1.1" = "1.11.1" -(+"1.1") + (+"1.1") = 2.2 // শুধুমাত্র বোঝার সুবিধার জন্যে বন্ধনী ব্যবহার করা হয়েছে।</pre> - -<h2 id="ভ্যারিয়েবল">ভ্যারিয়েবল</h2> - -<p>আপনার এপ্লিকেশনে ব্যবহার করার জন্য যেকোন ভ্যালু, মেমরী তে সংরক্ষণ করে রাখতে ভ্যারিয়েবল ব্যবহার করুন। ভ্যারিয়েবল হিসেবে আমরা যে নামগুলো দিতে পারব তাদের <em>identifiers</em> বলা হয়। এগুলো দেওয়ার কিছু নিয়ম আছেঃ</p> - -<p>জাভাস্ক্রিপ্টে <em>identifiers </em>অবশ্যই কোন বর্ণ (letter), আন্ডারস্কোর (_) অথবা ডলার চিহ্ন ($) দিয়ে শুরু করতে হবে; পরবর্তী অক্ষরে সংখ্যা (0-9) ব্যবহার করা যাবে। জাভাস্ক্রিপ্টে হরফের case (ইংরেজীতে বড় হাতের বা ছোট হাতের হরফ) গুরুত্বপূর্ণ - ইংরেজী "A" থেকে শুরু করে "Z" পর্যন্ত বর্ণগুলো বড় হাতের, আর "a" থেকে শুরু করে "z" পর্যন্ত বর্ণগুলো ছোট হাতের।</p> - -<p>জাভাস্ক্রিপ্ট ১.৫ বা এর ওপরের ভার্সনগুলোতে আপনি ISO 8859-1 বা ইউনিকোড অক্ষর যেমন অ/আ/ক/খ ব্যবহার করতে পারবেনঃ</p> - -<pre class="brush: js">var ফল = "কলা"; -alert(ফল);</pre> - -<p>ভ্যারিয়েবলের নাম হিসেবে বাংলা অক্ষর ব্যবহার করছি! এছাড়াও \uXXXX {{anch("Unicode escape sequences")}} ক্যারেকটার হিসেবে আইডেন্টিফায়ারে ব্যবহার করা যাবে।</p> - -<p>বৈধ ভ্যারিয়েবলের নামের কিছু উদাহরণঃ <code>Number_hits</code>, <code>temp99</code>, এবং <code>_name</code>।</p> - -<h3 id="ভ্যারিয়েবল_তৈরি_করা">ভ্যারিয়েবল তৈরি করা</h3> - -<p>দু'টি উপায়ে ভ্যারিয়েবল তৈরি (declare) করা যায়ঃ</p> - -<ul> - <li><a href="/en-US/docs/JavaScript/Reference/Statements/var" title="en-US/docs/JavaScript/Reference/Statements/var">var</a> কী-ওয়ার্ড ব্যবহার করে। যেমনঃ <code>var x = 42</code>। লোকাল আর গ্লোবাল দুই ধরণের ভ্যারিয়েবল-ই এই কীওয়ার্ড দিয়ে তৈরি করা যায়।</li> - <li>সরাসরি ভ্যালু এসাইন করে দিয়ে। যেমনঃ <code>x = 42</code>। এটি করলে <a href="#Global_Variables">global ভ্যারিয়েবল</a> তৈরি হবে আর strict লেভেলের ওয়ার্নিং তৈরি হবে। তাই এই পদ্ধতি ব্যবহার করা অনুচিত।</li> -</ul> - -<h3 id="ভ্যারিয়েবলের_মান_কী">ভ্যারিয়েবলের মান কী?</h3> - -<p><code>var</code> স্টেটমেন্ট ব্যবহার করে কোন ভ্যালু দিয়ে ইনিশিয়ালাইজ না করলে তার মান হিসেবে থাকবে <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/undefined" title="en-US/docs/JavaScript/Reference/Global Objects/undefined">undefined</a></code>।</p> - -<p>তৈরি করা হয়নি (undeclared) এমন কোন ভ্যারিয়েবল নিয়ে কাজ করতে গেলে <code>ReferenceError</code> এক্সেপশন পাবেনঃ</p> - -<pre class="brush: js">var a; -console.log("The value of a is " + a); // logs "The value of a is undefined" -console.log("The value of b is " + b); // throws ReferenceError exception -</pre> - -<p>কোন ভ্যারিয়েবলে ভ্যালু দেওয়া হয়েছে কিনা জানতে তাই <code>undefined</code> ব্যবহার করুন। নিচের কোডে <code>input</code> ভ্যারিয়েবলে কোন ভ্যালু দেই নি, তাই <code><a href="/en-US/docs/JavaScript/Reference/Statements/if...else" title="en-US/docs/JavaScript/Reference/Statements/if...else">if</a></code> স্টেটমেন্টে <code>true</code> পাওয়া যাচ্ছেঃ</p> - -<pre class="brush: js">var input; -if(input === undefined){ - doThis(); -} else { - doThat(); -} -</pre> - -<p><span class="comment">The following is related to "Variables" section as potential values in assignment.</span></p> - -<p>বুলিয়ান কন্টেক্সট এ ব্যবহার করলে অবশ্য <code>undefined</code>, <code>false</code> হিসেবে আচরণ করে। যেমনঃ নিচের কোডে <code>myFunction</code> ফাংশনটি একজিকিউট হবে কারণ <code>myArray</code> এলিমেন্ট টি তৈরি করা হয় নি।</p> - -<pre class="brush: js">var myArray = new Array(); -if (!myArray[0]) myFunction(); -</pre> - -<p>তবে numeric কন্টেক্সটে ব্যবহৃত হলে <code>undefined</code> কনভার্ট হবে <code>NaN</code> এঃ</p> - -<pre class="brush: js">var a; -a + 2 = NaN</pre> - -<p>যখন কোন নাল ভ্যারিয়েবল ব্যবহারের চেষ্টা করেন, তখন বুলিয়ান কন্টেক্সটে false আর numeric কন্টেক্সটে 0 হিসেবে এর মান নির্ণিত হয়ঃ</p> - -<pre class="brush: js">var n = null; -console.log(n * 32); // logs 0 -</pre> - -<h3 id="ভ্যারিয়েবলের_স্থায়িত্বস্কোপ_(scope)">ভ্যারিয়েবলের স্থায়িত্ব/স্কোপ (scope)</h3> - -<p>যখন একটা ভ্যারিয়েবল কে কোন ফাংশনের বাইরে তৈরি করেন তখন তাকে <em>global </em>ভ্যারিয়েবল বলি, কারণ ডকুমেন্টের যেকোন জায়গায় ঐ ভ্যারিয়েবল টা ব্যবহার করা যাবে। অপরদিকে, কোন ফাংশনের ভিতর যদি ভ্যারিয়েবলটি তৈরি করেন, তাহলে সেটি <em>local </em>ভ্যারিয়েবল, কারণ ঐ ফাংশনের বাইরে ঐ ভ্যারিয়েবলের কোন অস্তিত্ব নাই।</p> - -<p>জাভাস্ক্রিপ্টে <a href="/bn-BD/docs/JavaScript/Guide/Statements#Block_Statement" title="/bn-BD/docs/JavaScript/Guide/Statements#Block_Statement">ব্লক স্টেটেমেন্টের</a> আলাদা কোন স্কোপ নেই; বরং একটা ফাংশনে যতগুলো ব্লক-ই থাকুক না কেন সবগুলো একই স্কোপে - ঐ ফাংশনের স্কোপে থাকে। যেমন নিচের কোড 5 লগ করবে (জাভাস্ক্রিপ্ট কনসোলে 5 লিখবে) কারণ x ভ্যারিয়েবলের স্কোপ if ব্লকের বাইরেও আছে।</p> - -<pre class="brush: js">if (true) { - var x = 5; -} -console.log(x); -</pre> - -<p>অন্য প্রোগ্রামিং ভাষার সাথে জাভাস্ক্রিপ্টের অমিল এখানেই। আরেকটা অপ্রত্যাশিত ব্যাপার হলঃ পরে তৈরি করা হয়েছে এমন ভ্যারিয়েবল আগে ব্যবহার করতে পারবেন অনায়াসে। কারণ ধরে নেওয়া হয় যে ভ্যারিয়েবল গুলো ফাংশনের শুরুতেই টুকে নেওয়া হয়েছে। তবে যাই হোক, যদি কোন ভ্যালু দিয়ে ভ্যারিয়েবল initialize না করেন তাহলে এর মান <code>undefined</code> পাবেন ।</p> - -<pre class="brush: js">/** - * Example 1 - */ -console.log(x === undefined); // logs "true" -var x = 3; - - -/** - * Example 2 - */ -// will return a value of undefined -var myvar = "my value"; - -(function() { - console.log(myvar); // undefined - var myvar = "local value"; -})(); -</pre> - -<p>২ নাম্বার উদাহরণ টি খুব সাবধানে দেখুন! ২ নম্বর উদাহরণটি এভাবে কাজ করবেঃ</p> - -<pre class="brush: js">var myvar = "my value"; - -(function() { - var myvar; - console.log(myvar); // undefined - myvar = "local value"; -})();</pre> - -<p>যেমনটা বলেছিলাম, সব <code>var স্টেটমেন্টগুলো যেন ফাংশনের শুরুতেই তৈরি করা হয়েছে। এভাবে কোড করলে ভুল হওয়ার সম্ভাবনা কমে যায় আর সহজেই বুঝতে পারা যায় কী হচ্ছে!</code></p> - -<h3 id="গ্লোবাল_ভ্যারিয়েবল">গ্লোবাল ভ্যারিয়েবল</h3> - -<p>গ্লোবাল ভ্যারিয়েবল হচ্ছে আসলে একটা <em>global object</em> এর প্রোপার্টি! ওয়েবপেইজে গ্লোবাল অবজেক্ট টা হচ্ছে <code><a href="/en-US/docs/DOM/window" title="en-US/docs/DOM/window">window</a>, তাই আপনি </code><code>window.<em>variable </em>সিন্ট্যাক্স ব্যবহার করেও গ্লোবাল ভ্যারিয়েবল এক্সেস করতে পারবেন।</code></p> - -<p><span class="comment">need links to pages discussing scope chains and the global object</span>ফলস্বরূপ, ব্রাউজারের এক উইন্ডো তে তৈরি করা গ্লোবাল ভ্যারিয়েবল কে ব্রাউজারের অন্য উইন্ডোতে বা ফ্রেম থেকে এক্সেস করা যাবে উইন্ডো বা ফ্রেমটির name ব্যবহার করে। যেমন, কোন একটা <code>FRAMESET ডকুমেন্টে তৈরি করা </code><code>phoneNumber ভ্যারিয়েবলকে এর কোন বাচ্চা ফ্রেম (child frame) থেকে </code><code>parent.phoneNumber ব্যবহার করে এক্সেস করতে পারবেন।</code></p> - -<h2 id="কন্সট্যান্ট">কন্সট্যান্ট</h2> - -<p>শুধু পড়া যাবে, মান পরিবর্তন করা যাব্বে না এমন ভ্যারিয়েবল তৈরি করতে পারেন <code><a href="/en-US/docs/JavaScript/Reference/Statements/const" title="en-US/docs/JavaScript/Reference/Statements/const">const</a> কী-ওয়ার্ড দিয়ে। এর আইডেন্টিফায়ার এর সিন্ট্যাক্স ভ্যারিয়েবলের আইডেন্টিফায়ার এর মতইঃ অবশ্যি অক্ষর, আন্ডারস্কোর অথবা $ চিহ্ন দিয়ে শুরু হতে হবে আর এরপর অক্ষর, সংখ্যা বা আন্ডারস্কোর থাকতে পারবে।</code></p> - -<pre class="brush: js">const prefix = '212'; -</pre> - -<p>শুরুতেই মান নির্ধারণ করে দেওয়ার পর কন্সট্যান্ট এর মান পরিবর্তন করা যায় না বা নতুন করে একই নামে কন্সট্যান্ট তৈরি করা যায় না।</p> - -<p>কন্সট্যান্ট এর স্কোপ ভ্যারিয়েবলের মতই। তবে <code>const কী-ওয়ার্ড টা অবশ্যই লিখতে হবে, না হলে জাভাস্ক্রিপ্ট কীভাবে ধরবে আপনি ভ্যারিয়েবল নাকি কন্সট্যান্ট কোনটা তৈরি করতে চাচ্ছেন! কীওয়ার্ড টা ব্যবহার না করলে তাই একে ভ্যারিয়েবল হিসেবেই গণ্য করা হবে।</code></p> - -<p>একই স্কোপের ভেতর কোণ ফাংশন অথবা ভ্যারিয়েবলের নামে কন্সট্যান্ট তৈরি করা যায় না। যেমনঃ</p> - -<pre class="brush: js">// নিচের কোডে ভুল আছে -function f() {}; -const f = 5; - -// নিচেরটাও ভুল! -function f() { - const g = 5; - var g; - - //statements -} -</pre> - -<h2 id="লিট্যারেল">লিট্যারেল</h2> - -<p>লিটারেল কে জাভাস্ক্রিপ্টে ভ্যালু হিসেবে ব্যবহার করা যায়। এগুলো যেভাবে দেখানো হয়, সেভাবেই লিখতে হবে - এগুলো ভ্যারিয়েবল না। যেভাবে দেখানো হচ্ছে সেভাবেই কোডে লিখতে হবে বলেই এদের নাম লিটারেল (literal)! এই অংশে নিচের লিট্যারেল গুলো নিয়ে আলোচনা করেছিঃ</p> - -<ul> - <li>{{anch("Array লিটারেল")}}</li> - <li>{{anch("বুলিয়ান লিটারেল")}}</li> - <li>{{anch("ভগ্নাংশের লিটারেল")}}</li> - <li>{{anch("Integers")}}</li> - <li>{{anch("Object literals")}}</li> - <li>{{anch("String literals")}}</li> -</ul> - -<h3 id="Array_লিটারেল">Array লিটারেল</h3> - -<p>Array লিটারেল হচ্ছে শূণ্য বা এর থেকে বেশি সংখ্যক "এক্সপ্রেশনের" একটা লিস্ট - এই সব এক্সপ্রেশনের প্রত্যেকেই হচ্ছে array টির একেকটি সদস্য - এই লিস্টের সামনে আর পরে তৃতীয় বন্ধনী ([]) ব্যবহার করতে হবে। যখন আপনি array লিটারেল ব্যবহার করে array তৈরি করবেন, তখন এই লিস্টের ভ্যালুগুলোকে array টির সদস্য হিসেবে বিবেচনা করে arrayটি ইনিশিয়ালাইজ করা হয়। আর যতগুলো সদস্য দিলাম, array এর length তত।</p> - -<p>নিচের উদাহরণে ৩ সদস্য বিশিষ্ট তদন্ত কমিটি থুক্কু <code>coffees নামের array তৈরি করা হয়েছে - array টির length ও তাই তিনঃ</code></p> - -<pre class="brush: js">var coffees = ["French Roast", "Colombian", "Kona"]; -</pre> - -<p><strong>খেয়াল করুনঃ</strong> array লিটারেল হচ্ছে বিশেষ ধরণের অবজেক্ট ইনিশিয়ালাইজার। দেখুন <a href="/bn-BD/docs/JavaScript/Guide/Working_with_Objects#Using_Object_Initializers" title="/bn-BD/docs/JavaScript/Guide/Working_with_Objects#Using_Object_Initializers">কিভাবে অবজেক্ট ইনিশিয়ালাইজার ব্যবহার করা যায়।</a></p> - -<p>যদি টপ-লেভেল কোডে (মানে ফাংশনের বাইরের কোডে) array তৈরি করা হয়, যেই এক্সপ্রেশনে array লিটারেলটি আছে - সেই এক্সপ্রেশনটি যতবার execute করা হবে ততবার-ই array টি ইন্টারপ্রেট (নতুন করে তৈরি) করা হবে। এছাড়া কোন ফাংশনের ভেতর array লিটারেল ব্যবহার করলে যতবার ফাংশনটি কল করবেন ততবার লিটারেলটি তৈরি করা হবে।</p> - -<p>Array লিটারেল <code>Array</code> অবজেক্ট-ও বটে। পড়ুন <a href="/bn-BD/docs/JavaScript/Guide/Predefined_Core_Objects#Array_Object" title="/bn-BD/docs/JavaScript/Guide/Predefined_Core_Objects#Array_Object">বিস্তারিত</a>।</p> - -<h4 id="Array_লিটারেলে_বাড়তি_কমা'র_ব্যবহার">Array লিটারেলে বাড়তি কমা'র ব্যবহার</h4> - -<p>Array লিটারেলে যে সব সদস্য দিতেই হবে এমন কথা নাই - যদি কোন row তে পরপর দুইটা কমা ব্যবহার করেন তাহলে কমা দুটোর মাঝের সদস্যটি <code>undefined</code> হিসেবে থাকে। নিচের উদাহরণে <code>fish</code> array তৈরি করা হয়েছে এভাবেঃ</p> - -<pre class="brush: js">var fish = ["Lion", , "Angel"]; -</pre> - -<p>এই array তে দুটো সদস্যের মান আছে আর একটির ভ্যালু নাই। (<code>fish[0] </code>হচ্ছে "Lion", <code>fish[1]</code> হচ্ছে <code>undefined</code>, আর <code>fish[2]</code> হচ্ছে "Angel")।</p> - -<p>সদস্যের লিস্টের শেষে যদি কমা দিয়ে রাখেন সেটি অগ্রাহ্য করা হবে। নিচের উদাহরণে array এর length তিন। <code>myList[3]</code> বলে কোন সদস্য নেই। শেষের এই অতরিক্ত কমা ছাড়া বাকি সব কমা-ই নতুন সদস্য নির্দেশ করে। (<strong>খেয়াল করুনঃ</strong> পুরোনো ব্রাউজারে শেষের অতিরিক্ত কমা ত্রুটি তৈরি করতে পারে তাই লিস্টের শেষে বাড়তি কমা না দেওয়াই ভাল।)</p> - -<pre class="brush: js">var myList = ['home', , 'school', ]; -</pre> - -<p>নিচের উদাহরণে array এর length চার। <code>myList[0]</code> আর <code>myList[2]</code> অসংজ্ঞায়িত।</p> - -<pre class="brush: js">var myList = [ , 'home', , 'school']; -</pre> - -<p>নিচের উদাহরণে array এর length চার। <code>myList[1]</code> আর <code>myList[3]</code> অসংজ্ঞায়িত।<code> শুধুমাত্র শেষের কমা অগ্রাহ্য করা হয়েছেঃ</code></p> - -<pre class="brush: js">var myList = ['home', , 'school', , ]; -</pre> - -<p>অতিরিক্ত কমা'র ব্যবহারে ফলাফল কী আসে সেটা ঠিকমত বুঝতে পারাটা গুরুত্বপূর্ণ। নিজে কোড লেখার সময় array'র যে সদস্যগুলোর মান দিতে চান না, সরাসরি <code>undefined</code> মান বসিয়ে দিলে আপনার কোড সহজেই বুঝা যাবে আর ভবিষ্যতে কাজ করাও সহজ হবে।</p> - -<h3 id="বুলিয়ান_লিটারেল">বুলিয়ান লিটারেল</h3> - -<p>বুলিয়ান টাইপের দু'ধরণের লিটারেল আছেঃ <code>true</code> আর <code>false</code>।</p> - -<p>প্রিমিটিভ (যেগুলো অবজেক্ট না) <code>true</code> আর <code>false</code> বুলিয়ান ভ্যালু কে Boolean অবজেক্টের true আর false ভ্যালুর সাথে গুলিয়ে ফেলবেন না - এটি প্রিমিটিভ ভ্যালুগুলোর wrapper হিসেবেই কাজ করে। আরো তথ্যের জন্য <a href="/bn-BD/docs/JavaScript/Guide/Predefined_Core_Objects#Boolean_Object" title="/bn-BD/docs/JavaScript/Guide/Predefined_Core_Objects#Boolean_Object">বুলিয়ান অবজেক্ট</a> নিয়ে পড়ুন।</p> - -<h3 id="Integers">Integers</h3> - -<p>Integers (পূর্ণ সংখ্যা) কে ১০ (দশমিক), ১৬ (হেক্সাডেসিমাল) বা ৮(অক্টাল) এর ভিত্তিতে (base) প্রকাশ করা যায়।</p> - -<ul> - <li>দশমিক পূর্ণ সংখ্যার লিটারেল হচ্ছে এক বা একাধিক সংখ্যার ক্রম যার শুরুতে শূণ্য থাকতে পারবে না।</li> - <li>শুরুতে শূণ্য সহ এক বা একাধিক সংখ্যার ক্রম ব্যবহার করলে সেটি অক্টাল বলে গণ্য হয়। অক্টাল ভিত্তিতে শুধুমাত্র ০-৭ এই কয়টি ডিজিট ব্যবহার করা যায়।</li> - <li>শুরুতে 0x (অথবা 0X) সহ এক বা একাধিক সংখ্যার ক্রম ব্যবহার করলে সেটি হেক্সাডেসিমাল বলে গণ্য হয়। এই ভিত্তিতে 0-9 এই কয়টি ডিজিট ছাড়াও a-f বা A - F এই অক্ষরগুলো ব্যবহার করা যায়।</li> -</ul> - -<p>অক্টাল লিটেরেল ব্যবহার নিরুতসাহিত আর ECMA-262 ৩য় সংস্করণে বাদ দিয়ে দেওয়া হয়েছে। অবশ্য পুরনো কোড যাতে চলতে পারে সেহেতু জাভাস্ক্রিপ্ট ১.৫ এ এখনো অক্টাল সমর্থন করে।</p> - -<p>Integer লিটেরেলের কিছু ব্যবহারঃ</p> - -<pre class="eval">0, 117 and -345 (দশমিক, base 10) -015, 0001 and -077 (অক্টাল, base 8) -0x1123, 0x00111 and -0xF1A7 (হেক্সাডেসিমাল, "hex" or base 16) -</pre> - -<h3 id="ভগ্নাংশের_লিটারেল">ভগ্নাংশের লিটারেল</h3> - -<p>ভগ্নাংশে নিচের বিষয়গুলো থাকেঃ</p> - -<ul> - <li>চিহ্ন (sign) সহ/ছাড়া দশমিক ভিত্তির পূর্ণ সংখ্যা (শুরুতে ''+'' অথবা ''- '' চিহ্ন থাকতে পারে)</li> - <li>একটা দশমিক ফোটা ("."),</li> - <li>দশমিক ফোটার পরের অংশ (যেটা কিনা ১০-ভিত্তির পূর্ণ সংখ্যা),</li> - <li>এক্সপোনেন্ট (exponent)</li> -</ul> - -<p>Exponent অংশ "e" অথবা "E" দিয়ে শুরু হয় আর এর পর থাকে ১০-ভিত্তির পূর্ণসংখ্যা, যেটার শুরুতে আবার + অথবা - চিহ্ন থাকতে পারে নাও পারে। একটা ভগ্নাংশ লিটেরেলে কমপক্ষে একটি ডিজিট (সংখ্যা) এবং হয় দশমিক ফোটা অথবা "e" (অথবা "E") থাকতে হবে।</p> - -<p>ভগ্নাংশ লিটেরেলের কিছু উদাহরণ হলঃ 3.1415, -3.1E12, .1e12, আর 2E-12।</p> - -<p>পরিষ্কার করে বলতে গেলে, সিন্ট্যাক্স হচ্ছেঃ</p> - -<pre class="eval">[digits][.digits][(E|e)[(+|-)]digits] -</pre> - -<p>যেমনঃ</p> - -<pre class="eval">3.14 -2345.789 -.3333333333333333333 -</pre> - -<h3 id="অবজেক্ট_লিটেরেল">অবজেক্ট লিটেরেল</h3> - -<p>দ্বিতীয় বন্ধনীর ({}) ভেতর শূণ্য/এক/একাধিক নাম-ভ্যালু যুগল (name-value pairs) লিখে অবজেক্ট লিটেরেল তৈরি করা যায়। তবে কোন স্টেটমেন্টের শুরুতেই অবজেক্ট লিটেরেল ব্যবহার করা যায় না। এমনটা করলে ত্রুটি তৈরি হবে অথবা আপনি যেমনটা আশা করছিলেন সেরকম ফল পাবেন না - কারণ শুরুতেই { দেখে জাভাস্ক্রিপ্ট মনে করতে পারে আপনি ব্লক শুরু করছেন।</p> - -<p>নিচের উদাহরণে অবজেক্ট লিটেরেল দেখানো হয়েছে। <code>car</code> অবজেক্টের প্রথম সদস্য <code>myCar</code> নামের একটি প্রোপার্টি; দ্বিতীয় সদস্য <code>getCar</code> একটি ফাংশন <code>(CarTypes("Honda"));</code> ইনভোক করে, আর তৃতীয় সদস্য <code>special</code> ইতোমধ্যে তৈরি করা একটা ভ্যারিয়েবল ব্যবহার করে (<code>Sales</code>)।</p> - -<pre class="brush: js">var Sales = "Toyota"; - -function CarTypes(name) { - return (name == "Honda") ? - name : - "Sorry, we don't sell " + name + "." ; -} - -var car = { myCar: "Saturn", getCar: CarTypes("Honda"), special: Sales }; - -console.log(car.myCar); // Saturn -console.log(car.getCar); // Honda -console.log(car.special); // Toyota -</pre> - -<p>এছাড়াও, কোন প্রোপার্টির নাম হিসেবে সংখ্যা কিংবা স্ট্রিং লিটেরেল ব্যবহার করতে পারেন অথবা এক অবজেক্টের ভেতর আরেকটিকে নেস্ট করতে পারেন। নিচের উদাহরণে দেখুনঃ</p> - -<pre class="brush: js">var car = { manyCars: {a: "Saab", "b": "Jeep"}, 7: "Mazda" }; - -console.log(car.manyCars.b); // Jeep -console.log(car[7]); // Mazda -</pre> - -<p>দয়া করে খেয়াল করুনঃ</p> - -<pre class="brush: js">var foo = {a: "alpha", 2: "two"}; -console.log(foo.a); // alpha -console.log(foo[2]); // two -//console.log(foo.2); // Error: missing ) after argument list -//console.log(foo[a]); // Error: a is not defined -console.log(foo["a"]); // alpha -console.log(foo["2"]); // two -</pre> - -<h3 id="স্ট্রিং_লিটেরেল">স্ট্রিং লিটেরেল</h3> - -<p>স্ট্রিং লিটেরেল তৈরি হয় শূণ্য বা এর থেকে বেশি ক্যারেকটার ডবল-কোটেশন (") বা উদ্ধৃতি চিহ্ন বা single quotation (') চিহ্ন এর মধ্যে রাখলে। তবে double বা single যেই উদ্ধৃতি চিহ্ন-ই ব্যবহার করুন না কেন স্ট্রিং লিটেরেলের শুরুতে আর শেষে একই প্রকারের চিহ্ন ব্যবহার করতে হবে। নিচে কিছু স্ট্রিং লিটেরেলের উদাহরণ দেখুনঃ</p> - -<ul> - <li><code>"foo"</code></li> - <li><code>'bar'</code></li> - <li><code>"1234"</code></li> - <li><code>"one line \n another line"</code></li> - <li><code>"John's cat"</code></li> -</ul> - -<p>স্ট্রিং লিটেরেলে আপনি স্ট্রিং অবজেক্টের যেকোন ফাংশন কল করতে পারবেন - জাভাস্ক্রিপ্ট স্বয়ংক্রিয়ভাবে স্ট্রিং লিটেরেল কে অস্থায়ী অবজেক্টে কনভার্ট করে, এরপর মেথডটি কল করে, তারপর অস্থায়ী অবজেক্টটি ফেলে দেয়। আপনি <code>String.length </code>প্রোপার্টি ব্যবহার করতে পারেন স্ট্রিং লিটেরেলের ওপরঃ</p> - -<pre class="brush: js">"John's cat".length -</pre> - -<p>স্ট্রিং অবজেক্ট ব্যবহারেরে বিশেষ কোন কারণ না থাকলে আপনার উচিত হবে স্ট্রিং লিটেরেল-ই ব্যবহার করা। বিস্তারিত দেখুনঃ <a href="/en-US/docs/JavaScript/Guide/Predefined_Core_Objects#String_Object" title="en-US/docs/JavaScript/Guide/Predefined Core Objects#String Object">String Object</a> ।</p> - -<h4 id="স্ট্রিং_এ_বিশেষ_অক্ষর_ব্যবহার">স্ট্রিং এ বিশেষ অক্ষর ব্যবহার</h4> - -<p>গতানুগতিক অক্ষরের পাশাপাশি বিশেহ অক্ষ্র ও স্ট্রিং এ ব্যবহার করতে পারবেন, যেমনটা দেখানো হয়েছে উদাহরণেঃ</p> - -<pre class="brush: js">"one line \n another line" -</pre> - -<p>নিচের টেবিলে জাভাস্ক্রিপ্টের বিশেষ অক্ষরগুলো যেগুলো স্ট্রিং এ ব্যবহার করতে পারবেন সেগুলো দেখানো হয়েছেঃ</p> - -<table class="standard-table"> - <caption>টেবিল ২.১ জাভাস্ক্রিপ্টের বিশেষ অক্ষর</caption> - <thead> - <tr> - <th scope="col">অক্ষর</th> - <th scope="col">অর্থ</th> - </tr> - </thead> - <tbody> - <tr> - <td><code>\b</code></td> - <td>Backspace</td> - </tr> - <tr> - <td><code>\f</code></td> - <td>Form feed</td> - </tr> - <tr> - <td><code>\n</code></td> - <td>নতুন লাইন</td> - </tr> - <tr> - <td><code>\r</code></td> - <td>Carriage return</td> - </tr> - <tr> - <td><code>\t</code></td> - <td>Tab</td> - </tr> - <tr> - <td><code>\v</code></td> - <td>Vertical tab</td> - </tr> - <tr> - <td><code>\'</code></td> - <td>ঊর্ধকমা or single quote</td> - </tr> - <tr> - <td><code>\"</code></td> - <td>Double quote</td> - </tr> - <tr> - <td><code>\\</code></td> - <td>Backslash character (\).</td> - </tr> - <tr> - <td><code>\<em>XXX</em></code></td> - <td>Latin-1 এনকোডিং সহ অক্ষরটি 0 এবং 377 এর মধ্যে তিনটি অক্টাল সংখ্যা দ্বারা XXX নির্দিষ্ট করা হয়েছে। উদাহরণস্বরূপ, \251 হল কপিরাইট প্রতীকের অকটাল ক্রম।</td> - </tr> - <tr> - <td><code>\x<em>XX</em></code></td> - <td>Latin-1 এনকোডিং সহ অক্ষরটি 00 এবং FF এর মধ্যকার সংখ্যাগুলি দ্বারা XXX নির্দিষ্ট করা হয়েছে। উদাহরণস্বরূপ, \xA9 হল কপিরাইট প্রতীকের হেক্সাডেসিমেল ক্রম।</td> - </tr> - <tr> - <td><code>\u<em>XXXX</em></code></td> - <td>ইউনিকোড অক্ষর চারটি হেক্সাডেসিমেল সংখ্যা দ্বারা XXXX নির্দিষ্ট করা হয়। উদাহরণস্বরূপ, \u00A9 হল কপিরাইট প্রতীকের ইউনিকোড ক্রম। {{anch("Unicode escape sequences")}} এ দেখুন.</td> - </tr> - </tbody> -</table> - -<h4 id="অক্ষর_এস্কেপ_(escape)_করা">অক্ষর এস্কেপ (escape) করা</h4> - -<p>যেই অক্ষরগুলো টেবিল ২.১ এ দেখানো হয়নি সেগুলোর সামনের ব্যাক-স্ল্যাশ অগ্রাহ্য করা হয়। কিন্তু এই ব্যবহার নিরুতসাহিত করা হয় এবং করাও উচিত নয়।</p> - -<p>স্ট্রিং এর মধ্যে উদ্ধৃতি চিহ্ন দিতে পারেন এটির সামনে ব্যাক-স্ল্যাশ ব্যবহার করে। এটি-ই <em>এসকেপ</em> করা (উদ্ধৃতি চিহ্ন কে) হিসেবে পরিচিত। যেমনঃ</p> - -<pre class="brush: js">var quote = "He read \"The Cremation of Sam McGee\" by R.W. Service."; -console.log(quote); -</pre> - -<p>এর ফলাফল হবে এমনঃ</p> - -<pre class="eval">He read "The Cremation of Sam McGee" by R.W. Service. -</pre> - -<p>অবশ্য স্ট্রিং এ ব্যাক-স্ল্যাশ ব্যবহার করতে একেও এসকেপ করতে হবে! যেমন, স্ট্রিং এ <code>c:\temp</code> মান ব্যবহার করতে চাইলেঃ</p> - -<pre class="brush: js">var home = "c:\\temp"; -</pre> - -<p>লাইন-বিরতি এসকেপ করতে পারেন সেগুলোর আগে ব্যাক-স্ল্যাশ ব্যবহার করে। ব্যাক-স্ল্যাশ আর লাইন-বিরতি (কীবোর্ডের এন্টার চেপে লাইন বিরতি দেওয়া যায়) দুটোই স্ট্রিং এর মান থেকে সরিয়ে নেওয়া হবেঃ</p> - -<pre class="brush: js">var str = "this string \ -is broken \ -across multiple\ -lines." -<span class="objectBox objectBox-text">console.log(str);</span> // <span class="objectBox objectBox-text">this string is broken across multiplelines.</span> -</pre> - -<p>যদিও জাভাস্ক্রিপ্টে "heredoc" সিন্ট্যাক্স নেই, আপনি কাছাকাছি কিছু একটা পেতে পারেন লাইন-বিরতি এসকেপ ব্যবহার করে আর এসকেপ করা লাইনব্রেক প্রতি লাইনের শেষে দিয়েঃ</p> - -<pre class="brush: js">var poem = -"Roses are red,\n\ -Violets are blue.\n\ -I'm schizophrenic,\n\ -And so am I." -</pre> - -<h2 id="ইউনিকোড">ইউনিকোড</h2> - -<p>ইউনিকোড হচ্ছে বিশ্বব্যাপী স্বীকৃত ক্যারেকটার-কোডিং স্ট্যান্ডার্ড, কোন ভাষা (যেমনঃ বাংলা) লেখার জন্য ব্যবহৃত হয়। আমেরিকা, ইউরোপ, মধ্যপ্রাচ্য, আফ্রিকা, ভারত, এশিয়া, প্যাসিফিকা সব অঞ্চলের ভাষার-ই সাপোর্ট আছে ইউনিকোডে। শুধু তাই নয় ঐতিহাসিক পাণ্ডুলিপি আর টেকনিক্যাল সিম্বল দেওয়ার ও ব্যবস্থা আছে। পৃথিবীর বিভিন্ন ভাষায় লেখালেখির আদান-প্রদান, প্রসেস করা, উপ্সথাপন করা সবকিছুই ইউনিকোড দিয়ে করা যায় (যেমনটা আপনারা এখন এই লেখাটা বাংলায় পড়তে পারছেন ইউনিকোড এর জন্য-ই!)। এছাড়া সাধারণ গাণিতিক আর টেকনিকাল চিহ্ন-ও দেওয়া যায়। বহুভাষায় কম্পিউটিং করার যে আন্তর্জাতিক সমস্যা ছিল, ইউনিকোড তার সমাধান করেছে। অবশ্য নতুন কিছু ভাষা বা প্রাগৈতিহাসিক পাণ্ডুলিপির জন্য সাপোর্ট নাও পেতে পারেন।</p> - -<p>সব এনকোডিং এর জন্যে-ই ইউনিকোড বর্ণমালা ব্যবহার করা যায়। ASCII (American Standard Code for Information Interchange) বর্ণমালার ওপর ভিত্তি করে ইউনিকোড মডেল করা হয়েছে। প্রত্যেকটি হরফের জন্য এটি একটি সংখ্যা আর নাম ব্যবহার করে। এই সংখ্যাটি'র বিট রিপ্রেজেন্টেশন ও ক্যারেক্টার এনকোডিং এ বলা থাকে। ১৬-বিটের সংখ্যাটি হেক্সাডেসিমালে প্রকাশ করা হয়, আর এর সামনে থাকে U অক্ষরটি। যেমন, U+0041 দিয়ে A বুঝানো হয়। আর এই অক্ষরটির অনন্য নাম হল LATIN CAPITAL LETTER A।</p> - -<p><strong>জাভাস্ক্রিপ্টের ১.৩ এর আগের ভার্সনে ইউনিকোড সাপোর্ট নেই।</strong></p> - -<h3 id="ASCII_এবং_ISO_এর_সাথে_ইউনিকোড_কম্প্যাটিবিলিটি">ASCII এবং ISO এর সাথে ইউনিকোড কম্প্যাটিবিলিটি</h3> - -<p>ইউনিকোড আন্তর্জাতিক স্ট্যান্ডার্ড ISO/IEC 10646-1; 1993 দ্বারা সম্পূর্ণভাবে সমর্থিত, যেটা কিনা ISO 10646 এর অংশ।</p> - -<p>বেশকিছু ইউনিকোড স্ট্যান্ডার্ড (UTF-8, UTF-16 এবং ISO UCS-2 সহ) ব্যবহার করা হয় ইউনিকোড কে বিট হিসেবে দেখানোর জন্য। (মানে ব্যবহারিক প্রয়োগের জন্য!)</p> - -<p>ইউনিকোডের UTF-8 এনকোডিং ASCII বর্ণমালার সাথে সমর্থিত আর অনেক প্রোগ্রামেই একে ব্যবহার করা হয়। প্রথম ১২৮ টি ইউনিকোড অক্ষর দিয়ে ASCII অক্ষরগুলোকে প্রকাশ করা হয়, আর এগুলোর বাইট-মান ও একই (ASCII তে যেই মান ছিল) রাখা হয়েছে। U+0020 থেকে শুরু করে U+007E পর্যন্ত ইউনিকোড অক্ষরগুলো 0x20 থেকে 0x7E পর্যন্ত ASCII অক্ষরগুলোকে নির্দেশ করে। ASCII এর সাথে পার্থক্য হল ASCII ল্যাটিন বর্ণমালা সমর্থন করে (আর ৭ বিটের ক্যারেক্টার সেট দিয়ে তৈরি), যেখানে UTF-8 ১ থেকে ৪ টি অক্টেট ("অক্টেট" মানে হল ৮ বিট, বা ১ বাইট) দিয়ে প্রতিটি অক্ষর নির্দেশ করে। তাই, কয়েক মিলিয়ন অক্ষর UTF-8 দিয়ে দেখানো সম্ভব। আরো একটি বিকল্প এনকোডিং স্ট্যান্ডার্ড হল UTF-16 যেখানে প্রতিটি অক্ষর এর জন্য ২টি করে অক্টেট ব্যবহার করা হয়। এসকেপ সিকোয়েন্স ব্যবহার করে UTF-16 দিয়ে ইউনিকোড রেঞ্জে যত অক্ষর আছে সবগুলো দেখানো যায়, ৪টি অক্টেট ব্যবহার করে। ISO UCS-2 (Universal Character Set) দু'টি অক্টেট ব্যবহার করে।</p> - -<p>UTF-8/ইউনিকোডের জন্য জাভাস্ক্রিপ্ট আর নেভিগেটরের সাপোর্ট থাকার ফলাফল স্বরূপ আপনি ল্যাটিন নয়-এমন, আন্তর্জাতিক আর এলাকাভিত্তিক, আপনার নিজের ভাষার বর্ণমালা ব্যবহার করতে পারছেন, আরো পারছেন বিশেষ সব টেকনিকাল হরফ ব্যবহার করতে। বহুভাষায় ভাব প্রকাশ সমর্থন করার জন্য ইউনিকোড একটি স্ট্যান্ডার্ড পদ্ধতি। যেহেতু ইউনিকোডের UTF-8 এনকোডিং ASCII সমর্থন করে, প্রোগ্রামগুলো ASCII বর্ণমালাও ব্যবহার করতে পারে ইউনিকোডের পাশাপাশি, আর ASCII নয় এমন বর্ণমালা (যেমন, বাংলা!) ও ব্যবহার করতে পারেন জাভাস্ক্রিপ্টের কমেন্টে, স্ট্রিং লিটেরেলে, ভ্যারিয়েবলের আইডেন্টিফায়ারে, রেগুলার এক্সপ্রেশনে।</p> - -<h3 id="ইউনিকোড_এসকেপ_সিকোয়েন্স">ইউনিকোড এসকেপ সিকোয়েন্স</h3> - -<p>আপনি স্ট্রিং লিটেরেল, রেগুলার এক্সপ্রেশন আর ভ্যারিয়েবলের আইডেন্টিফায়ারে ইউনিকোড এসকেপ সিকোয়েন্স ব্যবহার করতে পারেন। এসকেপ সিকোয়েন্সে ৬টি ASCII অক্ষর থাকেঃ \u আর ৪-ডিজিটের হেক্সাডেসিমেল সংখ্যা। যেমনঃ \u00A9 দিয়ে কপিরাইট চিহ্নটিকে প্রকাশ করা হয়। আর বুঝতেই পারছেন, প্রতিটি এসকেপ সিকোয়েন্স দিয়ে ১টি মাত্র অক্ষর প্রকাশ করা হয়।</p> - -<p>নিচের কোডে দেখিয়েছি কিভাবে কপিরাইট চিহ্ন আর "Netscape Communications" স্ট্রিংটি তৈরি করা হয়েছেঃ</p> - -<pre class="brush: js">var x = "\u00A9 Netscape Communications";</pre> - -<p>নিচের সারণিতে প্রায়-ই ব্যবহার করা হয় এমন কিছু বিশেষ অক্ষর আর তাদের ইউনিকোড ভ্যালু দেওয়া হলঃ</p> - -<table class="standard-table"> - <caption>সারণী ২.২ বিশেষ অক্ষরের ইউনিকোড মান</caption> - <thead> - <tr> - <th scope="col">প্রকৃতি</th> - <th scope="col">ইউনিকোড মান</th> - <th scope="col">নাম</th> - <th scope="col">ফর্ম্যাট</th> - </tr> - </thead> - <tbody> - <tr> - <td rowspan="4">White space values</td> - <td>\u0009</td> - <td>Tab</td> - <td><TAB></td> - </tr> - <tr> - <td>\u000B</td> - <td>Vertical Tab</td> - <td><VT></td> - </tr> - <tr> - <td>\u000C</td> - <td>Form Feed</td> - <td><FF></td> - </tr> - <tr> - <td>\u0020</td> - <td>Space</td> - <td><SP></td> - </tr> - <tr> - <td rowspan="2">Line terminator values</td> - <td>\u000A</td> - <td>Line Feed</td> - <td><LF></td> - </tr> - <tr> - <td>\u000D</td> - <td>Carriage Return</td> - <td><CR></td> - </tr> - <tr> - <td rowspan="5">Additional Unicode escape sequence values</td> - <td>\u0008</td> - <td>Backspace</td> - <td><BS></td> - </tr> - <tr> - <td>\u0009</td> - <td>Horizontal Tab</td> - <td><HT></td> - </tr> - <tr> - <td>\u0022</td> - <td>Double Quote</td> - <td>"</td> - </tr> - <tr> - <td>\u0027</td> - <td>Single Quote</td> - <td>'</td> - </tr> - <tr> - <td>\u005C</td> - <td>Backslash</td> - <td>\</td> - </tr> - </tbody> -</table> - -<p>জাভাস্ক্রিপ্টে ব্যবহৃত এসকেপ সিকোয়েন্স আর জাভাতে এর ব্যবহারের মাঝে পার্থক্য আছে। জাভাস্ক্রিপ্টে কখনোই এস্কেপ সিকোয়েন্স কে বিশেষ কোন অক্ষর হিসেবে ধরা হয় না প্রথমে। যেমন, কোন স্ট্রিং এর ভেতর লাইন-শেষ-করার-জন্য কোন এসকেপ সিকোয়েন্স ব্যবহার করলে সেটি লাইন বিরতি দেয় না, যতক্ষণ না ফাংশন একে ব্যবহার করছে। জাভাস্ক্রিপ্ট কমেন্টে ব্যবহার করা যেকোন এসকেপ সিকোয়েন্স উপেক্ষা করে। যদি কোন এসকেপ সিকোয়েন্স এক-লাইনের কমেন্টে ব্যবহার করা হয়, জাভা একে ইউনিকোড অক্ষর হিসেবে নেয়। স্ট্রিং লিটেরেলের ক্ষেত্রে জাভা কম্পাইলার প্রথমেই এসকেপ সিকোয়েন্সকে ইন্টারপ্রেট করে। যেমন, লাইন-বিরতি এস্কেপ অক্ষর (যেমন \u000A) যদি জাভায় ব্যবহার করেন, স্ট্রিং লিটেরেল টি ঐখানেই শেষ হয়ে যাবে। ফলস্বরূপ ত্রুটি তৈরি হবে কারণ জাভার স্ট্রিং লিটেরেলে লাইন-বিরতি চিহ্ন ব্যবহার করা যায় না। লাইন ফিড দেওয়ার জন্য জাভাতে আপনাকে \n ব্যবহার করতে হবে। জাভাস্ক্রিপ্টে এই \n এর কাজ এসকেপ সিকোয়েন্স দিয়েই করতে পারবেন।</p> - -<h3 id="জাভাস্ক্রিপ্ট_ফাইলে_ইউনিকোড_অক্ষর">জাভাস্ক্রিপ্ট ফাইলে ইউনিকোড অক্ষর</h3> - -<p><a href="/en-US/docs/Gecko" title="en-US/docs/Gecko">Gecko</a> এর পুরোনো ভার্সন ধরে নিত XUL যেই জাভাস্ক্রিপ্ট ফাইল লোড করে, সেগুলো ল্যাটিন-১ ক্যারেক্টার এনকোডিং এ আছে। Gecko ১.৮ আর পরের ভার্সনগুলোতে ফাইলটা যেই এনকোডিং এ থাকবে, সেই এনকোডিং ই ব্যবহার করা হয়। <a href="/en-US/docs/International_characters_in_XUL_JavaScript" title="en-US/docs/International_characters_in_XUL_JavaScript">XUL জাভাস্ক্রিপ্টে আন্তর্জাতিক অক্ষর</a> দেখুন আরো তথ্যের জন্য।</p> - -<h3 id="ইউনিকোড_ব্যবহার_করে_অক্ষর_দেখানো">ইউনিকোড ব্যবহার করে অক্ষর দেখানো</h3> - -<p>বিভিন্ন ভাষার অক্ষর কিংবা টেকনিকাল চিহ্ন দেখানোর জন্য ইউনিকোড ব্যবহার করুন। অক্ষরগুলো ঠিকমত দেখানোর জন্য ক্লায়েন্ট (যেমন মজিলা ফায়ারফক্স বা নেটস্কেপ) এর ইউনিকোড সমর্থন করা প্রয়োজন। এছাড়াও, ক্লায়েন্টের কাছে উপযুক্ত ইউনিকোড ফন্ট থাকাটাও দরকার, আর ক্লায়েন্ট যেই প্ল্যাটফর্মে আছে সেখানেও ইউনিকোড সমর্থন করতে হবে। প্রায়ই দেখা যায় ইউনিকোড ফন্ট যেটি ব্যবহার করা হয়েছে সেটি সব ইউনিকোড অক্ষর দেখায় না। কিছু প্ল্যাটফর্ম, যেমন উইন্ডোজ ৯৫ এ ইউনিকোডের আংশিক সমর্থন রয়েছে।</p> - -<p>ASCII নয় এমন অক্ষর ইনপুট নেওয়ার জন্য ক্লায়েন্টকে ইউনিকোড হিসেবে ইনপুট নিতে হবে। শুধুমাত্র স্ট্যান্ডার্ড কীবোর্ড ব্যবহার করেই ইউনিকোড-সমর্থিত অতিরিক্ত অক্ষরগুলো ইনপুট নেওয়া সম্ভব নয়। মাঝে মাঝে, ইউনিকোড ইনপুট নেওয়ার একমাত্র উপায় হয়ে দাড়ায় ইউনিকোড এসকেপ সিকোয়েন্স ব্যবহার করে।</p> - -<p>ইউনিকোড নিয়ে আরো তথ্যের জন্য দেখুন <a class="external" href="http://www.unicode.org/">Unicode হোমপেইজ</a> আর ইউনিকোড স্ট্যান্ডার্ড, ২.০ সংস্করণ, প্রকাশকঃ Addison-Wesley, 1996।</p> - -<h2 id="তথ্যাদি">তথ্যাদি</h2> - -<ul> - <li><a class="external" href="http://0xcc.net/jsescape/" title="Text Escaping and Unescaping in JavaScript">জাভাস্ক্রিপ্টে লেখা এসকেপ করা আর এসকেপ-না-করা</a> – অক্ষর কে জাভাস্ক্রিপ্ট ইউনিকোড অক্ষরে রূপান্তরের ইউটিলিটি।</li> -</ul> diff --git a/files/bn/web/javascript/guide/index.html b/files/bn/web/javascript/guide/index.html deleted file mode 100644 index 856da74c7a..0000000000 --- a/files/bn/web/javascript/guide/index.html +++ /dev/null @@ -1,123 +0,0 @@ ---- -title: জাভাস্ক্রিপ্ট গাইড -slug: Web/JavaScript/Guide -tags: - - JavaScript - - গাইড - - চ্যাপ্টার - - জাভাস্ক্রিপ্ট - - ভুমিকা -translation_of: Web/JavaScript/Guide ---- -<div>{{jsSidebar("জাভাস্ক্রিপ্ট গাইড")}}</div> - -<p class="summary">এই জাভাস্ক্রিপ্ট গাইডটি আপনাকে দেখাবে যে কিভাবে <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript">জাভাস্ক্রিপ্ট</a> ব্যবহার করতে হয় এবং এই ল্যাঙ্গুয়েজ টি সম্পর্কে একটি ওভারভিউ প্রদান করবে। আপনি যদি আরও বেশি জানতে আগ্রহী হয়ে থাকেন, তাহলে দয়া করে <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript">জাভাস্ক্রিপ্ট রেফেরেন্স</a> লিঙ্কটিতে প্রবেশ করুন।</p> - -<ul class="card-grid"> - <li><span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Introduction">ভূমিকাঃ</a></span> - - <p><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Introduction#Where_to_find_JavaScript_information">এই গাইড সম্পর্কে কিছু কথা</a><br> - <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Introduction#What_is_JavaScript">জাভাস্ক্রিপ্ট সম্পর্কে কিছু কথা</a><br> - <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Introduction#JavaScript_and_Java">জাভা ও জাভাস্ক্রিপ্ট</a><br> - <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Introduction#JavaScript_and_the_ECMAScript_Specification">(ইকমাস্ক্রিপ্ট) ECMAScript</a><br> - <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Introduction#Getting_started_with_JavaScript">টুল সমুহ</a><br> - <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Introduction#Hello_world">প্রথম জাভাস্ক্রিপ্ট প্রোগ্রামঃ Hello World</a></p> - </li> - <li><span><a href="/bn-BD/docs/Web/JavaScript/Guide/Grammar_and_types">Grammar and types</a></span> - <p><a href="/bn-BD/docs/Web/JavaScript/Guide/Grammar_and_types#Basics">Basic syntax & comments</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Grammar_and_types#Declarations">Declarations</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Grammar_and_types#Variable_scope">Variable scope</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Grammar_and_types#Variable_hoisting">Variable hoisting</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Grammar_and_types#Data_structures_and_types">Data structures and types</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Grammar_and_types#Literals">Literals</a></p> - </li> - <li><span><a href="/bn-BD/docs/Web/JavaScript/Guide/Control_flow_and_error_handling">Control flow and error handling</a></span> - <p><code><a href="/bn-BD/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#if...else_statement">if...else</a></code><br> - <code><a href="/bn-BD/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#switch_statement">switch</a></code><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#Exception_handling_statements"><code>try</code>/<code>catch</code>/<code>throw</code></a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#Utilizing_Error_objects">Error objects</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Control_flow_and_error_handling#Promises">Promises</a></p> - </li> - <li><span><a href="/bn-BD/docs/Web/JavaScript/Guide/Loops_and_iteration">Loops and iteration</a></span> - <p><code><a href="/bn-BD/docs/Web/JavaScript/Guide/Loops_and_iteration#for_statement">for</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Loops_and_iteration#while_statement">while</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Loops_and_iteration#do...while_statement">do...while</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Loops_and_iteration#break_statement">break</a>/<a href="/bn-BD/docs/Web/JavaScript/Guide/Loops_and_iteration#continue_statement">continue</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Loops_and_iteration#for...in_statement">for..in</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Loops_and_iteration#for...of_statement">for..of</a></code></p> - </li> -</ul> - -<ul class="card-grid"> - <li><span><a href="/bn-BD/docs/Web/JavaScript/Guide/Functions">ফাংশন</a></span> - - <p><a href="/bn-BD/docs/Web/JavaScript/Guide/Functions#Defining_functions">Defining functions</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Functions#Calling_functions">Calling functions</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Functions#Function_scope">Function scope</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Functions#Closures">Closures</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Functions#Using_the_arguments_object">Arguments</a> & <a href="/bn-BD/docs/Web/JavaScript/Guide/Functions#Function_parameters">parameters</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Functions#Arrow_functions">Arrow functions</a></p> - </li> - <li><span><a href="/bn-BD/docs/Web/JavaScript/Guide/Expressions_and_Operators">এক্সপ্রেশন এবং অপারেটর</a></span> - <p><a href="/bn-BD/docs/Web/JavaScript/Guide/Expressions_and_Operators#Assignment_operators">Assignment</a> & <a href="/bn-BD/docs/Web/JavaScript/Guide/Expressions_and_Operators#Comparison_operators">Comparisons</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Expressions_and_Operators#Arithmetic_operators">Arithmetic operators</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Expressions_and_Operators#Bitwise_operators">Bitwise</a> & <a href="/bn-BD/docs/Web/JavaScript/Guide/Expressions_and_Operators#Logical_operators">logical operators</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Expressions_and_Operators#Conditional_(ternary)_operator">Conditional (ternary) operator</a></p> - </li> - <li><span><a href="/bn-BD/docs/Web/JavaScript/Guide/Numbers_and_dates">Numbers and dates</a></span><a href="/bn-BD/docs/Web/JavaScript/Guide/Numbers_and_dates#Numbers"> Number literals</a> - <p><a href="/bn-BD/docs/Web/JavaScript/Guide/Numbers_and_dates#Number_object"><code>Number</code> object</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Numbers_and_dates#Math_object"><code>Math</code> object</a><br> - <a href="https://developer.mozilla.org/bn-BD/docs/Web/JavaScript/Guide/Numbers_and_dates#Date_object"><code>Date</code> object</a></p> - </li> - <li><span><a href="/bn-BD/docs/Web/JavaScript/Guide/Text_formatting">Text formatting</a></span> - <p><a href="/bn-BD/docs/Web/JavaScript/Guide/Text_formatting#String_literals">String literals</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Text_formatting#String_objects"><code>String</code> object</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Text_formatting#Multi-line_template_strings">Template strings</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Text_formatting#Internationalization">Internationalization</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Regular_Expressions">রেগুলার এক্সপ্রেশন</a></p> - </li> -</ul> - -<ul class="card-grid"> - <li><span><a href="/bn-BD/docs/Web/JavaScript/Guide/Indexed_collections">Indexed collections</a></span> - - <p><a href="/bn-BD/docs/Web/JavaScript/Guide/Indexed_collections#Array_object">Arrays</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Indexed_collections#Array_comprehensions">Array comprehensions</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Indexed_collections#Typed_Arrays">Typed arrays</a></p> - </li> - <li><span><a href="/bn-BD/docs/Web/JavaScript/Guide/Keyed_collections">Keyed collections</a></span> - <p><code><a href="/bn-BD/docs/Web/JavaScript/Guide/Keyed_collections#Map_object">Map</a></code><br> - <code><a href="/bn-BD/docs/Web/JavaScript/Guide/Keyed_collections#WeakMap_object">WeakMap</a></code><br> - <code><a href="/bn-BD/docs/Web/JavaScript/Guide/Keyed_collections#Set_object">Set</a></code><br> - <code><a href="/bn-BD/docs/Web/JavaScript/Guide/Keyed_collections#WeakSet_object">WeakSet</a></code></p> - </li> - <li><span><a href="/bn-BD/docs/Web/JavaScript/Guide/Working_with_Objects">Working with objects</a></span> - <p><a href="/bn-BD/docs/Web/JavaScript/Guide/Working_with_Objects#Objects_and_properties">Objects and properties</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Working_with_Objects#Creating_new_objects">Creating objects</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_methods">Defining methods</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters">Getter and setter</a></p> - </li> - <li><span><a href="/bn-BD/docs/Web/JavaScript/Guide/Details_of_the_Object_Model">Details of the object model</a></span> - <p><a href="/bn-BD/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Class-based_vs._prototype-based_languages">Prototype-based OOP</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Creating_the_hierarchy">Creating object hierarchies</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Property_inheritance_revisited">Inheritance</a></p> - </li> -</ul> - -<ul class="card-grid"> - <li><span><a href="/bn-BD/docs/Web/JavaScript/Guide/Iterators_and_Generators">Iterators and generators</a></span> - - <p><a href="/bn-BD/docs/Web/JavaScript/Guide/Iterators_and_Generators#Iterators">Iterators</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Iterators_and_Generators#Iterables">Iterables</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Iterators_and_Generators#Generators">Generators</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Iterators_and_Generators#Generator_comprehensions">Generator comprehensions</a></p> - </li> - <li><span><a href="/bn-BD/docs/Web/JavaScript/Guide/Meta_programming">Meta programming</a></span> - <p><code><a href="/bn-BD/docs/Web/JavaScript/Guide/Meta_programming#Proxies">Proxy</a></code><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Meta_programming#Handlers_and_traps">Handlers and traps</a><br> - <a href="/bn-BD/docs/Web/JavaScript/Guide/Meta_programming#Revocable_Proxy">Revocable Proxy</a><br> - <code><a href="/bn-BD/docs/Web/JavaScript/Guide/Meta_programming#Reflection">Reflect</a></code></p> - </li> -</ul> - -<p>{{Next("Web/JavaScript/Guide/Introduction")}}</p> diff --git a/files/bn/web/javascript/index.html b/files/bn/web/javascript/index.html deleted file mode 100644 index 11f2a43a50..0000000000 --- a/files/bn/web/javascript/index.html +++ /dev/null @@ -1,130 +0,0 @@ ---- -title: জাভাস্ক্রিপ্ট -slug: Web/JavaScript -tags: - - জাভা স্ক্রিপ্ট - - জাভাস্ক্রিপ্ট -translation_of: Web/JavaScript ---- -<div>{{JsSidebar}}</div> - -<p class="summary"><strong>JavaScript</strong> (সংক্ষেপে <strong>JS</strong>) একটি lightweight ইন্টারপ্রেটেড বা যথাসময়ে কম্পাইল করা প্রোগ্রামিং ভাষা যাতে রয়েছে {{Glossary("First-class Function", "first-class functions")}}। যদিও এটি ওয়েব পেজের স্ক্রিপ্টিং ভাষা হিসেবে বেশি পরিচিত, এছাড়া <a class="external" href="https://en.wikipedia.org/wiki/JavaScript#Uses_outside_Web_pages">ব্রাউজার ছাড়াও অন্যান্য জায়গায়</a> ব্যবহার করা হয়, যেমন <a class="external" href="https://nodejs.org/">node.js</a> and <a href="https://couchdb.apache.org/">Apache CouchDB</a>. JavaScript হল {{Glossary("Prototype-based programming", "prototype-based")}}, multi-paradigm, dynamic scripting language, supporting object-oriented, imperative, and declarative (e.g. functional programming) styles. <a href="/en-US/docs/Web/JavaScript/About_JavaScript">JavaScript সম্পর্কে</a> আরো পড়ুন.</p> - -<p>সাইটের এই সেকশনটি JavaScript ভাষার জন্য নিবেদিত, এবং ওয়েব পেইজ অথবা হোস্ট এনভাইরনমেন্টের সাথে সম্পৃক্ত নয়। {{Glossary("API","APIs")}} সম্পর্কে জানতে <a href="https://developer.mozilla.org/en-US/docs/Web/API">Web APIs</a> এবং <a href="https://developer.mozilla.org/en-US/docs/Glossary/DOM">DOM</a> দেখুন।</p> - -<p>JavaScript স্ট্যান্ডার্ড এর নাম <a href="/bn-BD/docs/JavaScript/%E0%A6%AD%E0%A6%BE%E0%A6%B7%E0%A6%BE%E0%A6%B0_%E0%A6%B0%E0%A6%BF%E0%A6%B8%E0%A7%8B%E0%A6%B0%E0%A7%8D%E0%A6%B8" title="ECMAScript">ECMAScript</a>। ২০১২ সাল পর্যন্ত পাওয়া তথ্য অনুযায়ী সব <a href="https://kangax.github.io/compat-table/es5/">নতুন ব্রাউজার</a> ECMAScript 5.1 সমর্থন করে। পুরোনো ব্রাউজারগুলো অন্তত ECMAScript 3 সমর্থন করে। ২০১৫ সালের ১৭ জুন <a href="http://www.ecma-international.org">ECMA International</a> তার ষষ্ঠ প্রধান সংস্করণ প্রকাশ করে, আনুষ্ঠানিক ভাবে যা ECMAScript 2015 নামে অভিহিত, এবং সাধারন ভাবে এটি ECMAScript 6 বা ES6 নামে পরিচিত। তখন থেকেই বাৎসরিক প্রকাশ চক্র অনুযায়ী ECMAScript -এর মান প্রকাশিত হচ্ছে। এই ডকুমেন্টেশনটি সর্বশেষ খসড়া সংস্করণ, যা <a href="https://tc39.github.io/ecma262/">ECMAScript 2018</a> কে বোঝায়।</p> - -<p> JavaScript এর সাথে <a href="https://en.wikipedia.org/wiki/Java_%28programming_language%29">Java programming language</a> কে গুলিয়ে ফেলবেন না। "Java" এবং "JavaScript" উভয় প্রোগ্রামিং ভাষাই Oracle কোম্পানির ট্রেডমার্ক বা ট্রেডমার্ক হিসেবে নিবন্ধিত যুক্তরাষ্ট্র এবং অন্যান্য দেশে। যাইহোক, এই দুই প্রোগ্রামিং ভাষার বাক্য গঠন প্রণালী (syntax), শব্দার্থবিদ্যা(semantics), এবং ব্যবহার একেবারেই আলাদা।</p> - -<div class="column-container"> -<div class="column-half"> -<h2 id="টিউটোরিয়াল">টিউটোরিয়াল</h2> - -<p>জাভাস্ক্রিপ্ট দিয়ে কিভাবে প্রোগ্রাম করা হয় সেটা শিখুন টিউটোরিয়াল এবং নির্দেশিকার মাধ্যমে।</p> - -<h3 id="যারা_একেবারেই_নতুন">যারা একেবারেই নতুন</h3> - -<p>আপনি যদি জাভাস্ক্রিপ্ট শিখতে চান কিন্তু আপনার জাভাস্ক্রিপ্ট বা অন্য কোন প্রোগ্রামিং সম্পকে কোন পূর্ব অভিজ্ঞতা নেই তাহলে আমাদের জাভাস্ক্রিপ্ট শিক্ষাক্ষেত্রের দিকে এগিয়ে যান। নিম্নে সম্পূর্ণ মডিউলগুলো রয়েছে।</p> - -<p><strong><a href="/en-US/docs/Web/JavaScript/JavaScript_technologies_overview">জাভাস্ক্রিপ্টের প্রথম ধাপ</a></strong></p> - -<p>জাভাস্ক্রিপ্ট এর বৈশিষ্ট “ভেরিয়েবল, স্ট্রিং, নাম্বারস, এবং এরেইস” এগুলোর আলোচনার সাথে কিছু মৌলিক প্রশ্নের উত্তর দিন যেমন “জাভাস্ক্রিপ্ট কি?”, “ এটা দেখতে কেমন?”, এবং “এটা কি করে?”</p> - -<p><strong><a href="/en-US/docs/Web/JavaScript/JavaScript_technologies_overview">জাভাস্ক্রিপ্ট নির্মান অংশ</a></strong></p> - -<p>জাভাস্ক্রিপ্ট এর মৌলিক বৈশিষ্ট এর সাথে সাধারণভাবে সম্মুক্ষীন হওয়া বিভিন্ন ধরনের কোড ব্লকের দিকে আমাদের দৃষ্টি আকর্ষন করা যেমন conditional statements, loops, functions, এবং events. </p> - -<p><strong><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript">জাভাস্ক্রিপ্ট অবজেক্ট এর পরিচিতি </a></strong></p> - -<p> জাভাস্ক্রিপ্ট এর অবজেক্ট ওরিন্টেড প্রকৃতিটা বুঝা গুরুত্বপূর্ণ যদি আপনি ভাষার জ্ঞান নিয়ে সামনে এগিয়ে যেতে চান এবং আধিক কার্যকর কোড লিখতে চান, এখানে আমাদের দেয়া মডিউল আপনাকে সহযোগিতা করবে।</p> - -<h3 id="জাভাস্ক্রিপ্ট_নির্দেশনা">জাভাস্ক্রিপ্ট নির্দেশনা</h3> - -<dl> - <dt><a href="/en-US/docs/Web/JavaScript/JavaScript_technologies_overview">জাভাস্কিপ্ট নির্দেশনা</a></dt> - <dd>জাভাস্ক্রিপ্ট ভাষা এর একটি বিস্তারিত নির্দেশনার উদ্দেশ্য যাদের জাভাস্ক্রিপ্ট বা অন্য কোনো প্রোগ্রামিং ভাষা সম্পর্কে পূর্বপর্তী অভিজ্ঞতা আছে ।</dd> -</dl> - -<h3 id="মধ্যবর্তী">মধ্যবর্তী</h3> - -<dl> - <dt><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/A_re-introduction_to_JavaScript">ক্লায়েন্ট সাইড ওয়েব </a> <a href="https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Client-side_web_APIs">APIs</a></dt> -</dl> - -<p>ওয়েব সাইট বা এপ্লিকেশনগুলির জন্য ক্লায়েন্ট সাইড জাভাস্ক্রিপ্ট লেখার সময় API গুলি ব্যবহার শুরু করার আগে খুব বেশী দুরে যাবেন না--ব্রাউজার ও ওপারের্টং সিস্টেম চলন্ত অবস্থায় ইন্টারফেইসগুলি বিভিন্ন দিক সুচারু রূপে পরিচালনা করার জন্য বা এমনকি অন্য ওয়েব সাইট বা সেবাগুলি থেকে আসা ডাটা। এই মডিউলে আমরা এপিআই কি ? এবং কিভাবে খুবই প্রচলিত কিছু এপিআই আপনার ডেভেলপমেন্টের কাজে ব্যবহার করতে হয় সেই সম্পর্কে জানবো।</p> - -<dl> - <dt></dt> - <dt></dt> - <dt><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/A_re-introduction_to_JavaScript">জাভাস্ক্রিপ্ট এর পুনঃউপস্থাপন</a></dt> - <dd>যারা মনে করে , তারা জাভাস্ক্রিপ্ট সম্পর্কে জানে, তাদের জন্য একটি সংক্ষিপ্ত বিবরণ।</dd> -</dl> - -<dl> - <dt><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures">জাভাস্ক্রিপ্ট এর ডাটার গঠনশৈলী </a></dt> - <dd>জাভাস্ক্রিপ্ট এর ডাটার গঠনশৈলী সম্পর্কে সংক্ষিপ্ত বিবরন।</dd> - <dt><a href="/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness">সমতুল্যতা এবং অভিন্নতা </a></dt> -</dl> - -<p><code>জাভাস্ক্রিপ্ট তিন ধরনের মান সরবরাহ করে- তুলনার ক্ষেত্রে: কঠোর সমতার ক্ষেত্রে === এবং শিথিল সমতার ক্ষেত্রে == ।</code></p> - -<dl> - <dt> <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures">Closures</a></dt> - <dd>closure হচ্ছে একটি ফাংশন এবং lexical environment এর সমাহার যেটি পূর্বেই ঘোষনা করা হয়েছে।</dd> -</dl> - -<h3 id="এডভান্স">এডভান্স</h3> - -<dl> - <dt><a href="/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain">ইনহেরিটেন্স এবং প্রোটোটাইপ চেইন</a></dt> - <dd>ব্যাপকভাবে ভুল বুঝা বুঝি এবং অবহেলা করা হচ্ছে প্রোটোটাইপ ইনহেরিটেন্স ব্যাখ্য ।</dd> - <dt><a href="/en-US/docs/Web/JavaScript/Reference/Strict_mode">কঠোর মুড</a></dt> - <dd>কঠোর মুড( Strict mode ) এর সঙ্গা হচ্ছে যে আপনি এটি আরম্ভ করার পূর্বে কোনো ভেরিয়েবল ব্যবহার করতে পারবেন না। এটা ECMAScript 5 একটি সীমাবদ্ধতা, দ্রুত কর্মক্ষমতা এবং সহজ ডিবাগিংএর জন্য। </dd> - <dt><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays">জাভাস্ক্রিপ্টের অ্যারে টাইপ</a></dt> - <dd>জাভাস্ক্রিপ্টের অ্যারে নতুন বাইনারি তথ্য অ্যাক্সেসের জন্য একটি প্রক্রিয়া প্রদান করে।</dd> - <dt><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Memory_Management">মেমরি ম্যানেজমেন্ট</a></dt> - <dd>মেমরীর জীবনচক্র এবং জাভাস্ক্রিপ্টের মধ্যেকার আবর্জনা সংগ্রহ।</dd> - <dt></dt> -</dl> -</div> - - - -<div class="column-half"> -<h2 id="Reference">Reference</h2> - -<p>ব্রাউজ করুন.সম্পূর্ণ <a href="/en-US/docs/Web/JavaScript/Reference">জেএস- রেফারেন্স</a> ডকুমেন্টেশন ।</p> - -<dl> - <dt><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects">Standard objects</a></dt> - <dd>Get to know standard built-in objects <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array" title="The JavaScript Array global object is a constructor for arrays, which are high-level, list-like objects."><code>Array</code></a></code>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean" title="The Boolean object is an object wrapper for a boolean value."><code>Boolean</code></a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date" title="Creates a JavaScript Date instance that represents a single moment in time. Date objects are based on a time value that is the number of milliseconds since 1 January, 1970 UTC."><code>Date</code></a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Error" title="The Error constructor creates an error object. Instances of Error objects are thrown when runtime errors occur. The Error object can also be used as a base objects for user-defined exceptions. See below for standard built-in error types."><code>Error</code></a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function" title="The Function constructor creates a new Function object. In JavaScript every function is actually a Function object."><code>Function</code></a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON" title="The JSON object contains methods for parsing JavaScript Object Notation (JSON) and converting values to JSON. It can't be called or constructed, and aside from its two method properties it has no interesting functionality of its own."><code>JSON</code></a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math" title="Math is a built-in object that has properties and methods for mathematical constants and functions. Not a function object."><code>Math</code></a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number" title="The Number JavaScript object is a wrapper object allowing you to work with numerical values. A Number object is created using the Number() constructor."><code>Number</code></a>, <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object"><code>Object</code></a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp" title="The RegExp constructor creates a regular expression object for matching text with a pattern."><code>RegExp</code></a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String" title="The String global object is a constructor for strings, or a sequence of characters."><code>String</code></a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map" title="The Map object is a simple key/value map. Any value (both objects and primitive values) may be used as either a key or a value."><code>Map</code></a>, <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set">Set</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/WeakMap" title="The WeakMap object is a collection of key/value pairs in which the keys are objects and the values can be arbitrary values."><code>WeakMap</code></a></code>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/WeakSet" title="The WeakSet object lets you store weakly held objects in a collection."><code>WeakSet</code></a>, and others.</dd> - <dt><a href="/en-US/docs/Web/JavaScript/Reference/Operators">Expressions & operators</a></dt> - <dd>Learn more about the behavior of JavaScript's operators <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/instanceof">instanceof</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof">typeof</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/new">new</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this">this</a></code>, and more.</dd> - <dt><a href="/en-US/docs/Web/JavaScript/Reference/Statements">Statements & declarations</a></dt> - <dd>Learn how <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/do...while">do-while</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in">for-in</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for-of</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/try...catch">try-catch</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let">let</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var">var</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const">const</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if...else">if-else</a></code>, <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch">switch</a></code>, and more JavaScript statements and keywords work.</dd> - <dt><a href="/en-US/docs/Web/JavaScript/Reference/Functions">Functions</a></dt> - <dd>Learn how to work with JS functions to develop your applications.</dd> -</dl> - -<h2 id="Tools_resources">Tools & resources</h2> - -<p>Helpful tools while writing and debugging your JavaScript code.</p> - -<dl> - <dt><a href="/en-US/docs/Tools">Firefox Developer Tools</a></dt> - <dd><a href="/en-US/docs/Tools/Scratchpad">Scratchpad</a>, <a href="/en-US/docs/Tools/Web_Console">Web Console</a>, <a href="/en-US/docs/Tools/Profiler">JavaScript Profiler</a>, <a href="/en-US/docs/Tools/Debugger">Debugger</a>, and more.</dd> - <dt><a class="external" href="http://www.getfirebug.com/">Firebug</a></dt> - <dd>Edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.</dd> - <dt><a href="/en-US/docs/Web/JavaScript/Shells">JavaScript Shells</a></dt> - <dd>A JavaScript shell allows you to quickly test snippets of JavaScript code.</dd> - <dt><a href="https://togetherjs.com/">TogetherJS</a></dt> - <dd> - <p class="hero-header-text large">Collaboration made easy.</p> - </dd> - <dt><a href="http://stackoverflow.com/questions/tagged/javascript">Stack Overflow</a></dt> - <dd>Stack Overflow questions tagged with "JavaScript".</dd> - <dt><a href="/en-US/docs/Web/JavaScript/New_in_JavaScript">JavaScript versions and release notes</a></dt> - <dd>Browse JavaScript's feature history and implementation status.</dd> -</dl> -</div> -</div> diff --git a/files/bn/web/javascript/inheritance_and_the_prototype_chain/index.html b/files/bn/web/javascript/inheritance_and_the_prototype_chain/index.html deleted file mode 100644 index 0db75f2c69..0000000000 --- a/files/bn/web/javascript/inheritance_and_the_prototype_chain/index.html +++ /dev/null @@ -1,177 +0,0 @@ ---- -title: ইনহেরিটেন্স এবং প্রোটোটাইপ-চেইন -slug: Web/JavaScript/Inheritance_and_the_prototype_chain -tags: - - Guide - - Inheritence - - JavaScript - - NeedsContent - - OOP - - অবজেক্ট ওরিয়েন্টেড প্রোগ্রামিং - - ইনহেরিটেন্স - - গাইড - - জাভাস্ক্রিপ্ট -translation_of: Web/JavaScript/Inheritance_and_the_prototype_chain ---- -<div>{{jsSidebar("Advanced")}}</div> - -<p>যেসব ডেভেলপার আগে ক্লাস-ভিত্তিক প্রোগ্রামিং ল্যাংগুয়েজে (যেমন সি++ বা জাভা) কোড করছেন, তারা জাভাস্ক্রিপ্টে কোড করতে গিয়ে একটু বিভ্রান্ত হবেন, কেননা জাভাস্ক্রিপ্ট একটি ডায়নামিক ল্যাংগুয়েজ আর এতে কোন <code>class</code> ইমপ্লিমেন্টেশন নেই ( যদিও <code>class </code>নামে একটি কীওয়ার্ড জাভাস্ক্রিপ্ট সংরক্ষণ করে রেখেছে - তাই এই নামে কোন ভ্যারিয়েবল তৈরি করতে পারবেন না )।</p> - -<p>জাভাস্ক্রিপ্টে ইনহেরিটেন্স বিষয়ক একটি মাত্র কন্সট্রাক্ট আছেঃ অবজেক্ট। সব অবজেক্ট এরই আরেকটা অবজেক্ট এর সাথে অভ্যন্তরীণ লিঙ্ক থাকে যাকে তার <strong>প্রটোটাইপ </strong>বলে। আবার এই প্রোটাটাইপ অবজেক্টের ও নিজস্ব একটি প্রটোটাইপ থাকে। এভাবে চলতেই থাকে, যতক্ষণ না আমরা <code>null</code> হিসেবে কোন অবজেক্টের প্রটোটাইপ পাই। <code>null</code> এর কোন প্রটোটাইপ থাকে না, তাই যখন null পাব তখন বুঝতে হবে <strong>প্রটোটাইপ চেইনের</strong> শেষপ্রান্তে এসে গেছি।</p> - -<p>প্রটোটাইপ মডেল কে অনেকে জাভাস্ক্রিপ্টের দুর্বলতা বললেও আসলে প্রটোটাইপ-ভিত্তিক ইনহেরিটেন্স মডেল সি++/জাভা ভিত্তিক ক্লাসিকাল মডেলের থেকে অনেক শক্তিশালী। যেমন, প্রটোটাইপ মডেল কে ভিত্তি করে আমরা সহজেই ক্ল্যাসিকাল মডেল তৈরি করতে পারি, কিন্তু ক্লাসিকাল মডেলের ওপর ভিত্তি করে চাইলেই প্রটোটাইপ ভিত্তিক মডেল তৈরি করা সম্ভব না।</p> - -<h2 id="প্রটোটাইপ-চেইন_ভিত্তিক_ইনহেরিটেন্স">প্রটোটাইপ-চেইন ভিত্তিক ইনহেরিটেন্স</h2> - -<h3 id="প্রোপার্টি_ইনহেরিট_করা"><strong>প্রোপার্টি </strong>ইনহেরিট করা</h3> - -<p>জাভাস্ক্রিপ্টে অবজেক্ট কে আমরা বিভিন্ন <strong>প্রোপার্টির</strong> "ব্যাগ" (থলে) হিসেবে কল্পনা করতে পারিঃ এই ব্যাগে যেকোন সময় যেকোন প্রোপার্টি ঢুকানো যায়, ব্যাগ থেকে ফেলেও দেওয়া যায় (যে কারণে আমরা জাভাস্ক্রিপ্টকে ডায়নামিক বলি) । প্রতিটা অবজেক্টের সাথে একটা বিশেষ অবজেক্টের লিংক থাকে, এই বিশেষ অবজেক্ট টাকে আমরা মূল অবজেক্টটার প্রটোটাইপ বলি। আমরা যখন কোন অবজেক্টের কোন প্রোপার্টি কে ব্যবহার করতে চাই, তখন যা ঘটেঃ</p> - -<pre class="brush: js">// ধরে নেই, আমার o নামের একটা অবজেক্ট আছে যেটার প্রোটোটাইপ চেইন এমনঃ -// {a:1, b:2} ---> {b:3, c:4} ---> null -// মানে হল, o অবজেক্ট হচ্ছে {a:1, b:2}, যেটার প্রোটোটাইপ হচ্ছে {b:3, c:4} ইনহেরিটেন্স হিসেবে চিন্তা করলে, -// {a:1, b:2} অবজেক্ট টা {b:3, c:4} অবজেক্ট থেকে ইনহেরিট করা হয়েছে। {b:3, c:4} এর কোন প্রোটোটাইপ নাই, যেকারণে null দেখানো হয়েছে। -// 'a' আর 'b' এই দুইটা কেবল o অবজেক্টের নিজস্ব প্রোপার্টি। - -// এই উদাহরণে, someObject.[[Prototype]] দিয়ে আমরা someObject অবজেক্টের প্রোটোটাইপ বুঝিয়েছি। -// এইটা শুধুই উদাহরণের জন্য (ECMAScript স্ট্যান্ডার্ড অনুযায়ী) আর আসল কোডে এরকম কিছু লেখা যাবে না! - -console.log(o.a); // 1 -// o অবজেক্টের কি 'a' নামে কোন প্রোপার্টী আছে? হ্যাঁ, আর এর মান হল 1 - -console.log(o.b); // 2 -// o অবজেক্টের কি 'b' নামে কোন প্রোপার্টী আছে? হ্যাঁ, আর এর মান হল 2 -// o অবজেক্টের প্রোটোটাইপেরও কিন্তু 'b' প্রোপার্টী ছিল, কিন্তু এটি দেখা যাবে না। একে বলে "property shadowing" - -console.log(o.c); // 4 -// o অবজেক্টের কি 'c' নামে কোন প্রোপার্টী আছে? নাই, তাহলে এর প্রোটোটাইপে দেখতে হবে এই নামে প্রোপার্টি আছে কিনা। -// o.[[Prototype]] এ কি 'c' প্রোপার্টি আছে? ? হ্যাঁ, আর এর মান হল 4 - -console.log(o.d); // undefined -// o অবজেক্টের কি 'd' নামে কোন প্রোপার্টী আছে? নাই, তাহলে এর প্রোটোটাইপে দেখতে হবে এই নামে প্রোপার্টি আছে কিনা। -// o.[[Prototype]] অবজেক্টের কি 'd' নামে কোন প্রোপার্টী আছে? নাই, তাহলে এর প্রোটোটাইপে দেখতে হবে এই নামে প্রোপার্টি আছে কিনা। -// o.[[Prototype]].[[Prototype]] এ null পেয়েছি, তারমানে আর খোজার কিছু নাই। undefined রিটার্ন করতে হবে। -</pre> - -<p>কোন অবজেক্টের প্রোপার্টি সেট করে দিলে সেটা সেই অবজেক্টের নিজস্ব প্রোপার্টি হিসেবে কাজ করে। একমাত্র ব্যতিক্রম হলঃ <a href="/bn-BD/docs/JavaScript/Guide/Working_with_Objects?redirectlocale=en-US&redirectslug=Core_JavaScript_1.5_Guide%2FWorking_with_Objects#Defining_getters_and_setters">getter অথবা setter</a> দিয়ে যখন ইনহেরিটেড প্রোপার্টি নিয়ে কাজ করা হয়।</p> - -<h3 id="মেথড_ইনহেরিট_করা">"মেথড" ইনহেরিট করা</h3> - -<p>ক্লাস-ভিত্তিক প্রোগ্রামিং ভাষাতে যেভাবে "মেথড" বা ফাংশন এর ধারণা প্রচলিত আছে, জাভাস্ক্রিপ্টে মেথডের ধারণা টা ঠিক সেভাবে নয়। জাভাস্ক্রিপ্টে, যেকোন ফাংশন সাধারণ প্রোপার্টির মতই অবজেক্টে যোগ করা যায়। ইনহেরিট করা ফাংশন অবজেক্টের বাদবাকি প্রোপার্টির মতই স্বাভাবিকভাবে কাজ করবে। উপরের উদাহরণে দেখানো property shadowing এখানেও কাজ করবে (এক্ষেত্রে একে বলা হবে <em>method overriding</em> বা ফাংশন ওভাররাইডিং)</p> - -<p>যখন ইনহেরিট-হওয়া কোন ফাংশন একজিকিউট হয়, তখন <a href="/bn-BD/JavaScript/Reference/Operators/this" title="this"><code>this</code></a> এর মান হিসেবে ইনহেরিট-হওয়া অবজেক্ট টা থাকে, প্রোটোটাইপ অবজেক্ট টা না যেখানে ফাংশনটা নিজস্ব প্রোপার্টি হিসেবে দেওয়া হয়েছিল।</p> - -<pre class="brush: js">var o = { - a: 2, - m: function(b){ - return this.a + 1; - } -}; - -console.log(o.m()); // 3 -// এখানে o.m কল করার সময়, 'this' পয়েন্ট করে আছে o কে। - -var p = Object.create(o); -// p অবজেক্ট টা o থেকে ইনহেরিট করা হয়েছে - -p.a = 12; // 'a' নামে p অবজেক্টে নিজস্ব প্রোপার্টি তৈরি হল -console.log(p.m()); // 13 -// এখানে p.m কল করার সময়, 'this' পয়েন্ট করে আছে p কে। -// তাই যখন o অবজেক্টের m ফাংশনটা p ইনহেরিট করল, 'this.a' এর মানে দাঁড়ালো p.a, 'a' নামের p এর নিজস্ব প্রোপার্টি। -</pre> - -<h2 id="অবজেক্ট_তৈরি_করার_বিভিন্ন_উপায়_এবং_ফলাফল_হিসেবে_প্রোটোটাইপ_চেইন">অবজেক্ট তৈরি করার বিভিন্ন উপায় এবং ফলাফল হিসেবে প্রোটোটাইপ চেইন</h2> - -<h3 id="সিন্ট্যাক্স_কন্সট্রাক্টস_ব্যবহার_করে_অবজেক্ট_তৈরি_করা">সিন্ট্যাক্স কন্সট্রাক্টস ব্যবহার করে অবজেক্ট তৈরি করা</h3> - -<pre class="brush: js">var o = {a: 1}; - -// নতুন তৈরি করা o অবজেক্টের প্রটোটাইপ হচ্ছে Object.prototype -// o এর 'hasOwnProperty' নামের কোন নিজস্ব প্রোপার্টি নেই। -// hasOwnProperty হচ্ছে Object.prototype এর একটি নিজস্ব প্রোপার্টি। তাই o, Object.prototype থেকে hasOwnProperty ইনহেরিট করেছে। -// Object.prototype এর প্রোটোটাইপ হচ্ছে null -// o ---> Object.prototype ---> null - -var a = ["yo", "whadup", "?"]; - -// Arrays inherit from Array.prototype (which has methods like indexOf, forEach, etc.) -// The prototype chain looks like: -// a ---> Array.prototype ---> Object.prototype ---> null - -function f(){ - return 2; -} - -// Functions inherit from Function.prototype (which has methods like call, bind, etc.) -// f ---> Function.prototype ---> Object.prototype ---> null -</pre> - -<h3 id="কন্সট্রাক্টর_এর_সাহায্যে">কন্সট্রাক্টর এর সাহায্যে</h3> - -<p>জাভাস্ক্রিপ্টে "কন্সট্রাক্টর", "শুধুই" সাধারণ যেকোন ফাংশন যাকে কিনা <a href="/bn-BD/docs/Web/JavaScript/Reference/Operators/new?redirectlocale=en-US&redirectslug=JavaScript%2FReference%2FOperators%2Fnew" title="new">new</a> অপারেটর দিয়ে কল করা হয়।</p> - -<pre class="brush: js">function Graph() { - this.vertexes = []; - this.edges = []; -} - -Graph.prototype = { - addVertex: function(v){ - this.vertexes.push(v); - } -}; - -var g = new Graph(); -// g is an object with own properties 'vertexes' and 'edges'. -// g.[[Prototype]] is the value of Graph.prototype when new Graph() is executed. -</pre> - -<h3 id="Object.create_দিয়ে">Object.create দিয়ে</h3> - -<p>ECMAScript 5 নতুন একটি মেথড নিয়ে এসেছেঃ <a href="/en/JavaScript/Reference/Global_Objects/Object/create" title="create">Object.create</a>। এই মেথড কল করলে নতুন একটি অবজেক্ট তৈরি হয় যার প্রোটোটাইপ হল মেথডটির প্রথম প্যারামিটারঃ</p> - -<pre class="brush: js">var a = {a: 1}; -// a ---> Object.prototype ---> null - -var b = Object.create(a); -// b ---> a ---> Object.prototype ---> null -console.log(b.a); // 1 (inherited) - -var c = Object.create(b); -// c ---> b ---> a ---> Object.prototype ---> null - -var d = Object.create(null); -// d ---> null -console.log(d.hasOwnProperty); // undefined, because d doesn't inherit from Object.prototype -</pre> - -<div> -<h3 id="পারদর্শীতা">পারদর্শীতা</h3> - -<p>কোন অবজেক্টে কোন প্রোপার্টি আছে কিনা সেটা জানার জন্য, অবজেক্টের পুরো প্রটোটাইপ-চেইন খুঁজে দেখতে হয়। কোডের পার্ফরমেন্সে এটা ভালই বাজে প্রভাব ফেলে। যেসব কোডের পারফরমেন্স খুব ভাল হওয়া দরকার, সেখানে এই ইস্যু প্রভাব ফেলতে পারে। অবজেক্টে কোন প্রোপার্টি খুঁজে না পেলে পুরো প্রোটোটাইপ চেইনের কোথাও প্রোপার্টি টা আছে কিনা খুঁজা হয়।</p> - -<p>এছাড়াও, অবজেক্টের প্রোপার্টি গুলো ঘুরে দেখার সময় (iterate করার সময়) প্রোটোটাইপ-চেইনের <strong>প্রত্যেকটা</strong> প্রোপার্টি খুঁজে দেখা (enumerate করা) হবে।</p> - -<p>অবজেক্টে কোন প্রোপার্টি শুধুমাত্র <em>নিজস্ব</em> প্রোপার্টি হিসেবে আছে কিনা (প্রোটোটাইপ চেইনের অন্য কোথাও নয়) <a href="/bn-BD/docs/JavaScript/Reference/Global_Objects/Object/hasOwnProperty" title="/ru/docs/JavaScript/Reference/Global_Objects/Object/hasOwnProperty"><code>hasOwnProperty</code></a> মেথড ব্যবহার উচিত। সব অবজেক্ট এই মেথডটাকে <code>Object.prototype থেকে ইনহেরিট করে।</code></p> - -<p>জাভাস্ক্রিপ্টে <a href="/bn-BD/docs/JavaScript/Reference/Global_Objects/Object/hasOwnProperty" title="/ru/docs/JavaScript/Reference/Global_Objects/Object/hasOwnProperty"><code>hasOwnProperty</code></a>-ই একমাত্র ফাংশন যা প্রোপার্টি নিয়ে কাজ করে এবং পুরো প্রোটোটাইপ চেইন ঘুরে (traverse) <strong>না</strong>।</p> - - -<div class="note">খেয়াল করুনঃ কোন প্রোপার্টি <a href="/bn-BD/docs/Web/JavaScript/Reference/Global_Objects/undefined" title="/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined"><code>undefined</code></a> কিনা এই চেক করাই যথেষ্ট <strong>নয়</strong>। হতে পারে প্রোপার্টি টি বহাল তবিয়তেই আছে, কেবল এর মান <code>undefined</code> দেওয়া হয়েছে।</div> - -<div> -<h3 id="বদ_অভ্যাসঃ_নেটিভ_প্রোটোটাইপ_এক্সটেন্ড_করা">বদ অভ্যাসঃ নেটিভ প্রোটোটাইপ এক্সটেন্ড করা</h3> - -<p>একটা বাজে ব্যাপার প্রায়ই করা হয় তা হল <code>Object.prototype</code> অথবা অন্য কোন বিল্ট-ইন প্রটোটাইপ এক্সটেন্ড করা।</p> - -<p>এই পদ্ধতিকে বলা হয় monkey patching যা <em>encapsulation</em> এর সর্বনাশ ছাড়া আর কিছুই নয়। Prototype.js এর মত কিছু জনপ্রিয় ফ্রেমওয়ার্কে এর ব্যবহার দেখা গেলেও, স্ট্যান্ডার্ড-নয়, এমন ফিচার দিয়ে বিল্ট-ইন টাইপগুলোর বোঝা বাড়ানোর কোন মানে হয় না।</p> - -<p>বিল্ট-ইন টাইপ এক্সটেন্ড করার একমাত্র যৌক্তিক কারণ হতে পারে জাভাস্ক্রিপ্টের নতুন ফিচার গুলো পুরনো ইঞ্জিনে দেওয়া; যেমন <code>Array.forEach</code>, ইত্যাদি।</p> -</div> - -<div> -<h3 id="পরিশেষে">পরিশেষে</h3> - -<p>প্রটোটাইপ ইনহেরিটেন্স মডেল এর ভিত্তি করে জটিল জটিল কোড লেখার আগে একে ভালভাবে বুঝা <strong>উচিত</strong>। এছাড়াও, পারফরমেন্স জনিত সমস্যা থেকে দূরে থাকার জন্য লম্বা প্রটোটাইপ চেইন পরিহার করতে হবে আর যেখানে সম্ভব প্রটোটাইপ চেইন ভেঙ্গে ছোট করতে হবে। সবশেষে, জাভাস্ক্রিপ্টের নতুন ফিচার যাতে সব ইঞ্জিনেই চলে, শুধুমাত্র সেক্ষেত্রে নেটিভ প্রোটোটাইপ এক্সটেন্ড করা যাবে, এছাড়া এর ব্যবহার সর্বক্ষেত্রে <strong>নিরুৎসাহিত</strong> করা হয়।</p> -</div> -</div> diff --git a/files/bn/web/javascript/language_resources/index.html b/files/bn/web/javascript/language_resources/index.html deleted file mode 100644 index 4aed82dadb..0000000000 --- a/files/bn/web/javascript/language_resources/index.html +++ /dev/null @@ -1,103 +0,0 @@ ---- -title: জাভাস্কিপ্ট ভাষার রিসোর্স -slug: Web/JavaScript/Language_Resources -tags: - - JavaScript - - JavaScript Language Resource - - জাভাস্ক্রিপ্ট -translation_of: Web/JavaScript/Language_Resources -original_slug: Web/JavaScript/ভাষার_রিসোর্স ---- -<div>{{JsSidebar}}</div> - -<p><strong>ECMAScript</strong> হচ্ছে এক প্রকার স্ক্রিপ্টিং ভাষা যার ওপর ভিত্তি করে <a href="/bn-BD/docs/JavaScript">জাভাস্ক্রিপ্ট</a> তৈরি। <span class="chatlinetext"><a href="http://www.ecma-international.org/">আন্তর্জাতিক ECMA</a> সংস্থা ECMA স্ক্রিপ্ট এর জন্য ECMA-262 এবং ECMA-402 এই দুইটি মান নির্ধারণ করে দিয়েছে।</span> নিচের<span class="short_text" id="result_box" lang="bn"> <span class="hps">ECMAScript</span> স্টান্ডার্ডগুলো <span class="hps">অনুমোদিত হয়েছে</span><span>:</span></span></p> - -<table class="standard-table"> - <tbody> - <tr> - <th>নাম</th> - <th>লিঙ্ক</th> - <th>তারিখ</th> - <th>বর্ননা</th> - </tr> - <tr> - <td>ECMA-262 <span class="short_text" id="result_box" lang="bn"><span class="hps">সংস্করণ</span></span> ৫.১</td> - <td><a href="http://www.ecma-international.org/publications/files/ECMA-ST/Ecma-262.pdf">PDF</a>, <a href="http://www.ecma-international.org/ecma-262/5.1/">HTML</a></td> - <td>জুন ২০১১</td> - <td> - <p>ECMAScript ৫.১, জাভাস্ক্রিপ্ট নির্দেশনার সর্বশেষ প্রকাশিত সংস্করণ<br> - <span id="result_box" lang="bn"><span class="hps">এই সংস্করণ</span> <span class="hps">সম্পূর্ণরূপে</span> <span class="hps">আন্তর্জাতিক</span> <a href="http://www.iso.org/iso/iso_catalogue/catalogue_tc/catalogue_detail.htm?csnumber=55755"><span class="hps">আইএসও</span><span class="hps">/</span><span class="hps">আইইসি</span> <span class="hps">১৬২৬২</span></a></span><a href="http://www.iso.org/iso/iso_catalogue/catalogue_tc/catalogue_detail.htm?csnumber=55755"><span class="short_text" id="result_box" lang="bn"><span>:২০১১</span></span></a><span id="result_box" lang="bn"> <span class="hps">এর</span> <span class="hps alt-edited">তৃতীয়</span> <span class="hps">সংস্করণ</span> <span class="hps">সমর্থিত</span><span class="hps">। </span></span><span id="result_box" lang="bn"><span class="hps alt-edited">এতে</span> <span class="hps">ES5</span> <span class="hps">Errata</span> <span class="hps alt-edited">সংশোধন অন্তর্ভূক্ত করা হয়েছে</span>, <span class="hps">নতুন কোন বৈশিষ্ট্য</span> <span class="hps alt-edited">অন্তর্ভুক্ত করা হয়নি।</span></span></p> - </td> - </tr> - <tr> - <td>CMA-402</td> - <td><a href="http://ecma-international.org/ecma-402/1.0/ECMA-402.pdf">PDF</a>, <a href="http://ecma-international.org/ecma-402/1.0/index.html">HTML</a></td> - <td>ডিসেম্বর ২০১২</td> - <td>ECMAScript <span class="short_text" id="result_box" lang="bn"><span class="hps">আন্তর্জাতিকায়ন</span></span> API</td> - </tr> - <tr> - <td>ECMA-357 <span class="short_text" id="result_box" lang="bn"><span class="hps">সংস্করণ</span></span> ২</td> - <td><a href="http://www.ecma-international.org/publications/files/ECMA-ST/Ecma-357.pdf">PDF</a></td> - <td>ডিসেম্বর ২০০৫</td> - <td>এক্সএমএল<a href="/en-US/docs/E4X"> (E4X)</a> এর জন্য ECMAScript.</td> - </tr> - <tr> - <th colspan="4"><span class="short_text" id="result_box" lang="bn"><span class="hps">অপ্রচলিত</span> সংস্করণ</span></th> - </tr> - <tr> - <td>ECMA-262</td> - <td><a href="http://www.ecma-international.org/publications/files/ECMA-ST-ARCH/ECMA-262,%201st%20edition,%20June%201997.pdf">PDF</a></td> - <td>জুন ১৯৯৭</td> - <td><span class="short_text" id="result_box" lang="bn"><span class="hps">ECMAScript</span> এর আদি সংস্করণ<span>।</span></span></td> - </tr> - <tr> - <td>ECMA-262 <span class="short_text" id="result_box" lang="bn"><span class="hps">সংস্করণ</span></span> ২</td> - <td><a href="http://www.ecma-international.org/publications/files/ECMA-ST-ARCH/ECMA-262,%202nd%20edition,%20August%201998.pdf">PDF</a></td> - <td>আগস্ট ১৯৯৮</td> - <td> - <p><span id="result_box" lang="bn"><span class="hps">ECMAScript</span> স্ট্যান্ডার্ড এর <span class="hps">দ্বিতীয়</span> <span class="hps">সংস্করণ</span><span>;</span> <span class="hps">এছাড়াও</span> <span class="hps">আইএসও</span> <span class="hps">স্ট্যান্ডার্ড</span> <span class="hps">১৬২৬২।</span></span></p> - </td> - </tr> - <tr> - <td>ECMA-262 <span class="short_text" id="result_box" lang="bn"><span class="hps">সংস্করণ ৩</span></span></td> - <td><a href="http://www.ecma-international.org/publications/files/ECMA-ST-ARCH/ECMA-262,%203rd%20edition,%20December%201999.pdf">PDF</a></td> - <td>ডিসেম্বর ১৯৯৯</td> - <td>ECMAScript প্রমিত তৃতীয় সংস্করণ; জাভাস্ক্রিপ্ট এর ১.৫ এর অনুরূপ।<br> - <span class="short_text" id="result_box" lang="bn"><span class="hps">আরো দেখুন</span></span> <a href="http://www.mozilla.org/js/language/E262-3-errata.html">errata</a></td> - </tr> - <tr> - <td>ECMA-262 <span class="short_text" id="result_box" lang="bn"><span class="hps">সংস্করণ ৫</span></span></td> - <td><a href="http://www.ecma-international.org/publications/files/ECMA-ST-ARCH/ECMA-262%205th%20edition%20December%202009.pdf">PDF</a></td> - <td>ডিসেম্বর ২০০৯</td> - <td>ECMAScript ৫<br> - আরো দেখুন <a href="http://wiki.ecmascript.org/doku.php?id=es3.1:es3.1_proposal_working_draft">ES5 errata</a> এবং <a href="/bn-BD/docs/JavaScript/ECMAScript_5_support_in_Mozilla" title="JavaScript/ECMAScript 5 support in Mozilla">ECMAScript ৫ মোজিলা সমর্থন</a></td> - </tr> - <tr> - <td>ECMA-357</td> - <td><a href="http://www.ecma-international.org/publications/files/ECMA-ST-WITHDRAWN/ECMA-357,%201st%20edition,%20June%202004.pdf">PDF</a></td> - <td>জুন ২০০৪</td> - <td><a href="/en-US/docs/E4X" title="E4X">এক্সএমএল (E4X) এর জন্য ECMAScript</a><br> - আরো দেখুন <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=169406">E4X errata</a></td> - </tr> - </tbody> -</table> - -<p><span id="result_box" lang="bn"><span class="hps">ECMAScript</span> এর <span class="hps">ইতিহাস</span> সম্পর্কে <span class="hps">আরও তথ্যের</span> <span class="hps">জন্য</span> <a href="http://en.wikipedia.org/wiki/ECMAScript"><span class="hps">উইকিপিডিয়া</span> <span class="hps">ECMAScript</span></a> <span class="hps">এন্ট্রি</span> <span class="hps">দেখুন।</span></span></p> - -<p>ECMAScript ভাষার স্পেসিফিকেশন এর পরবর্তী সংস্করণ, কোড-নাম "হারমনি" এর কাজ এ <span class="short_text" id="result_box" lang="bn"><span class="hps">আপনি</span> <span class="hps">অংশগ্রহণ</span> <span class="hps">বা শুধু</span> <span class="hps">ট্র্যাক করতে পারেন, এবং </span></span><span id="result_box" lang="bn"><span class="hps">পাবলিক</span> <span class="hps">উইকি</span>র <span class="hps">মাধ্যমে</span> <span class="hps">ECMAScript</span> <span class="hps">আন্তর্জাতিকায়ন</span> <span class="hps">এপিআই</span> <span class="hps">স্পেসিফিকেশন </span></span>এবং <a href="http://www.ecmascript.org/community.php" title="http://www.ecmascript.org/community.php">ecmascript.org</a> হতে <span class="link-https"><a href="https://mail.mozilla.org/listinfo/es-discuss">es-discuss</a> মেইলিং তালিকায় অংশগ্রহণ করতে পারেন।</span></p> - -<h2 id="বাস্তবায়ন">বাস্তবায়ন</h2> - -<ul> - <li><a href="/bn-BD/docs/SpiderMonkey" title="SpiderMonkey">SpiderMonkey</a> - ফায়ারফক্স এ ব্যবহৃত জাভাস্ক্রিপ্ট ইঞ্জিন;</li> - <li><a href="/bn-BD/docs/Rhino" title="Rhino">Rhino</a> - জাভায় লেখা জাভাস্ক্রিপ্ট ইঞ্জিন;</li> - <li><a href="/bn-BD/docs/Tamarin" title="Tamarin">Tamarin</a> - <span id="result_box" lang="bn"><span class="hps atn">(</span><span>অ্যাডোবি</span> <span class="hps">®</span> <span class="hps">ফ্ল্যাশ</span> <span class="hps">®</span> <span class="hps">প্লেয়ার</span> এ <span class="hps">ব্যবহৃত</span><span>)</span> <span class="hps">ActionScript</span> <span class="hps">ভার্চুয়াল মেশিন</span><span>; </span></span></li> - <li><a href="http://en.wikipedia.org/wiki/List_of_ECMAScript_engines" title="http://en.wikipedia.org/wiki/List_of_ECMAScript_engines"><span class="short_text" id="result_box" lang="bn"><span class="hps">অন্যান্য</span> <span class="hps">বাস্তবায়ন</span></span></a> (<span class="short_text" id="result_box" lang="bn"><span class="hps">উইকিপিডিয়া</span></span>)</li> -</ul> - -<h2 id="আরো_দেখুন">আরো দেখুন</h2> - -<ul> - <li><a href="http://brendaneich.com/" title="http://brendaneich.com/">Brendan Eich এর ব্লগ</a>। Brendan হল জাভাস্ক্রিপ্ট এবং <span class="short_text" id="result_box" lang="bn"><span class="hps">SpiderMonkey JS এর প্রস্তুতকারক।</span></span> <span id="result_box" lang="bn"><span class="hps">তিনি</span> <span class="hps">এখনও</span> <span class="hps">ভাষা</span> <span class="hps">অভিব্যক্ত</span>করণ <span class="hps">ECMA</span> <span class="hps">দলের সাথে</span> <span class="hps">কাজ করছেন।</span></span></li> - <li><a href="http://dmitrysoshnikov.com/" title="http://dmitrysoshnikov.com/"><span id="result_box" lang="bn"><span class="hps atn">ECMA-</span><span>262</span> <span class="hps">সংস্করণ</span> ৩<span class="hps"> এবং</span> ৫ <span class="hps">এর</span> </span></a><a href="http://dmitrysoshnikov.com/" title="http://dmitrysoshnikov.com/">Dmitry Soshnikov</a><a href="http://dmitrysoshnikov.com/" title="http://dmitrysoshnikov.com/"><span id="result_box" lang="bn"> <span class="hps">এর</span> <span class="hps">বিশ্লেষণ</span></span></a></li> -</ul> diff --git a/files/bn/web/javascript/reference/global_objects/index.html b/files/bn/web/javascript/reference/global_objects/index.html deleted file mode 100644 index 91433921eb..0000000000 --- a/files/bn/web/javascript/reference/global_objects/index.html +++ /dev/null @@ -1,177 +0,0 @@ ---- -title: Global Objects -slug: Web/JavaScript/Reference/Global_Objects -tags: - - JavaScript -translation_of: Web/JavaScript/Reference/Global_Objects ---- -<div>{{jsSidebar("Objects")}}</div> - -<p>This chapter documents all of JavaScript's standard, built-in objects, including their methods and properties.</p> - -<div class="onlyinclude"> -<p>The term "global objects" (or standard built-in objects) here is not to be confused with the <strong>global object</strong>. Here, global objects refer to <strong>objects in the global scope</strong> (but only if ECMAScript 5 strict mode is not used; in that case it returns <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined">undefined</a>). The <strong>global object</strong> itself can be accessed using the {{jsxref("Operators/this", "this")}} operator in the global scope. In fact, the global scope <strong>consists of</strong> the properties of the global object, including inherited properties, if any.</p> - -<p>Other objects in the global scope are either <a href="/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Creating_new_objects">created by the user script</a> or provided by the host application. The host objects available in browser contexts are documented in the <a href="/en-US/docs/Web/API/Reference">API reference</a>. For more information about the distinction between the <a href="/en-US/docs/DOM/DOM_Reference">DOM</a> and core <a href="/en-US/docs/Web/JavaScript">JavaScript</a>, see <a href="/en-US/docs/Web/JavaScript/JavaScript_technologies_overview">JavaScript technologies overview</a>.</p> - -<h2 id="Standard_objects_by_category">Standard objects (by category)</h2> - -<h3 id="Value_properties">Value properties</h3> - -<p>These global properties return a simple value; they have no properties or methods.</p> - -<ul> - <li>{{jsxref("Infinity")}}</li> - <li>{{jsxref("NaN")}}</li> - <li>{{jsxref("undefined")}}</li> - <li>{{jsxref("null")}} literal</li> -</ul> - -<h3 id="Function_properties">Function properties</h3> - -<p>These global functions—functions which are called globally rather than on an object—directly return their results to the caller.</p> - -<ul> - <li>{{jsxref("Global_Objects/eval", "eval()")}}</li> - <li>{{jsxref("Global_Objects/uneval", "uneval()")}} {{non-standard_inline}}</li> - <li>{{jsxref("Global_Objects/isFinite", "isFinite()")}}</li> - <li>{{jsxref("Global_Objects/isNaN", "isNaN()")}}</li> - <li>{{jsxref("Global_Objects/parseFloat", "parseFloat()")}}</li> - <li>{{jsxref("Global_Objects/parseInt", "parseInt()")}}</li> - <li>{{jsxref("Global_Objects/decodeURI", "decodeURI()")}}</li> - <li>{{jsxref("Global_Objects/decodeURIComponent", "decodeURIComponent()")}}</li> - <li>{{jsxref("Global_Objects/encodeURI", "encodeURI()")}}</li> - <li>{{jsxref("Global_Objects/encodeURIComponent", "encodeURIComponent()")}}</li> - <li>{{jsxref("Global_Objects/escape", "escape()")}} {{deprecated_inline}}</li> - <li>{{jsxref("Global_Objects/unescape", "unescape()")}} {{deprecated_inline}}</li> -</ul> - -<h3 id="Fundamental_objects">Fundamental objects</h3> - -<p>These are the fundamental, basic objects upon which all other objects are based. This includes objects that represent general objects, functions, and errors.</p> - -<ul> - <li>{{jsxref("Object")}}</li> - <li>{{jsxref("Function")}}</li> - <li>{{jsxref("Boolean")}}</li> - <li>{{jsxref("Symbol")}} {{experimental_inline}}</li> - <li>{{jsxref("Error")}}</li> - <li>{{jsxref("EvalError")}}</li> - <li>{{jsxref("InternalError")}}</li> - <li>{{jsxref("RangeError")}}</li> - <li>{{jsxref("ReferenceError")}}</li> - <li>{{jsxref("SyntaxError")}}</li> - <li>{{jsxref("TypeError")}}</li> - <li>{{jsxref("URIError")}}</li> -</ul> - -<h3 id="Numbers_and_dates">Numbers and dates</h3> - -<p>These are the base objects representing numbers, dates, and mathematical calculations.</p> - -<ul> - <li>{{jsxref("Number")}}</li> - <li>{{jsxref("Math")}}</li> - <li>{{jsxref("Date")}}</li> -</ul> - -<h3 id="Text_processing">Text processing</h3> - -<p>These objects represent strings and support manipulating them.</p> - -<ul> - <li>{{jsxref("String")}}</li> - <li>{{jsxref("RegExp")}}</li> -</ul> - -<h3 id="Indexed_collections">Indexed collections</h3> - -<p>These objects represent collections of data which are ordered by an index value. This includes (typed) arrays and array-like constructs.</p> - -<ul> - <li>{{jsxref("Array")}}</li> - <li>{{jsxref("Int8Array")}}</li> - <li>{{jsxref("Uint8Array")}}</li> - <li>{{jsxref("Uint8ClampedArray")}}</li> - <li>{{jsxref("Int16Array")}}</li> - <li>{{jsxref("Uint16Array")}}</li> - <li>{{jsxref("Int32Array")}}</li> - <li>{{jsxref("Uint32Array")}}</li> - <li>{{jsxref("Float32Array")}}</li> - <li>{{jsxref("Float64Array")}}</li> -</ul> - -<h3 id="Keyed_collections">Keyed collections</h3> - -<p>These objects represent collections which use keys; these contain elements which are iterable in the order of insertion.</p> - -<ul> - <li>{{jsxref("Map")}} {{experimental_inline}}</li> - <li>{{jsxref("Set")}} {{experimental_inline}}</li> - <li>{{jsxref("WeakMap")}} {{experimental_inline}}</li> - <li>{{jsxref("WeakSet")}} {{experimental_inline}}</li> -</ul> - -<h3 id="Vector_collections">Vector collections</h3> - -<p>{{Glossary("SIMD")}} vector data types are objects where data is arranged into lanes.</p> - -<ul> - <li>{{jsxref("SIMD")}} {{experimental_inline}}</li> - <li>{{jsxref("float32x4", "SIMD.float32x4")}} {{experimental_inline}}</li> - <li>{{jsxref("float64x2", "SIMD.float64x2")}} {{experimental_inline}}</li> - <li>{{jsxref("int8x16", "SIMD.int8x16")}} {{experimental_inline}}</li> - <li>{{jsxref("int16x8", "SIMD.int16x8")}} {{experimental_inline}}</li> - <li>{{jsxref("int32x4", "SIMD.int32x4")}} {{experimental_inline}}</li> -</ul> - -<h3 id="Structured_data">Structured data</h3> - -<p>These objects represent and interact with structured data buffers and data coded using JavaScript Object Notation (JSON).</p> - -<ul> - <li>{{jsxref("ArrayBuffer")}}</li> - <li>{{jsxref("DataView")}}</li> - <li>{{jsxref("JSON")}}</li> -</ul> - -<h3 id="Control_abstraction_objects">Control abstraction objects</h3> - -<ul> - <li>{{jsxref("Promise")}} {{experimental_inline}}</li> - <li>{{jsxref("Generator")}} {{experimental_inline}}</li> - <li>{{jsxref("GeneratorFunction")}} {{experimental_inline}}</li> -</ul> - -<h3 id="Reflection">Reflection</h3> - -<ul> - <li>{{jsxref("Reflect")}} {{experimental_inline}}</li> - <li>{{jsxref("Proxy")}} {{experimental_inline}}</li> -</ul> - -<h3 id="Internationalization">Internationalization</h3> - -<p>Additions to the ECMAScript core for language-sensitive functionalities.</p> - -<ul> - <li>{{jsxref("Intl")}}</li> - <li>{{jsxref("Global_Objects/Collator", "Intl.Collator")}}</li> - <li>{{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}}</li> - <li>{{jsxref("Global_Objects/NumberFormat", "Intl.NumberFormat")}}</li> -</ul> - -<h3 id="Non-standard_objects">Non-standard objects</h3> - -<ul> - <li>{{jsxref("Iterator")}} {{non-standard_inline}}</li> - <li>{{jsxref("ParallelArray")}} {{non-standard_inline}}</li> - <li>{{jsxref("StopIteration")}} {{non-standard_inline}}</li> -</ul> - -<h3 id="Other">Other</h3> - -<ul> - <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Functions/arguments">arguments</a></code></li> -</ul> -</div> diff --git a/files/bn/web/javascript/reference/global_objects/isfinite/index.html b/files/bn/web/javascript/reference/global_objects/isfinite/index.html deleted file mode 100644 index 0ff5ef06bc..0000000000 --- a/files/bn/web/javascript/reference/global_objects/isfinite/index.html +++ /dev/null @@ -1,130 +0,0 @@ ---- -title: isFinite -slug: Web/JavaScript/Reference/Global_Objects/isFinite -translation_of: Web/JavaScript/Reference/Global_Objects/isFinite ---- -<div> -<div> -<div>{{jsSidebar("Objects")}}</div> -</div> -</div> - -<h3 id="Summary" name="Summary">সারসংক্ষেপ</h3> - -<p>একটি আর্গুমেন্টকে যাচাই করে বলে এটি সসীম সংখ্যা কিনা।</p> - -<h3 id="Syntax" name="Syntax">সিনট্যাক্স</h3> - -<p><code>isFinite(<em>number</em>) </code></p> - -<h3 id="Parameters" name="Parameters">প্যারামিটার</h3> - -<dl> - <dt><code>number</code></dt> - <dd>যে সংখ্যাটিকে যাচাই করতে হবে।</dd> -</dl> - -<h3 id="Description" name="Description">বিবরণ</h3> - -<p><code>isFinite</code> একটি টপ লেভেল ফাংশন এবং কোন অবজেক্টের সঙ্গে সংশ্লিষ্ট নয়।</p> - -<p>এই ফাংশনটির সাহায্যে আপনি জানতে পারবেন কোন সংখ্যা সসীম সংখ্যা কিনা। <code>isFinite</code> এর আর্গুমেন্টে আসা সংখ্যাটিকে পরীক্ষা করে দেখে। আর্গুমেন্টটি <code>NaN, ধনাত্বক অসীম অথবা ঋণাত্মক অসীম হলে এই মেথডটি</code> <code>false</code> রিটার্ন করে; নয়তো <code>true</code> রিটার্ন করে।</p> - -<h3 id="Examples" name="Examples">উদাহরণ</h3> - -<h4 id="Example:_Using_isFinite" name="Example:_Using_isFinite">উদাহরণ: <code>isFinite</code> ব্যবহার করা</h4> - -<p>আপনি আপনার ক্লায়েন্টের ইনপুট নিয়ে পরীক্ষা করে দেখতে পারেন তা সসীম সংখ্যা কিনা।</p> - -<pre class="brush: js">if (isFinite(ClientInput)) { - /* take specific steps */ -} -</pre> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>ECMAScript 2nd Edition.</td> - <td>Standard</td> - <td>Initial definition.</td> - </tr> - <tr> - <td>{{SpecName('ES5.1', '#sec-15.1.2.5', 'isFinite')}}</td> - <td>{{Spec2('ES5.1')}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-isfinite-number', 'isFinite')}}</td> - <td>{{Spec2('ES6')}}</td> - <td> </td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - -<p>{{ CompatibilityTable() }}</p> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{ CompatVersionUnknown() }}</td> - <td>{{ CompatVersionUnknown() }}</td> - <td>{{ CompatVersionUnknown() }}</td> - <td>{{ CompatVersionUnknown() }}</td> - <td>{{ CompatVersionUnknown() }}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Chrome for Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{ CompatVersionUnknown() }}</td> - <td>{{ CompatVersionUnknown() }}</td> - <td>{{ CompatVersionUnknown() }}</td> - <td>{{ CompatVersionUnknown() }}</td> - <td>{{ CompatVersionUnknown() }}</td> - <td>{{ CompatVersionUnknown() }}</td> - </tr> - </tbody> -</table> -</div> - -<h2 id="See_Also" name="See_Also">See also</h2> - -<ul> - <li>{{jsxref("Number.isFinite()")}}</li> - <li>{{jsxref("Number.NaN()")}}</li> - <li>{{jsxref("Number.POSITIVE_INFINITY")}}</li> - <li>{{jsxref("Number.NEGATIVE_INFINITY")}}</li> -</ul> diff --git a/files/bn/web/javascript/reference/global_objects/number/index.html b/files/bn/web/javascript/reference/global_objects/number/index.html deleted file mode 100644 index a4740d7dab..0000000000 --- a/files/bn/web/javascript/reference/global_objects/number/index.html +++ /dev/null @@ -1,218 +0,0 @@ ---- -title: Number -slug: Web/JavaScript/Reference/Global_Objects/Number -tags: - - JavaScript - - JavaScript Reference - - Number - - Reference - - Référence(2) -translation_of: Web/JavaScript/Reference/Global_Objects/Number ---- -<div>{{JSRef}}</div> - -<p>The <strong><code>Number</code></strong> JavaScript object is a wrapper object allowing you to work with numerical values. A <code>Number</code> object is created using the <code>Number()</code> constructor.</p> - -<h2 id="Syntax" name="Syntax">Constructor</h2> - -<pre class="syntaxbox">new Number(value);</pre> - -<h3 id="Parameters" name="Parameters">Parameters</h3> - -<dl> - <dt><code>value</code></dt> - <dd>The numeric value of the object being created.</dd> -</dl> - -<h2 id="Description" name="Description">Description</h2> - -<p>The primary uses for the <code>Number</code> object are:</p> - -<ul> - <li>If the argument cannot be converted into a number, it returns {{jsxref("Global_Objects/NaN", "NaN")}}.</li> - <li>In a non-constructor context (i.e., without the {{jsxref("Operators/new", "new")}} operator), <code>Number</code> can be used to perform a type conversion.</li> -</ul> - -<h2 id="Properties" name="Properties">Properties</h2> - -<dl> - <dt>{{jsxref("Number.EPSILON")}} {{experimental_inline}}</dt> - <dd>The smallest interval between two representable numbers.</dd> - <dt>{{jsxref("Number.MAX_SAFE_INTEGER")}} {{experimental_inline}}</dt> - <dd>The maximum safe integer in JavaScript (<code>2<sup>53</sup> - 1</code>).</dd> - <dt>{{jsxref("Number.MAX_VALUE")}}</dt> - <dd>The largest positive representable number.</dd> - <dt>{{jsxref("Number.MIN_SAFE_INTEGER")}} {{experimental_inline}}</dt> - <dd>The minimum safe integer in JavaScript (<code>-(2<sup>53</sup> - 1)</code>).</dd> - <dt>{{jsxref("Number.MIN_VALUE")}}</dt> - <dd>The smallest positive representable number - that is, the positive number closest to zero (without actually being zero).</dd> - <dt>{{jsxref("Number.NaN")}}</dt> - <dd>Special "not a number" value.</dd> - <dt>{{jsxref("Number.NEGATIVE_INFINITY")}}</dt> - <dd>Special value representing negative infinity; returned on overflow.</dd> - <dt>{{jsxref("Number.POSITIVE_INFINITY")}}</dt> - <dd>Special value representing infinity; returned on overflow.</dd> - <dt>{{jsxref("Number.prototype")}}</dt> - <dd>Allows the addition of properties to a <code>Number</code> object.</dd> -</dl> - -<div>{{jsOverrides("Function", "properties", "MAX_VALUE", "MIN_VALUE", "NaN", "NEGATIVE_INFINITY", "POSITIVE_INFINITY", "protoype")}}</div> - -<h2 id="Methods" name="Methods">Methods</h2> - -<dl> - <dt>{{jsxref("Number.isNaN()")}} {{experimental_inline}}</dt> - <dd>Determine whether the passed value is NaN.</dd> - <dt>{{jsxref("Number.isFinite()")}} {{experimental_inline}}</dt> - <dd>Determine whether the passed value is a finite number.</dd> - <dt>{{jsxref("Number.isInteger()")}} {{experimental_inline}}</dt> - <dd>Determine whether the passed value is an integer.</dd> - <dt>{{jsxref("Number.isSafeInteger()")}} {{experimental_inline}}</dt> - <dd>Determine whether the passed value is a safe integer (number between <code>-(2<sup>53</sup> - 1)</code> and <code>2<sup>53</sup> - 1</code>).</dd> - <dt><s class="obsoleteElement">{{jsxref("Number.toInteger()")}} {{obsolete_inline}}</s></dt> - <dd><s class="obsoleteElement">Used to evaluate the passed value and convert it to an integer (or {{jsxref("Global_Objects/Infinity", "Infinity")}}), but has been removed.</s></dd> - <dt>{{jsxref("Number.parseFloat()")}} {{experimental_inline}}</dt> - <dd>The value is the same as {{jsxref("Global_Objects/parseFloat", "parseFloat")}} of the global object.</dd> - <dt>{{jsxref("Number.parseInt()")}} {{experimental_inline}}</dt> - <dd>The value is the same as {{jsxref("Global_Objects/parseInt", "parseInt")}} of the global object.</dd> -</dl> - -<div>{{jsOverrides("Function", "Methods", "isNaN")}}</div> - -<h2 id="Number_instances" name="Number_instances"><code>Number</code> instances</h2> - -<p>All <code>Number</code> instances inherit from {{jsxref("Number.prototype")}}. The prototype object of the <code>Number</code> constructor can be modified to affect all <code>Number</code> instances.</p> - -<h3 id="Methods_of_Number_instance" name="Methods_of_Number_instance">Methods</h3> - -<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/prototype', 'Methods')}}</div> - -<h2 id="Examples" name="Examples">Examples</h2> - -<h3 id="Example:_Using_the_Number_object_to_assign_values_to_numeric_variables" name="Example:_Using_the_Number_object_to_assign_values_to_numeric_variables">Example: Using the <code>Number</code> object to assign values to numeric variables</h3> - -<p>The following example uses the <code>Number</code> object's properties to assign values to several numeric variables:</p> - -<pre class="brush: js">var biggestNum = Number.MAX_VALUE; -var smallestNum = Number.MIN_VALUE; -var infiniteNum = Number.POSITIVE_INFINITY; -var negInfiniteNum = Number.NEGATIVE_INFINITY; -var notANum = Number.NaN; -</pre> - -<h3 id="Example:_Using_Number_to_convert_a_Date_object" name="Example:_Using_Number_to_convert_a_Date_object">Example: Integer range for <code>Number</code></h3> - -<p>The following example shows minimum and maximum integer values that can be represented as <code>Number</code> object (for details, refer to EcmaScript standard, chapter <em>8.5 The Number Type</em>):</p> - -<pre class="brush: js">var biggestInt = 9007199254740992; -var smallestInt = -9007199254740992; -</pre> - -<p>When parsing data that has been serialized to JSON, integer values falling out of this range can be expected to become corrupted when JSON parser coerces them to <code>Number</code> type. Using {{jsxref("Global_Objects/String", "String")}} instead is a possible workaround.</p> - -<h3 id="Example:_Using_Number_to_convert_a_Date_object" name="Example:_Using_Number_to_convert_a_Date_object">Example: Using <code>Number</code> to convert a <code>Date</code> object</h3> - -<p>The following example converts the {{jsxref("Global_Objects/Date", "Date")}} object to a numerical value using <code>Number</code> as a function:</p> - -<pre class="brush: js">var d = new Date('December 17, 1995 03:24:00'); -print(Number(d)); -</pre> - -<p>This displays "819199440000".</p> - -<h3 id="Example_Convert_numeric_strings_to_numbers">Example: Convert numeric strings to numbers</h3> - -<pre class="brush: js">Number("123") // 123 -Number("") // 0 -Number("0x11") // 17 -Number("0b11") // 3 -Number("0o11") // 9 -Number("foo") // NaN -Number("100a") // NaN -</pre> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>ECMAScript 1st Edition.</td> - <td>Standard</td> - <td>Initial definition. Implemented in JavaScript 1.1.</td> - </tr> - <tr> - <td>{{SpecName('ES5.1', '#sec-15.7', 'Number')}}</td> - <td>{{Spec2('ES5.1')}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-number-objects', 'Number')}}</td> - <td>{{Spec2('ES6')}}</td> - <td>New methods and properties added: ({{jsxref("Number.EPSILON", "EPSILON")}}, {{jsxref("Number.isFinite", "isFinite")}}, {{jsxref("Number.isInteger", "isInteger")}}, {{jsxref("Number.isNaN", "isNaN")}}, {{jsxref("Number.parseFloat", "parseFloat")}}, {{jsxref("Number.parseInt", "parseInt")}})</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - -<div>{{CompatibilityTable}}</div> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Chrome for Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - <td>{{CompatVersionUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<h2 id="See_also" name="See_also">See also</h2> - -<ul> - <li>{{jsxref("Global_Objects/NaN", "NaN")}}</li> - <li>The {{jsxref("Global_Objects/Math", "Math")}} global object</li> -</ul> diff --git a/files/bn/web/javascript/reference/global_objects/number/isfinite/index.html b/files/bn/web/javascript/reference/global_objects/number/isfinite/index.html deleted file mode 100644 index 0ad18815ef..0000000000 --- a/files/bn/web/javascript/reference/global_objects/number/isfinite/index.html +++ /dev/null @@ -1,125 +0,0 @@ ---- -title: Number.isFinite -slug: Web/JavaScript/Reference/Global_Objects/Number/isFinite -translation_of: Web/JavaScript/Reference/Global_Objects/Number/isFinite ---- -<div> -<div>{{JSRef}}</div> -</div> - -<h2 id="সারসংক্ষেপ">সারসংক্ষেপ</h2> - -<p>পাস করা ভ্যালু সসীম কিনা তা জানায়। গ্লোবাল <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/isFinite"><code>isFinite</code></a> এর উন্নততর সংস্করণ।</p> - -<h2 id="Syntax" name="Syntax">সিনট্যাক্স</h2> - -<pre class="syntaxbox"><code>Number.isFinite(test<em>Value</em>);</code></pre> - -<h3 id="Parameters" name="Parameters">প্যারামিটার</h3> - -<dl> - <dt><code>test<em>Value</em></code></dt> - <dd>সে সংখ্যা পরীক্ষা করে বলা হবে সসীম কিনা।</dd> -</dl> - -<h2 id="বিবরণ">বিবরণ</h2> - -<p>গ্লোবাল <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/isFinite"><code>isFinite</code></a> ফাংশনটির সঙ্গে তুলনা করে বলা যায়, এই মেথডটি জোর পূর্বক প্যারামিটারকে সংখ্যার রুপান্তর করে না। কেবলমাত্র যে সকল নাম্বার টাইপের আর্গুমেন্ট সসীম সংখ্যা হবে, তাদের জন্যই মেথডটি <code>true</code> রিটার্ন করবে।</p> - -<h2 id="উদাহরণ">উদাহরণ</h2> - -<pre class="brush:js;">Number.isFinite(Infinity); // false -Number.isFinite(NaN); // false -Number.isFinite(-Infinity); // false - -// all other numbers true -Number.isFinite(0); -Number.isFinite(2e64); - -// everything else is false -Number.isFinite("0"); // false, would've been true with global isFinite -</pre> - -<h2 id="Polyfill">Polyfill</h2> - -<pre class="brush: js">Number.isFinite = Number.isFinite || function(value) { - return typeof value === "number" && isFinite(value); -} -</pre> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td> - <p>{{SpecName('ES6', '#sec-number.isfinite', 'Number.isInteger')}}</p> - </td> - <td>{{Spec2('ES6')}}</td> - <td>Initial definition.</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility" name="Browser_compatibility">Browser compatibility</h2> - -<div>{{CompatibilityTable}}</div> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatChrome("19")}}</td> - <td>{{CompatGeckoDesktop("16")}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatOpera("15")}}</td> - <td>{{CompatNo}}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Chrome for Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatGeckoMobile("16")}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - <td>{{CompatUnknown}}</td> - </tr> - </tbody> -</table> -</div> - -<h2 id="See_also" name="See_also">See also</h2> - -<ul> - <li>The {{jsxref("Global_Objects/Number", "Number")}} object it belongs to.</li> -</ul> diff --git a/files/bn/web/javascript/reference/index.html b/files/bn/web/javascript/reference/index.html deleted file mode 100644 index e749b0831e..0000000000 --- a/files/bn/web/javascript/reference/index.html +++ /dev/null @@ -1,48 +0,0 @@ ---- -title: জাভাস্ক্রিপ্ট রেফারেন্স -slug: Web/JavaScript/Reference -tags: - - JavaScript -translation_of: Web/JavaScript/Reference ---- -<div>{{JsSidebar}}</div> - -<p>This part of the JavaScript section on MDN serves as a repository of facts about the JavaScript language. Read more <a href="/en-US/docs/Web/JavaScript/Reference/About">about this reference</a>.</p> - -<h2 id="Global_Objects">Global Objects</h2> - -<p>This chapter documents all the <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects">JavaScript standard built-in objects</a>, along with their methods and properties.</p> - -<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects', 'Standard objects (by category)')}}</div> - -<h2 id="Statements">Statements</h2> - -<p>This chapter documents all the <a href="/en-US/docs/Web/JavaScript/Reference/Statements">JavaScript statements and declarations</a>.</p> - -<div>{{page('/en-US/docs/Web/JavaScript/Reference/Statements', 'Statements_and_declarations_by_category')}}</div> - -<h2 id="Expressions_and_operators">Expressions and operators</h2> - -<p>This chapter documents all the <a href="/en-US/docs/Web/JavaScript/Reference/Operators">JavaScript expressions and operators</a>.</p> - -<div>{{page('/en-US/docs/Web/JavaScript/Reference/Operators', 'Expressions_and_operators_by_category')}}</div> - -<h2 id="Functions">Functions</h2> - -<p>This chapter documents how to work with <a href="/en-US/docs/Web/JavaScript/Reference/Functions">JavaScript functions</a> to develop your applications.</p> - -<ul> - <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions/arguments"><code>arguments</code></a></li> - <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">Arrow functions</a></li> - <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions/Default_parameters">Default parameters</a></li> - <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters">Rest parameters</a></li> -</ul> - -<h2 id="Additional_reference_pages">Additional reference pages</h2> - -<ul> - <li><a href="/en-US/docs/Web/JavaScript/Reference/Lexical_grammar">Lexical grammar</a></li> - <li><a href="/en-US/docs/Web/JavaScript/Data_structures">Data types and data structures</a></li> - <li><a href="/en-US/docs/Web/JavaScript/Reference/Strict_mode">Strict mode</a></li> - <li><a href="/en-US/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features">Deprecated features</a></li> -</ul> diff --git a/files/bn/web/javascript/reference/statements/index.html b/files/bn/web/javascript/reference/statements/index.html deleted file mode 100644 index cfda7a107f..0000000000 --- a/files/bn/web/javascript/reference/statements/index.html +++ /dev/null @@ -1,127 +0,0 @@ ---- -title: জাভাস্ক্রিপ্ট স্টেটমেন্ট সমুহ -slug: Web/JavaScript/Reference/statements -tags: - - JavaScript -translation_of: Web/JavaScript/Reference/Statements ---- -<div>{{jsSidebar("Statements")}}</div> - -<p>জাভাস্ক্রিপ্ট স্টেটমেন্ট এর মধ্যে কিওয়ার্ড থাকে, যা যথাযথ সিনট্যাক্স এর সাথে ব্যবহার করা হয়। একটি একক স্টেটমেন্ট এর মধ্যে একাধিক লাইন থাকতে পারে। সেমিকোলন দিয়ে আলাদা করা হলে একাধিক স্টেটমেন্ট এক লাইনেই লেখা সম্ভব। এক্ষেত্রে একটি কিওয়ার্ড হবে না, কিওয়ার্ড এর একটি গ্রুপ হবে।</p> - -<h2 id="Statements_and_declarations_by_category">Statements and declarations by category</h2> - -<p>For an alphabetical listing see the sidebar on the left.</p> - -<h3 id="Control_flow">Control flow</h3> - -<dl> - <dt>{{jsxref("Statements/block", "Block")}}</dt> - <dd>A block statement is used to group zero or more statements. The block is delimited by a pair of curly brackets.</dd> - <dt>{{jsxref("Statements/break", "break")}}</dt> - <dd>Terminates the current loop, switch, or label statement and transfers program control to the statement following the terminated statement.</dd> - <dt>{{jsxref("Statements/continue", "continue")}}</dt> - <dd>Terminates execution of the statements in the current iteration of the current or labeled loop, and continues execution of the loop with the next iteration.</dd> - <dt>{{jsxref("Statements/Empty", "Empty")}}</dt> - <dd>An empty statement is used to provide no statement, although the JavaScript syntax would expect one.</dd> - <dt>{{jsxref("Statements/if...else", "if...else")}}</dt> - <dd>Executes a statement if a specified condition is true. If the condition is false, another statement can be executed.</dd> - <dt>{{jsxref("Statements/switch", "switch")}}</dt> - <dd>Evaluates an expression, matching the expression's value to a case clause, and executes statements associated with that case.</dd> - <dt>{{jsxref("Statements/throw", "throw")}}</dt> - <dd>Throws a user-defined exception.</dd> - <dt>{{jsxref("Statements/try...catch", "try...catch")}}</dt> - <dd>Marks a block of statements to try, and specifies a response, should an exception be thrown.</dd> -</dl> - -<h3 id="Declarations">Declarations</h3> - -<dl> - <dt>{{jsxref("Statements/var", "var")}}</dt> - <dd>Declares a variable, optionally initializing it to a value.</dd> - <dt>{{experimental_inline}} {{jsxref("Statements/let", "let")}}</dt> - <dd>Declares a block scope local variable, optionally initializing it to a value.</dd> - <dt>{{experimental_inline}} {{jsxref("Statements/const", "const")}}</dt> - <dd>Declares a read-only named constant.</dd> -</dl> - -<h3 id="Functions_and_classes">Functions and classes</h3> - -<dl> - <dt>{{jsxref("Statements/function", "function")}}</dt> - <dd>Declares a function with the specified parameters.</dd> - <dt>{{experimental_inline}} {{jsxref("Statements/function*", "function*")}}</dt> - <dd>Generators functions enable writing <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/The_Iterator_protocol">iterators</a> more easily.</dd> - <dt>{{jsxref("Statements/return", "return")}}</dt> - <dd>Specifies the value to be returned by a function.</dd> - <dt>{{experimental_inline}} {{jsxref("Statements/class", "class")}}</dt> - <dd>Declares a class.</dd> -</dl> - -<h3 id="Iterations">Iterations</h3> - -<dl> - <dt>{{jsxref("Statements/do...while", "do...while")}}</dt> - <dd>Creates a loop that executes a specified statement until the test condition evaluates to false. The condition is evaluated after executing the statement, resulting in the specified statement executing at least once.</dd> - <dt>{{jsxref("Statements/for", "for")}}</dt> - <dd>Creates a loop that consists of three optional expressions, enclosed in parentheses and separated by semicolons, followed by a statement executed in the loop.</dd> - <dt>{{deprecated_inline}} {{non-standard_inline()}} {{jsxref("Statements/for_each...in", "for each...in")}}</dt> - <dd>Iterates a specified variable over all values of object's properties. For each distinct property, a specified statement is executed.</dd> - <dt>{{jsxref("Statements/for...in", "for...in")}}</dt> - <dd>Iterates over the enumerable properties of an object, in arbitrary order. For each distinct property, statements can be executed.</dd> - <dt>{{experimental_inline}} {{jsxref("Statements/for...of", "for...of")}}</dt> - <dd>Iterates over iterable objects (including <a href="https://developer.mozilla.org/en-US/docs/Core_JavaScript_1.5_Reference/Global_Objects/Array" title="Array">arrays</a>, array-like objects, <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Guide/Iterators_and_Generators" title="Iterators and generators">iterators and generators</a>), invoking a custom iteration hook with statements to be executed for the value of each distinct property.</dd> - <dt>{{jsxref("Statements/while", "while")}}</dt> - <dd>Creates a loop that executes a specified statement as long as the test condition evaluates to true. The condition is evaluated before executing the statement.</dd> -</dl> - -<h3 id="Others">Others</h3> - -<dl> - <dt>{{jsxref("Statements/debugger", "debugger")}}</dt> - <dd>Invokes any available debugging functionality. If no debugging functionality is available, this statement has no effect.</dd> - <dt>{{experimental_inline}} {{jsxref("Statements/export", "export")}}</dt> - <dd>Used to export functions to make them available for imports in external modules, another scripts.</dd> - <dt>{{experimental_inline}} {{jsxref("Statements/import", "import")}}</dt> - <dd>Used to import functions exported from an external module, another script.</dd> - <dt>{{jsxref("Statements/label", "label")}}</dt> - <dd>Provides a statement with an identifier that you can refer to using a <code>break</code> or <code>continue</code> statement.</dd> -</dl> - -<dl> - <dt>{{deprecated_inline}} {{jsxref("Statements/with", "with")}}</dt> - <dd>Extends the scope chain for a statement.</dd> -</dl> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>ECMAScript 1st Edition.</td> - <td>Standard</td> - <td>Initial definition.</td> - </tr> - <tr> - <td>{{SpecName('ES5.1', '#sec-12', 'Statements')}}</td> - <td>{{Spec2('ES5.1')}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName('ES6', '#sec-ecmascript-language-statements-and-declarations', 'ECMAScript Language: Statements and Declarations')}}</td> - <td>{{Spec2('ES6')}}</td> - <td>New: function*, let, for...of, yield, class</td> - </tr> - </tbody> -</table> - -<h2 id="See_also">See also</h2> - -<ul> - <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators">Operators</a></li> -</ul> diff --git a/files/bn/web/javascript/typed_arrays/index.html b/files/bn/web/javascript/typed_arrays/index.html deleted file mode 100644 index 8bcdf2a39d..0000000000 --- a/files/bn/web/javascript/typed_arrays/index.html +++ /dev/null @@ -1,268 +0,0 @@ ---- -title: JavaScript typed arrays -slug: Web/JavaScript/Typed_arrays -translation_of: Web/JavaScript/Typed_arrays ---- -<div>Swa{{JsSidebar("Advanced")}}</div> - -<p><span class="seoSummary"><strong>JavaScript typed arrays</strong> are array-like objects that provide a mechanism for reading and writing raw binary data in memory buffers.</span> As you may already know, {{jsxref("Array")}} objects grow and shrink dynamically and can have any JavaScript value. JavaScript engines perform optimizations so that these arrays are fast.</p> - -<p>However, as web applications become more and more powerful, adding features such as audio and video manipulation, access to raw data using WebSockets, and so forth, it has become clear that there are times when it would be helpful for JavaScript code to be able to quickly and easily manipulate raw binary data. This is where typed arrays come in. Each entry in a JavaScript typed array is a raw binary value in one of a number of supported formats, from 8-bit integers to 64-bit floating-point numbers.</p> - -<p>However, typed arrays are <em>not</em> to be confused with normal arrays, as calling {{jsxref("Array.isArray()")}} on a typed array returns <code>false</code>. Moreover, not all methods available for normal arrays are supported by typed arrays (e.g. push and pop).</p> - -<h2 id="Buffers_and_views_typed_array_architecture">Buffers and views: typed array architecture</h2> - -<p>To achieve maximum flexibility and efficiency, JavaScript typed arrays split the implementation into <strong>buffers</strong> and <strong>views</strong>. A buffer (implemented by the {{jsxref("ArrayBuffer")}} object) is an object representing a chunk of data; it has no format to speak of and offers no mechanism for accessing its contents. In order to access the memory contained in a buffer, you need to use a view. A view provides a context — that is, a data type, starting offset, and the number of elements — that turns the data into a typed array.</p> - -<p><img alt="Typed arrays in an ArrayBuffer" src="https://mdn.mozillademos.org/files/8629/typed_arrays.png" style="height: 278px; width: 666px;"></p> - -<h3 id="ArrayBuffer">ArrayBuffer</h3> - -<p>The {{jsxref("ArrayBuffer")}} is a data type that is used to represent a generic, fixed-length binary data buffer. You can't directly manipulate the contents of an <code>ArrayBuffer</code>; instead, you create a typed array view or a {{jsxref("DataView")}} which represents the buffer in a specific format, and use that to read and write the contents of the buffer.</p> - -<h3 id="Typed_array_views">Typed array views</h3> - -<p>Typed array views have self-descriptive names and provide views for all the usual numeric types like <code>Int8</code>, <code>Uint32</code>, <code>Float64</code> and so forth. There is one special typed array view, the <code>Uint8ClampedArray</code>. It clamps the values between 0 and 255. This is useful for <a href="/en-US/docs/Web/API/ImageData">Canvas data processing</a>, for example.</p> - -<table class="standard-table"> - <thead> - <tr> - <th class="header" scope="col">Type</th> - <th class="header" scope="col">Value Range</th> - <th class="header" scope="col">Size in bytes</th> - <th class="header" scope="col">Description</th> - <th class="header" scope="col">Web IDL type</th> - <th class="header" scope="col">Equivalent C type</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{jsxref("Int8Array")}}</td> - <td><code>-128</code> to <code>127</code></td> - <td>1</td> - <td>8-bit two's complement signed integer</td> - <td><code>byte</code></td> - <td><code>int8_t</code></td> - </tr> - <tr> - <td>{{jsxref("Uint8Array")}}</td> - <td><code>0</code> to <code>255</code></td> - <td>1</td> - <td>8-bit unsigned integer</td> - <td><code>octet</code></td> - <td><code>uint8_t</code></td> - </tr> - <tr> - <td>{{jsxref("Uint8ClampedArray")}}</td> - <td><code>0</code> to <code>255</code></td> - <td>1</td> - <td>8-bit unsigned integer (clamped)</td> - <td><code>octet</code></td> - <td><code>uint8_t</code></td> - </tr> - <tr> - <td>{{jsxref("Int16Array")}}</td> - <td><code>-32768</code> to <code>32767</code></td> - <td>2</td> - <td>16-bit two's complement signed integer</td> - <td><code>short</code></td> - <td><code>int16_t</code></td> - </tr> - <tr> - <td>{{jsxref("Uint16Array")}}</td> - <td><code>0</code> to <code>65535</code></td> - <td>2</td> - <td>16-bit unsigned integer</td> - <td><code>unsigned short</code></td> - <td><code>uint16_t</code></td> - </tr> - <tr> - <td>{{jsxref("Int32Array")}}</td> - <td><code>-2147483648</code> to <code>2147483647</code></td> - <td>4</td> - <td>32-bit two's complement signed integer</td> - <td><code>long</code></td> - <td><code>int32_t</code></td> - </tr> - <tr> - <td>{{jsxref("Uint32Array")}}</td> - <td><code>0</code> to <code>4294967295</code></td> - <td>4</td> - <td>32-bit unsigned integer</td> - <td><code>unsigned long</code></td> - <td><code>uint32_t</code></td> - </tr> - <tr> - <td>{{jsxref("Float32Array")}}</td> - <td><code>1.2</code><span style="">×</span><code>10<sup>-38</sup></code> to <code>3.4</code><span style="">×</span><code>10<sup>38</sup></code></td> - <td>4</td> - <td>32-bit IEEE floating point number (7 significant digits e.g., <code>1.123456</code>)</td> - <td><code>unrestricted float</code></td> - <td><code>float</code></td> - </tr> - <tr> - <td>{{jsxref("Float64Array")}}</td> - <td><code>5.0</code><span style="">×</span><code>10<sup>-324</sup></code> to <code>1.8</code><span style="">×</span><code>10<sup>308</sup></code></td> - <td>8</td> - <td>64-bit IEEE floating point number (16 significant digits e.g., <code>1.123...15</code>)</td> - <td><code>unrestricted double</code></td> - <td><code>double</code></td> - </tr> - <tr> - <td>{{jsxref("BigInt64Array")}}</td> - <td><code>-2<sup>63</sup></code> to <code>2<sup>63</sup>-1</code></td> - <td>8</td> - <td>64-bit two's complement signed integer</td> - <td><code>bigint</code></td> - <td><code>int64_t (signed long long)</code></td> - </tr> - <tr> - <td>{{jsxref("BigUint64Array")}}</td> - <td><code>0</code> to <code>2<sup>64</sup>-1</code></td> - <td>8</td> - <td>64-bit unsigned integer</td> - <td><code>bigint</code></td> - <td><code>uint64_t (unsigned long long)</code></td> - </tr> - </tbody> -</table> - -<h3 id="DataView">DataView</h3> - -<p>The {{jsxref("DataView")}} is a low-level interface that provides a getter/setter API to read and write arbitrary data to the buffer. This is useful when dealing with different types of data, for example. Typed array views are in the native byte-order (see <a href="/en-US/docs/Glossary/Endianness">Endianness</a>) of your platform. With a <code>DataView</code> you are able to control the byte-order. It is big-endian by default and can be set to little-endian in the getter/setter methods.</p> - -<h2 id="Web_APIs_using_typed_arrays">Web APIs using typed arrays</h2> - -<p>These are some examples of APIs that make use of typed arrays; there are others, and more are being added all the time.</p> - -<dl> - <dt><a href="/en-US/docs/Web/API/FileReader#readAsArrayBuffer()" title="/en-US/docs/Web/API/FileReader#readAsArrayBuffer()"><code>FileReader.prototype.readAsArrayBuffer()</code></a></dt> - <dd>The <code>FileReader.prototype.readAsArrayBuffer()</code> method starts reading the contents of the specified <a href="/en-US/docs/Web/API/Blob" title="/en-US/docs/DOM/Blob"><code>Blob</code></a> or <a href="/en-US/docs/Web/API/File" title="/en-US/docs/DOM/File"><code>File</code></a>.</dd> - <dt><a href="/en-US/docs/Web/API/XMLHttpRequest#send()" title="/en-US/docs/Web/API/XMLHttpRequest#send()"><code>XMLHttpRequest.prototype.send()</code></a></dt> - <dd><code>XMLHttpRequest</code> instances' <code>send()</code> method now supports typed arrays and {{jsxref("ArrayBuffer")}} objects as argument.</dd> - <dt><code><a href="https://developer.mozilla.org/en-US/docs/Web/API/ImageData">ImageData.data</a></code></dt> - <dd>Is a {{jsxref("Uint8ClampedArray")}} representing a one-dimensional array containing the data in the RGBA order, with integer values between <code>0</code> and <code>255</code> inclusive.</dd> -</dl> - -<h2 id="Examples">Examples</h2> - -<h3 id="Using_views_with_buffers">Using views with buffers</h3> - -<p>First of all, we will need to create a buffer, here with a fixed length of 16-bytes:</p> - -<pre class="brush:js notranslate">let buffer = new ArrayBuffer(16); -</pre> - -<p>At this point, we have a chunk of memory whose bytes are all pre-initialized to 0. There's not a lot we can do with it, though. We can confirm that it is indeed 16 bytes long, and that's about it:</p> - -<pre class="brush:js notranslate">if (buffer.byteLength === 16) { - console.log("Yes, it's 16 bytes."); -} else { - console.log("Oh no, it's the wrong size!"); -} -</pre> - -<p>Before we can really work with this buffer, we need to create a view. Let's create a view that treats the data in the buffer as an array of 32-bit signed integers:</p> - -<pre class="brush:js notranslate">let int32View = new Int32Array(buffer); -</pre> - -<p>Now we can access the fields in the array just like a normal array:</p> - -<pre class="brush:js notranslate">for (let i = 0; i < int32View.length; i++) { - int32View[i] = i * 2; -} -</pre> - -<p>This fills out the 4 entries in the array (4 entries at 4 bytes each makes 16 total bytes) with the values <code>0</code>, <code>2</code>, <code>4</code>, and <code>6</code>.</p> - -<h3 id="Multiple_views_on_the_same_data">Multiple views on the same data</h3> - -<p>Things start to get really interesting when you consider that you can create multiple views onto the same data. For example, given the code above, we can continue like this:</p> - -<pre class="brush:js notranslate">let int16View = new Int16Array(buffer); - -for (let i = 0; i < int16View.length; i++) { - console.log('Entry ' + i + ': ' + int16View[i]); -} -</pre> - -<p>Here we create a 16-bit integer view that shares the same buffer as the existing 32-bit view and we output all the values in the buffer as 16-bit integers. Now we get the output <code>0</code>, <code>0</code>, <code>2</code>, <code>0</code>, <code>4</code>, <code>0</code>, <code>6</code>, <code>0</code>.</p> - -<p>You can go a step farther, though. Consider this:</p> - -<pre class="brush:js notranslate">int16View[0] = 32; -console.log('Entry 0 in the 32-bit array is now ' + int32View[0]); -</pre> - -<p>The output from this is <code>"Entry 0 in the 32-bit array is now 32"</code>.</p> - -<p>In other words, the two arrays are indeed simply viewed on the same data buffer, treating it as different formats. You can do this with any <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects" title="JavaScript typed arrays/ArrayBufferView#Typed array subclasses">view types</a>.</p> - -<h3 id="Working_with_complex_data_structures">Working with complex data structures</h3> - -<p>By combining a single buffer with multiple views of different types, starting at different offsets into the buffer, you can interact with data objects containing multiple data types. This lets you, for example, interact with complex data structures from <a href="/en-US/docs/Web/WebGL" title="WebGL">WebGL</a>, data files, or C structures you need to use while using <a href="/en-US/docs/Mozilla/js-ctypes" title="js-ctypes">js-ctypes</a>.</p> - -<p>Consider this C structure:</p> - -<pre class="brush:cpp notranslate">struct someStruct { - unsigned long id; - char username[16]; - float amountDue; -};</pre> - -<p>You can access a buffer containing data in this format like this:</p> - -<pre class="brush:js notranslate">let buffer = new ArrayBuffer(24); - -// ... read the data into the buffer ... - -let idView = new Uint32Array(buffer, 0, 1); -let usernameView = new Uint8Array(buffer, 4, 16); -let amountDueView = new Float32Array(buffer, 20, 1);</pre> - -<p>Then you can access, for example, the amount due with <code>amountDueView[0]</code>.</p> - -<div class="note"><strong>Note:</strong> The <a href="http://en.wikipedia.org/wiki/Data_structure_alignment" title="http://en.wikipedia.org/wiki/Data_structure_alignment">data structure alignment</a> in a C structure is platform-dependent. Take precautions and considerations for these padding differences.</div> - -<h3 id="Conversion_to_normal_arrays">Conversion to normal arrays</h3> - -<p>After processing a typed array, it is sometimes useful to convert it back to a normal array in order to benefit from the {{jsxref("Array")}} prototype. This can be done using {{jsxref("Array.from()")}}, or using the following code where <code>Array.from()</code> is unsupported.</p> - -<pre class="brush:js notranslate">let typedArray = new Uint8Array([1, 2, 3, 4]), - normalArray = Array.prototype.slice.call(typedArray); -normalArray.length === 4; -normalArray.constructor === Array; -</pre> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specification</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('ESDraft', '#sec-typedarray-objects', 'TypedArray Objects')}}</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - - - -<p>{{Compat("javascript.builtins.Int8Array")}}</p> - -<h2 id="See_also">See also</h2> - -<ul> - <li><a href="/en-US/docs/Web/JavaScript/Base64_encoding_and_decoding#Appendix.3A_Decode_a_Base64_string_to_Uint8Array_or_ArrayBuffer" title="/en-US/docs/Web/JavaScript/Base64_encoding_and_decoding#Appendix.3A_Decode_a_Base64_string_to_Uint8Array_or_ArrayBuffer">Getting <code>ArrayBuffer</code>s or typed arrays from <em>Base64</em>-encoded strings</a></li> - <li><a href="/en-US/docs/Code_snippets/StringView" title="/en-US/docs/Web/JavaScript/Typed_arrays/StringView"><code>StringView</code> – a C-like representation of strings based on typed arrays</a></li> - <li><a href="https://hacks.mozilla.org/2011/12/faster-canvas-pixel-manipulation-with-typed-arrays">Faster Canvas Pixel Manipulation with Typed Arrays</a></li> - <li><a href="http://www.html5rocks.com/en/tutorials/webgl/typed_arrays">Typed Arrays: Binary Data in the Browser</a></li> - <li><a href="/en-US/docs/Glossary/Endianness">Endianness</a></li> -</ul> |