# JavaScript Hoisting Explained With Examples

জাভাস্ক্রিপ্টের বেসিক গুরুত্বপূর্ন বিষয়ের মধ্যে হোইস্টিং (Hoisting ) অন্যতম। একজন ডেভেলপার হিসাবে হোইস্টিং (Hoisting ) সম্পর্কে বিস্তারিত জানা জরুরী। আমি সহজ ভাষায় হোইস্টিং সম্পর্কে আলোচানা করার চেষ্টা করবো।

এই আর্টিকেল এর মাধ্যমে উদাহরণ সহ কিভাবে হোইস্টিং (Hoisting ) কাজ করে, সেটি জানবো।

**জাভাস্ক্রিপ্ট হোইস্টিং (Hoisting ) কি?**  
হোইস্টিং শব্দের অর্থ উত্তোলন। সহজ ভাবে বলা যায়, Hoisting হলো জাভাস্ক্রিপ্টের Default Behaviour যা ফাংশন বা ভ্যারিয়বলের declaration অংশকে উপরে নিয়ে যায়। var এর ক্ষেত্রে hoisting হয়ে value = undefined হয়ে যায়, অথ্যাৎ মেমরিতে একটা reference তৈরী হয়।

***Know about variable declaration and assignment***

```javascript
var a; //declaration
a = 10; // assignment or initialization
console.log(a); // output

// javascript hoisting is a concept of moving variable and function declarations to the top of their scope.
```

***We follow tow things of hoisting***

*before hoisting*

```javascript
var a = 10;
console.log(a); // output 10

var b = 20;
console.log(b); // output 20
```

*after hoisting*

```javascript
var a;
var b;
a = 10;
console.log(a); // output 10
console.log(b); // output undefined
b = 20;

// JavaScript Initializations are Not Hoisted
```

***জাভাস্ক্রিপ্টে var, let, const কিভাবে Hoisting হয় নিম্নে দেওয়া হলো।***

***var*** এর ক্ষেত্রে সে নিজের স্কোপের ভিতর সমস্ত ভেরিয়েবল ও ফাংশনের ডিক্লেয়ারেশনকে উপরে নিয়ে যায়। সেই সাথে *var* বা ফাংশনের মান হিসাবে মেমরির রেফারেন্সে *undefined* প্রথমিক ভাবে ইনিশিয়ালাইজ হয়। তাই আমরা কোন ভেরিয়েবল এর মান ইনিশিয়ালাইজ না করে সেই ভেরিয়েবলকে অ্যাক্সেস করতে চাইলে সেটিকে *undefined* দেখায়।

*Example*

```javascript
// Example : 1
console.log(a); // undefined
var a = 10; // declaration and assignment

// Example : 2
console.log(b); // undefined
b = 20; // assignment
var b; // declaration
```

***let*** এর ক্ষেত্রে একইভাবে তার সকল ডিক্লেয়ারেশন কে উপরে উঠায়, কিন্তু প্রথমিক ভাবে মেমরিতে কোন রেফারেন্স তৈরি করেনা, তাই এ ক্ষেত্রে আমাকে রেফারেন্স ***Error*** দিবে। তবে আমরা সেই স্থানে ডিক্লেয়ারেশন করি, সেই স্থানে সে রেফারেন্স তৈরি করে এবং *undefined* হয়। পরবর্তীতে *assignement* করতে সে তার মান পেয়ে যায়।

Example

```javascript
// Example -1:
let a;
console.log(a); // output undefined
a = 10;


// Example -2:
b = 10;
console.log(b); // output Reference error
let b; 
// Since, let doesn't create any space in memory. It will come be Reference error.


// Example -3:
let c;
c = 10;
console.log(c); // output 10

// Variables defined with let and const are hoisted to the top of the block, but not initialized.
```

***const*** এর ক্ষেত্রে একই ভাবে সকল *declaration* কে উত্তোলন করে, *But not initialized.* যেহেতু *const* এর ভ্যালুকে পুনরায় অ্যাসাইন করা যায়না। তাই এটিকে *Reference error* অথবা *let, var* এর মত করে চিন্তা করলে *Syntax error* দেখাবে।

```javascript
// Example -1:
console.log(a); // Reference error
const a = 10;

// Example -2:
a = 10;
console.log(a); // Syntax error
const a;

//finally var, let and const can be hoisted. but let and const doesn't initialize.
```

**উপসংহার,** পরিশেষে বলা যায় *Javascript* এর মধ্যে *Hoisting* মাধ্যমে নিজস্ব স্কোপের সকল ডিক্লেয়ারেশনকে উত্তলন করে। তবে শুধু মাত্র ***var*** ভেরিয়েবল এর ক্ষেত্রে মেমরিতে একটি রেফারেন্স তৈরি করে, সেটি *Undefined* হয়ে থাকে।  
*let, const* এর ক্ষেত্রে কোন রেফারেন্স তৈরি করেনা। শুধু মাত্র ডিক্লেয়ারেশনকে উত্তলন করে। তাই মান অ্যাসাইন করার আগে অ্যাক্সেস করতে চাইলে সেটি রেফারেন্স এরর দেখাবে।

*if there are any mistakes in my article, please let me know* [***asad2002web@gmail.com***](mailto:asad2002web@gmail.com)