map কইরা দেন ভাই
ধর, তোর কাছে একটা অ্যারের মধ্যে অনেকগুলা সংখ্যা আছে। তোর কাজ হবে, সবগুলা সংখ্যারে দ্বিগুণ করবি, সেই দ্বিগুণ মানগুলা একটা অ্যারের মধ্যে রেখে রিটার্ন করবি।
এই কাজ করার জন্য তুই একটা ফাংশন লিখবি। সেখানে প্যারামিটার হিসেবে একটা অ্যারে নিবি। আর ফাংশনের ভিতরে দ্বিগুণ মানগুলো রাখার জন্য একটা অ্যারে ডিক্লেয়ার করবি। তারপর লুপ চালাবি। লুপের ভিতরে মানগুলো দ্বিগুণ করবি। এরপর দ্বিগুণ মান সেই অ্যারের মধ্যে পুশ করবি। এরপর লুপ শেষ হলে ডাবল সংখ্যাওয়ালা অ্যারেটা রিটার্ন করে দিবি।
function doubleAll (numbers){
const doubled = [ ];
for(const num of numbers) {
const value = num * 2;
doubled.push(value);
}
return doubled;
}
const numbers = [4, 5, 2, 8, 10];
console.log(doubleAll(numbers));
Output: [8, 10, 4, 16, 20]মজার বিষয় হচ্ছে, এত বড় কাজ জাস্ট এক লাইনে প্যাকেট করে দিতে পারবি।
কিছুই না, জাস্ট অ্যারের নামের পর ডট চিহ্ন (.) দিয়ে map লিখবি। সেটার ভিতরে একটা arrow ফাংশন লিখবি। arrow ফাংশনের কাজ হবে, একটা উপাদান নিবি, আর উপাদানরে ডাবল করবি।
তাহলেই যে অ্যারের ওপরে map চালাইছিস, তার সবগুলা উপাদান ডাবল হইয়া সেই ডাবল উপাদানগুলা তোকে রিটার্ন করে দিবে। কী মজা!
const numbers = [4, 5, 2, 8, 10];
const result = numbers.map(num => num * 2);
console.log(result);
Output: [8, 10, 4, 16, 20]শুধু ডাবল না; বরং এই টাইপের আরও অনেক কাজ তুই করতে পারবি। যেমন, সব উপাদানের সাথে 5 যোগ করবি। এক লাইনের কোড দিয়ে বা সব উপাদানকে ২ দিয়ে ভাগ করে অর্ধেক করে ফেলতে পারবি।
const numbers = [12, 10, 8, 15, 7];
const fiveBonus = numbers.map(num => num + 5);
const halves = numbers.map(num => num / 2);
console.log(fiveBonus);
console.log(halves);
Output:
[17, 15, 13, 20, 12]
[6, 5, 4, 7.5, 3.5]আবার স্ট্রিং মানওয়ালা অ্যারের মধ্যেও map চালাইতে পারবি; যাতে সবগুলা উপাদানের মধ্যে কয়টা ক্যারেক্টার আছে। অর্থাৎ স্ট্রিংগুলার লেংথ জানতে পারবি। আবার সেইম স্টাইলে প্রত্যেকটা স্ট্রিংয়ের প্রথম উপাদানকে নিয়ে একটা অ্যারেতে নিয়ে আসতে পারবি।
const friends = ['Tom', 'Jhon', 'Micheal', 'Oliver'];
const lengths = friends.map(frnd => frnd.length);
const firstLetters = friends.map(friend => friend[0]);
console.log(lengths);
console.log(firstLetters);
Output:
[3, 4, 7, 6]
['T', 'J', 'M', 'O']map() খুবই শক্তিশালী একটা ফাংশন, যা অ্যারের প্রতিটা উপাদানের ওপর নির্দিষ্ট কাজ করে এবং একটা নতুন অ্যারে রিটার্ন করে। একটু প্র্যাকটিস করলে তুই এটা দিয়া অনেক কাজ সহজে করতে পারবি।
forEach কী?
ধর, আমরা একটা number-এর অ্যারে ডিক্লেয়ার করলাম।
const numbers = [1, 5, 6, 4, 15];এখন, এই জায়গায় যদি আমরা map ব্যবহার করতাম, তাহলে সে প্রতিটা উপাদানের ওপর গিয়া কিছু একটা কাজ করত এবং রেজাল্টটা return করত। আর forEach কী করে? forEach প্রত্যেকটা উপাদানের ওপর কাজ করে, কিন্তু কিছু return করে না।
সোজা কথায়, map প্রতিটা উপাদানের ওপর গিয়া কাজ করে এবং সেটারে return করে দেয়। কিন্তু forEach কাজ করলেও কিছু return করে না। এটাই তাদের মধ্যে পার্থক্য।
const numbers = [1, 5, 6, 4, 15];
const result = numbers.forEach(n => console.log(n));
console.log(result);
Output:
1
5
6
4
15
undefinedএই কোডটা খেয়াল কর, আমরা আমাদের অ্যারের ওপর forEach করছি এবং প্রতিটা উপাদানকে console-এ দেখতে পাচ্ছি। কিন্তু যখন আমরা result ভ্যারিয়েবলটা আউটপুটে দেখতে চাইছি, তখন undefined দেখাচ্ছে। কারণ, forEach কিছু return করে না।
সুতরাং, map এবং forEach কাছাকাছি জিনিস, কিন্তু পার্থক্য হইল map রেজাল্টকে অ্যারেতে return করবে, আর forEach করবে না।
Filter:
এখন filter দিয়ে কী করবি? filter দিয়া কিছু জিনিস বাছাই করবি। অনেকটা ছাকনির মতো। কিছু জিনিস ছাকনিতে আটকে যায়। যেমন, চা পাতা আটকে যায়, আর চা নিচে পড়ে যায়। এ রকম কিছু জিনিস বের করার ছাকনিই হচ্ছে filter মেথড। ধর, আমাদের কাছে কিছু খেলোয়াড়ের উচ্চতার অ্যারে আছে। আমরা 70 ইঞ্চির ওপরে যারা আছে, তাদেরকে বাস্কেটবল খেলার জন্য বাছাই করতে চাই।
const players = [75, 65, 67, 71, 55, 59];
const selected = players.filter(p => p > 70);
console.log(selected);
Output: [ 75, 71 ]এখানে খেয়াল কর, আমরা আমাদের শর্ত অনুযায়ী যাদের চেয়েছিলাম, তাদেরই একটা অ্যারে return করা হইছে। শর্ত যদি 80-এর ওপরে দিস, তখন দেখবি filter আমাদের empty অ্যারে return করবে। কারণ, একজনের উচ্চতাও 80-এর ওপরে নাই।
তুই চাইলে কোনো string-এর থেকেও filter করে কিছু বাছাই করতে পারিস।
const friends = ['tom', 'john', 'micheal', 'oliver', 'tim', 'joshna'];
const oldFriends = friends.filter(friend => friend.length > 4);
console.log(oldFriends);
Output: [ 'micheal', 'oliver', 'joshna' ]এখানে আমরা যেসব বন্ধুর নামের লেংথ 4-এর বেশি, তাদের oldFriends-এ স্টোর করছি।
Find
এখন, filter-এর কাছাকাছি আরেকটা জিনিস আছে, সেটা হইলো find। find হলো filter-এর মতই, কিন্তু পার্থক্য হইলো, filter শর্ত মিলে গেলে যেগুলা মিলবে, তাদের সবগুলাকে অ্যারে হিসেবে return করে, আর find ম্যাচ করলে শুধু প্রথম উপাদানকে return করে।
আবার filter যদি শর্ত পূরণ করে এমন কোনো উপাদান না পায়, তাহলে রিটার্ন হিসেবে একটা খালি অ্যারে ( [ ] ) রিটার্ন করবে। অন্যদিকে find যদি কোনো ম্যাচিং উপাদান না পায়, যেটা শর্ত পূরণ করবে, তাহলে সে undefined রিটার্ন করবে।
const players = [75, 65, 67, 60, 71, 55, 59];
const selected = players.find(player => player > 70);
console.log(selected);
Output: 75filter সব সময় অ্যারে return করবে, আর find প্রথম উপাদান return করবে, যা শর্ত পূরণ করে। যদি শর্ত পূরণ না করে, find তোকে undefined রিটার্ন করবে।
FindIndex
ম্যাচিং কোনো উপাদান পেলে find উপাদানের মান দিয়ে দেয়। আর findIndex দিয়ে দিবে প্রথম যে উপাদান শর্ত পূরণ করবে, তার index-এর মান। যদি পুরা অ্যারের কোনো উপাদানও শর্ত পূরণ না করে, তাহলে রিটার্ন করবে -1, কারণ -1 ইনডেক্স মানে সেই উপাদানটা অ্যারের মধ্যে নাই।
const numbers = [10, 25, 30, 50];
const index = numbers.findIndex(num => num > 27);
console.log(index);
Output: 2
const veryBig= numbers.findIndex(num => num > 100);
console.log(veryBig);
Output: -1একটা না তিনটা প্যারা
এতক্ষণ পর্যন্ত আমি map, filter, find, forEach ইত্যাদির মধ্যে যে অ্যারো ফাংশন দিচ্ছিলাম, সেখানে একটা প্যারামিটার ছিল। কারণ, বেশির ভাগ সময় একটা প্যারামিটারের দরকার পড়ে। তবে ভিতরে ভিতরে কিন্তু তিনটা প্যারামিটার। এই তিনটা প্যারামিটারের সবগুলা বেশির ভাগ সময় কাজে লাগে না। তারপরেও জেনে রাখলি। ক্ষতি কী?
আমি যদি তিনটা প্যারামিটারের কথা বলি, তাহলে প্রথমটা হচ্ছে, যেটা এতক্ষণ ধরে ইউজ করতেছিলাম, সেটাকে বলে element (অ্যারের উপাদান। আমরা আমাদের সুবিধামতো মিল আছে, এমন একটা নাম দেই), তারপর আছে index অর্থাৎ যে যে ইলিমেন্ট আসতেছে, অ্যারের মধ্যে সেটার ইনডেক্স কত। আর থার্ড প্যারামিটার হচ্ছে পুরা অ্যারেটা দিয়ে দিবে।
const students = [
{ name: "John", age: 20 },
{ name: "Adam", age: 22 },
{ name: "Tom", age: 19 },
{ name: "Lucy", age: 21 }
];
const studentInfo = students.map((student, index, array) => {
return `${student.name}, ${index + 1} of ${array.length} students.`;
});
console.log(studentInfo);
Output:
[
'John, 1 of 4 students.',
'Adam, 2 of 4 students.',
'Tom, 3 of 4 students.',
'Lucy, 4 of 4 students.'
]ওপরে আমরা map-এর ভিতরে তিনটা প্যারামিটারই ইউজ করতেছি। index-এর সাথে 1 যোগ করে পজিশন বের করতেছি। আবার জাস্ট দেখার জন্য পুরা অ্যারের লেংথ প্রত্যেক লাইনে ইউজ করতেছি।
Summary:
আমরা একটা অ্যারের ওপর map চালাই, তাহলে প্রত্যেকটা উপাদানের ওপর কিছু একটা অপারেশন চালাবে এবং সেই অপারেশনের রেজাল্ট দিয়া একটা নতুন অ্যারে তৈরি করে সেই অ্যারেকে return করে দিবে।
আর যদি forEach করি, তাহলে প্রত্যেকটা উপাদানের ওপর কিছু একটা অপারেশন করবি, কিন্তু কিছুই return করবি না, সেখানেই শেষ।
Filter করলে একটা শর্ত দিবি, যেই উপাদানগুলো শর্ত পূরণ করবে, তাদেরকে একটা অ্যারেতে return করবে। আর যদি শর্ত পূরণ করে, এমন কোনো উপাদান না পায়, তাহলে রিটার্ন হিসেবে একটা খালি অ্যারে ( [ ] ) রিটার্ন করবে।
Find করলে একটা শর্ত দিবি, আর যে উপাদানটা প্রথমে শর্ত পূরণ করবে, তাকেই return করবে। আর যদি কোনো ম্যাচিং উপাদান না পায়, যেটা শর্ত পূরণ করবে, তাহলে সে undefined রিটার্ন করবে।
Practice:
- একটা স্ন্যাক্সের দোকানে বিভিন্ন আইটেম আছে, যেগুলার দাম এভাবে আছে: [30, 45, 20, 60, 10]। তুই সবগুলা আইটেমের দাম 13 টাকা করে বাড়াইতে চাস। এই কাজটা map দিয়ে করে দেখ।
- ধর, তোর একটা নামের লিস্ট আছে [ 'Messi', 'Maradona', 'Pele', 'Zidane', 'Ronaldo']। তুই চাস, লিস্ট থেকে 5 অক্ষরের বেশি যাদের নাম, শুধু তাদেরকে একটা আলাদা লিস্টে রাখবি। filter দিয়ে করে দেখ কীভাবে হবে।
- তোর একটা number লিস্ট আছে [10, 15, 20, 25, 30, 35]। তুই এমন একটা প্রোগ্রাম লিখে দেখ, যা 20-এর ওপরে প্রথম যে সংখ্যাটা আছে, সেটা খুঁজে বের করে দিবে।
- তোর কিছু হাইটের ডেটা আছে, যেমন: [65, 70, 68, 72, 68, 73]। 69 ইঞ্চির বেশি লম্বা যাদের হাইট আছে, তাদের শুধু খুঁজে বের কর filter দিয়ে।
- তোর কাছে কিছু সংখ্যা আছে: [7, 10, 15, 20, 25, 30]। তুই চাস প্রত্যেক সংখ্যা 3 দিয়ে ভাগ করলে কত হয়, সেটা এক এক করে দেখতে। map ইউজ করে প্রোগ্রাম লিখ।
- তোর বন্ধুদের নামের লিস্ট আবারও আছে ['Leonardo', 'Brad Pitt', 'Kate Winslet', 'Audrey Hepburn', 'Johnny Depp']। থার্ড অক্ষর বের করতে চাস প্রত্যেক বন্ধুর নামে। map দিয়ে কাজটা করে ফেল।
- ধর, তুই একটা নামের array নিয়া আছিস: ['Tom', 'Harry', 'Sam', 'Jack']। এখন এমন নাম খুঁজে বের কর, যা 'H' দিয়া শুরু হয়। find ইউজ কর।
- তুই একটা array [1, 2, 3, 4, 5] নিয়া বসে আছিস। তুই একটা ফাংশন লিখ, যা forEach ইউজ করে প্রতিটা সংখ্যা console-এ প্রিন্ট করে।
- ['cow', 'goat', 'sheep', 'horse'] এই অ্যারে থেকে প্রতিটা নাম forEach দিয়ে console-এ প্রিন্ট কর।