> For the complete documentation index, see [llms.txt](https://nipu.gitbook.io/coding-js/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://nipu.gitbook.io/coding-js/datatype/non-primitive-data-type/array.md).

# অ্যারে(Array)

#### অ্যারে

অ্যারে মানে হলো বিন্যাস। যখন একই জাতীয় ডাটা গুলো একটি নির্দিষ্ট কোন লোকেশনে রাখতে চাই তাহলেই আমাদের অ্যারে এর প্রয়োজন পড়ে । অর্থাৎ একি জাতীয় কয়েকটা ডাটাকে সুবিন্যস্ত ভাবে সাজানোকেই অ্যারে বলে । অ্যারে কে অনেকটা সেই পুরনো দিনের দাদুর সাথে তুলনা করা যায়। যেখানে দাদুর অনেক ছেলেমেয়ে থাকত । এখন দাদু যদি হয় অ্যারে, দাদুর ছেলে পুলে গুলো হলো ঐ অ্যারের ইলিমেন্ট বা উপাদান । প্রোগ্রামিং সেক্টরে অ্যারে হচ্ছে সবচেয়ে গুরুত্ব পূর্ণ একটি টপিক। অ্যারে ব্যাবহার করে প্রোগ্রামিং সেক্টরে অনেক জটিল কাজ করা হয় প্রতিনিয়ত। 

অ্যারে এর মধ্যে সবচেয়ে যে বিষয়টা গুরুত্ব পূর্ণ সেটা হচ্ছে ,অ্যারে কিভাবে ডাটা রাখে ? মানে সে কিভাবে কম্পিউটারে তার ডাটা গুলোকে স্টোর করে রাখে?

উত্তর টা হচ্ছে অ্যারে ইনডেক্স আকারে ডাটা রাখে। আচ্ছা এখন মনে প্রশ্ন জাগছে খুব শখ করে হয়ত সেটা আবার কিভাবে ? আর তার উত্তর টা অনেক সহজ একদম । আপনি যদি এখন স্কুল পড়ে থাকেন বা কোন এক সময় পড়তেন তাহলে প্রতিদিন একটা কাজ আমাদের প্রতিদিন অনুসরণ করতে হতো আর সেটা হলো লাইন ধরে জাতীয় সংগীত গাওয়া। টিক নিচের চিত্রের মতো করে।

![জাতীয় সঙ্গীত পরিবেশন এর চিত্র ](https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcR9BESeAHxQwqPfVS2ANbX0UU4pPWjDnqyy0jsLMb-B7IMLfFLV)

এখানে যদি আপনি পুরো স্কুল মাঠটিকে অ্যারে হিসেবে কল্পনা করেন তাহলে স্কুল মাঠ হচ্ছে অ্যারে, আর ছাত্রছার্ত্রীরা হচ্চে এখানে ইলিমেন্ট। আর প্রতিটা ইলিমেন্ট বা উপাদান যে পজিশন বা জায়গায় অবস্থান করছে সেটা হচ্চে অ্যারে ইন্ডেক্স। বুঝেনি এখনো! তাই তো ? আরো পরিষ্কার করি বিষয়টা।

![How to work with arrays](https://www.educative.io/api/edpresso/shot/6445167638740992/image/6388045848772608)

![Array](https://media.geeksforgeeks.org/wp-content/uploads/C-Arrays.jpg)

আশা করি ছবি দেখে বুঝে গেছেন এতক্ষনে।এবার আর দেরি না করে চলুন দেখে নেই কিভাবে জাভাস্ক্রিপ্টের মাধ্যমে অ্যারে লিখতে হয়।

সিনট্যাক্সঃ-

```javascript
const arrayName=[element1,element2,element3];
or
var arrayName=[element1,element2,element3];
or 
let arrayName=[element1,element2,element3];
```

উপরোক্ত যেকোনো একটি পদ্ধতি অনুসরন করে আপনি অ্যারে লিখতে পারেন । প্রথমে আপনাকে যেকোন একটি কীওয়ার্ড লিখতে হবে। সেটা হতে পারে **const**, **let**, **var** \[**বিঃদ্রঃ const, let es6 এর feature**] এর মধ্যে যেকোনো একটা । তারপরের অংশ হলো অ্যারে একটা নাম দিতে হবে সেটা হতে পারে আপনার ডাটার ধরন বা তথ্য অনুযায়ী । অনেকেই বলে থাকে নিজের ইচ্ছা মত একটা নাম দিলেই তো হবে, কিন্তু আমি ঐ কথায় সহমত না কারণ আপনি প্রোগ্রাম শিখতে যাচ্ছেন আপনাকে মাথায় রাখতে হবে ক্লিন কোডিং করার বিষয়টা। যদি এমন টা অভ্যাস না হয় তাইলে ভবিষ্যৎ এ আপনি বিপদে পড়তে যাচ্ছেন নিশ্চিত। যা হোক অনেক জ্ঞানের বানী বলে দিলাম। এখন থেকে তাহলে আপনি যখন ই কোডিং করবেন তখনি চিন্তা করতে হবে কোন নামটা veriable এর জন্য সুন্দর ও উপযুক্ত বলে বিবেচনা করা যেতে পারে। যেমন আপনি মনে করেন এমন একটি অ্যারে বানাচ্ছেন যেটার মধ্যে মানুষ সম্পর্কিত তথ্য থাকবে তাহলে আপনি ভেরিএবল এর নাম দিতে পারেন people তাহলে হবে কি যখন কোন আমার মত ডামিস প্রোগ্রামার এসে কোড গুলো বুঝতে চাইবে তখনি বুঝে নিতে পারবে। ক্লিন কোডিং নিয়ে পরে আমি লিখে দিয়েছি সময় হলে পড়ে নিবেন।

এবার আসি আসল কথা হলো যে, এত যে বক বক করলাম এর পর যদি একটা উদাহরন দিতে না যায় তাহলে জনগন কি মানবে? মানবে না জানি? তাইলে কি আর হয়ে যাক একটা উদাহরনঃ-

```javascript
var phones=['iPhone','Sumsung','Sony','Nokia','Oppo','symphony'];
console.log(phones);
```

আপনি যদি বইটির অনলাইন ভার্সন পরে থাকেন তাইলে এবার আপনি প্রোগ্রাম টা চুরি করে কপি করার ধান্ধায় আছেন। আর সেটা আমি জানি । একদম করবেন না ভূলেও দেখে দেখে টাইপ করে যান তারপরেও কপি করিয়েন না । যা হোক টাইপ করা হয়ে গেলে কষ্ট করেন রান করুন আর আউপুট না দেখতে পেয়ে দেবদাস হয়ে যাবেন না গুলুমুলু আংগুল দিয়ে কষ্ট করে ব্রাউজারের কনসোল টা খুলন। তাহলে দেখবেন আপনার কনসোলে দুঃখিত আপনার না আপনার পিসির ব্রাউজারের কনসোলে আউটপুট দেখা যাচ্ছে। কি মজা পেলেন? জানি পান নাই আজকালকার যুগে একটু মেকাপ করা আউটপুট না হলে চলে ? জানি চলে না ! তাইলে আরেকটু বিনোদন গ্রহন করে নেই আসেন । তো শুরু হতে যাচ্ছে মেকাপ করা ঝকঝকে চকচকে তুলতুলে একটি প্রোগ্রামের উদাহরন ।

{% code title="array.html" lineNumbers="true" %}

```html
<!DOCTYPE html>
<html>
  <head>
    <title>চকচকে ঝকঝকে অ্যারে</title>
  </head>
  <body>
      <p>
          দাদুর ছেলেদের লিস্ট
      </p>
    <ul id="sonOfGrandFather"></ul>
    <script>
      var sonOfGrandFather = [
        "children1",
        "children2",
        "children3",
        "children4",
        "children5",
        "children6",
        "children7",
        "children8",
        "children9",
        "children10"
      ];
      const sonOfGrandFatherList = document.getElementById("sonOfGrandFather");

      for (let son of sonOfGrandFather) {
        let li = document.createElement("li");
        li.textContent = son;
        sonOfGrandFatherList.append(li);
      }
    </script>
  </body>
</html>

```

{% endcode %}

যা হোক প্রোগ্রাম করা শেষ হলে আবার কষ্ট করে এবার প্রোগ্রামটা ব্রাউজারে রান করে নিন । রান করে খুশি হয়ে যান খুব করে। এবার হয়তো আগের মত কনসোল ওপেন করতে হবে না । ব্রাউজারে রান করা মাত্রই দেখতে পাচ্ছেন ঝকঝকে আর চকচকে প্রোগ্রামের আউটপুট।

এবার আসি কিভাবে আমারা এই অ্যারেকে নিয়ে আমাদের প্রোগ্রাম আগে বাড়াব আরো ভাল ভাল কিছু মেথড অ্যাপ্লাই করে নিজের দৈনিক কাজে বেশি করে কাজে লাগাবো । তো বেশি করে কথা না বলে বেশি বেশি করে প্রোগ্রাম লিখে ফেলি।

এবার আমরা শিখব কিভাবে অ্যারে দিয়ে select menu তে অপশন তৈরি করে নেওয়া যায়

{% code title="select-menu.html" lineNumbers="true" %}

```html
<!DOCTYPE html>
<html>
  <head>
    <title>চকচকে জকঝকে অ্যারে</title>
  </head>
  <body>
      <p>
          দাদুর ছেলেদের লিস্ট
      </p>
    <select id="sonOfGrandFather">
        <option value="">choose...</option>
    </select>
    <script>
      var sonOfGrandFather = [
        "কেরামত আলী",
        "রহমত আলী",
        "আবুল আলী",
        "আক্কাস আলী",
        "সিদ্দিক আলী",
        "বরকত আলী",
        "মন্টু আলী",
        "রমজান আলী",
        "সুজন আলী",
        "ছোট আলী"
      ];
      const sonOfGrandFatherList = document.getElementById("sonOfGrandFather");
      for (let son of sonOfGrandFather) {
        let option = document.createElement("option");
        option.textContent = son;
        sonOfGrandFatherList.append(option);
      }
    </script>
  </body>
</html>

```

{% endcode %}