let আর const: একটা value-র একটা নাম, আর var না কেন

Bob-এর দোকানের program একদম উপরের দিকে একটা ব্যাগের দাম বসায়: 450 টাকা। তিন screen নিচে গিয়ে সে sale-এর দাম হিসাব করে, আর ফলটা আবার ওই একই নামে লিখে দেয়। তারপরের প্রতিটা লাইন sale-এর দামটাই ছাপে, রসিদে তো বটেই, stock-এর হিসাবেও। কিছুই crash করেনি, তাই bug-টা Bob খুঁজে পেল এক সপ্তাহ পরে। এই lesson দেখাবে এক শব্দের সেই বদলটা, যেটা থাকলে ওর program সঙ্গে সঙ্গে থেমে যেত, আর message-এ লাইনটাও দেখিয়ে দিত।

একটা value-র জন্য একটা নাম

Lesson 01 যে সংখ্যাগুলো ছেপেছিল, সেগুলো প্রতিটা লাইনে সরাসরি টাইপ করা ছিল। আসল program-কে একটা value রেখে দিয়ে আবার ব্যবহার করতে হয়। তাই সে value-টাকে একটা নাম দেয়, আর তারপর থেকে ওই নামটাই value-টার হয়ে কথা বলে। যে নাম একটা value ধরে রাখে, তাকে বলে variable।

let price = 450;
console.log(price);
console.log(price * 2);
console.log("Two bags cost", price * 2, "taka");

450
900
Two bags cost 900 taka

প্রথম লাইনটা একটা declaration: এটা price নামটা বানায় আর তাকে 450 value-টা দেয়। এরপর যেখানেই price লেখো, তার মানে "price এই মুহূর্তে যে value ধরে আছে"। console.log(price) ছাপে 450, price শব্দটা না।

let name = value;
const name = value;

তাই declaration একটা নাম একবারই বানায়, আর তারপর থেকে নামটা তার value-র জায়গায় বসে।

let: যে নামের value বদলাতে পারে

let দিয়ে বানানো নামকে পরে নতুন value দেওয়া যায়। নামটা লেখো, তারপর = আর নতুন value, সামনে কোনো keyword ছাড়া। একে বলে assignment।

let score = 0;
console.log(score);
score = 10;
console.log(score);
score = score + 5;
console.log(score);

0
10
15

score = score + 5 পড়ো ডান দিক থেকে। Engine আগে score + 5 হিসাব করে, পুরোনো value 10 দিয়ে। তারপর score-কে উত্তরটা, 15, ধরিয়ে দেয়। এজন্যই = অঙ্কের সমান চিহ্ন না: সমীকরণ হিসেবে score = score + 5 কখনোই সত্যি হতে পারত না।

তাই let এমন নাম বানায়, যেটা আবার assign করা যায়, আর assignment নামটা বদলানোর আগে ডান দিকটা হিসাব করে নেয়।

const: যে নাম তার value ধরে রাখে

const দিয়ে বানানো নাম সারা জীবন একটাই value ধরে রাখে। অন্য value দিতে গেলেই program ওই লাইনে থেমে যায়।

const price = 450;
console.log(price);
price = 405;
console.log(price);

প্রথম console.log ছাপে 450। তারপর Playground run শেষ করে Runtime error দিয়ে, আর output-এ দেখায় লাইনটা, =-এর নিচে একটা caret চিহ্ন, আর message-টা।

/box/main.js:3
price = 405;
      ^

TypeError: Assignment to constant variable.

Bob-এর দরকার ছিল এই এক শব্দের বদলটাই। ও যদি const price = 450; লিখত, তাহলে যে লাইন sale-এর দামটা ওতে লিখেছিল, program ঠিক সেখানেই থেমে যেত। const-কে value-টাও সঙ্গে সঙ্গে দিতে হয়: শুধু const rate; লিখলে program শুরুর আগেই থেমে যায়, এই message দিয়ে: SyntaxError: Missing initializer in const declaration।

তাই const একটা কথা দেওয়া, আর engine তোমাকে সেই কথা রাখতে বাধ্য করে: এই নাম তার প্রথম value-টাই রাখবে।

কোনটা নেবে

এই track যে নিয়ম মানে, আর বেশিরভাগ team-ও তাই মানে, তার দুইটা ধাপ।

1. আগে const লেখো।
2. Program-কে যখন ওই নামে সত্যিই নতুন value দিতে হবে, শুধু তখনই সেটা let করো: একটা counter, চলতি যোগফল, এখন পর্যন্ত সেরা score।

একটা program-এর বেশিরভাগ নাম কখনো বদলায় না। একটা দাম, input থেকে পড়া একটা নাম, বা একটা যোগফল, প্রতিটা একবারই হিসাব হয়। const পরের পাঠককে, যে প্রায়ই এক মাস পরের তুমি নিজে, বলে দেয় যে বদল খোঁজার দরকার নেই। let বলে "এটার দিকে চোখ রাখো, এটা নড়ে"। তাই const হলো default, আর প্রতিটা let একটা সংকেত।

Copy হয়, বাক্স ভাগাভাগি হয় না

Variable-কে ভাবো একটা বাক্স হিসেবে, গায়ে নামের লেবেল, ভেতরে একটা value। যখন লেখো let copy = price;, engine price-এর ভেতরে তাকায়, আর একই সংখ্যাটা copy নামের একটা নতুন বাক্সে রাখে। তখন থেকে বাক্স দুইটা আলাদা।

লাইন 5-এর পরে, মানে শেষ যে লাইনটা পুরোপুরি চলতে পারে তার পরে, বাক্সগুলো একটা ছবিতে এরকম।

তাই let copy = price সংখ্যাটা copy করে, আর একটা বাক্স বদলালে অন্যটা কখনো বদলায় না। Object-এর আচরণ যে আলাদা, সেটা দেখাবে Module 8, আর তুলনাটা হবে এই ছবির সঙ্গেই।

নাম দেওয়া: নিয়ম আর অভ্যাস

নামে থাকতে পারে অক্ষর, অঙ্ক, _ আর $। নামটা অঙ্ক দিয়ে শুরু হতে পারে না, ভেতরে space বা hyphen থাকতে পারে না, আর সেটা কোনো keyword হতে পারে না, যেমন let, const, class বা new। বড় হাতের অক্ষরও হিসাবে ধরা হয়: userName আর username দুইটা আলাদা নাম।

নিয়মের বাইরে JavaScript-এর একটা পাকা অভ্যাস আছে: camelCase। প্রথম শব্দ ছোট হাতের, আর পরের প্রতিটা শব্দ শুরু হয় বড় হাতের অক্ষরে, যেমন totalPrice বা itemsInCart। ভাষার নিজের নামগুলোও এটা মানে: console.log, Math.floor, আর পরে toFixed আর padStart। পুরো program জুড়ে বাঁধা থাকে এমন value-র অভ্যাসটা যোগ করবে lesson 06।

ভুল বানানের নাম কোনো syntax error না। Program শুরু হয়, ওই লাইন পর্যন্ত চলে, তারপর ওখানেই থামে।

let userName = "Bob";
console.log(username);

Message-টা হলো ReferenceError: username is not defined। "Not defined" মানে হুবহু ওই নামটা কোনো declaration বানায়নি। তাই নাম মানে অক্ষর, অঙ্ক, _ আর $, প্রতিবার একই বানানে, camelCase-এ।

var, পুরোনো কায়দা

2015-এর আগে variable-এর জন্য JavaScript-এর keyword ছিল একটাই: var। পুরোনো tutorial-এ, online-এর উত্তরে, আর তোমার চেয়েও বয়সে বড় code-এ এটা দেখবে। Bob এটা copy করেছে 2012-র একটা tutorial থেকে।

var price = 450;
var price = 405;
console.log(price);

405

var দিয়ে একই নাম দুইবার declare করলে কোনো message-ই আসে না, আর দ্বিতীয় লাইনটা চুপচাপ জিতে যায়। var-এর বানানো নাম program-এর ভেতরে তুমি যতটা ভাবো তার চেয়ে বেশি দূর পৌঁছায়, আর যে লাইন ওটা declare করে, তার আগে থেকেই ওটা থাকে। দুইটাই বুঝিয়ে বলবে Module 6, function scope আর hoisting নামে। ওই চমকগুলো সারাতেই ES2015 let আর const এনেছিল। তাই এই track কখনো var লেখে না, আর কোথাও দেখলে ওটাকে পুরোনো একটা let হিসেবে পড়ো।

const name = "Zara";
console.log("Hello,", name);
console.log(name, "has 3 problems left.");

Hello, Zara
Zara has 3 problems left.

let visitors = 0;
visitors = visitors + 1;
visitors = visitors + 1;
visitors = visitors + 1;
console.log("Visitors so far:", visitors);

Visitors so far: 3

const price = 450;
const discount = 45;
const salePrice = price - discount;
console.log("Price:", price);
console.log("Sale price:", salePrice);
console.log("Stock value of 10 bags:", price * 10);

Price: 450
Sale price: 405
Stock value of 10 bags: 4500

const celsius = 30;
const scaled = celsius * 9 / 5;
const fahrenheit = scaled + 32;
console.log(celsius, "C is", fahrenheit, "F");

30 C is 86 F

const total = 0;
total = total + 120;

const rate;
rate = 15;

let price = 450;
let price = 405;

const itemCount = 3;
console.log(itemcount);

const list = [1, 2];
list.push(3);
console.log(list);

left: coffee
right: tea

let left = "tea";
let right = "coffee";

// Swap the two values here. Writing left = right; first loses "tea".
// Keep it somewhere safe first: a third name helps.

console.log("left:", left);
console.log("right:", right);

After hour 1: 120
After hour 2: 200
After hour 3: 245
After hour 4: 445
After hour 5: 460

let total = 0;

// Add 120 to total, then print the first line.
// Then 80, 45, 200 and 15, each followed by its line.

এরপর lesson 03 বাক্সগুলোর ভেতরে তাকাবে: একটা নাম আট রকমের যে value ধরতে পারে, সেগুলো।