কম্পিউটার টিউটোরিয়াল

JavaScript Filter মেথড: স্টেপ-বাই-স্টেপ গাইড

JavaScript filter() মেথড একটি এক্সিস্টিং অ্যারে থেকে এলিমেন্টসের একটি নতুন অ্যারে তৈরি করে। filter() মেথড একটি কলব্যাক ফাংশন আর্গুমেন্ট হিসেবে গ্রহণ করে। এই ফাংশন ইভ্যালুয়েট করে একটি এলিমেন্ট নতুন লিস্টে এক্সিস্টিং লিস্ট থেকে যোগ হবে কিনা।


আপনি যদি JavaScript-এ নতুন হন, তবে আপনি filter() এবং reduce() জাভাস্ক্রিপ্ট ফাংশনগুলো সম্পর্কে শুনেনি হতে পারে। এই ফাংশনগুলো উপকারী হতে পারে যখন আপনি অবজেক্টের একটি লিস্টের সাথে কাজ করছেন, যাকে অ্যারে বলা হয়।

আপনি যদি কখনো একটি অ্যারে থেকে শুধু নির্দিষ্ট ভ্যালুগুলো বের করতে চেয়ে থাকেন, তবে আপনি JavaScript filter() ফাংশন ব্যবহার করতে পারেন। এই টিউটোরিয়ালে, আমরা উদাহরণের রেফারেন্সে filter() ফাংশন কীভাবে ব্যবহার করা হয় তা আলোচনা করব।

অ্যারে রিফ্রেশার

একটি JavaScript অ্যারে শূন্য বা অধিক আইটেম স্টোর করে। আইটেমগুলো হতে পারে নম্বর, অন্যান্য অ্যারে, স্ট্রিং, বা অন্য ডেটা টাইপ। সেগুলো "0" থেকে শুরু হওয়া নাম্বার্ড ইন্ডেক্স ব্যবহার করে স্পেসিফিক আইটেম অ্যাক্সেস করে।

অ্যারেগুলো আপনাকে একই ভেরিয়েবলে একাধিক ভ্যালু স্টোর করতে দেয়। এটি আপনাকে বেটার এবং ক্লিনার কোড লিখতে সাহায্য করে কারণ আপনাকে আপনার ভ্যালুগুলো স্টোর করার জন্য একাধিক ভেরিয়েবল লিখতে হয় না।

JavaScript-এ একটি অ্যারের উদাহরণ:

let names = ["Alex", "Bill", "Connor", "Daniel", "Edna"];

JavaScript Filter Array

JavaScript অ্যারে filter() মেথড একটি এক্সিস্টিং অ্যারেের কন্টেন্টস ভিত্তিক করে একটি নতুন অ্যারে তৈরি করে। filter() মেথড একটি এক্সিস্টিং অ্যারেের প্রতিটি আইটেমে একটি কলব্যাক ফাংশন ইভ্যালুয়েট করে। যে কোনো আইটেম কলব্যাক ফাংশনে কন্ডিশন মিট করে, সেটি নতুন লিস্টে যোগ হয়।

filter মেথড ব্যবহার করে, আমরা নির্দিষ্ট ক্রাইটেরিয়া মিট করা ভ্যালুগুলো রিট্রিভ করতে পারি এবং সেগুলো একটি নতুন অ্যারেতে যোগ করতে পারি।

Filter Array JavaScript সিনট্যাক্স

filter মেথড নিচের সিনট্যাক্স ব্যবহার করে:

var newArr = oldArr.filter(function(item) { return yourCondition; });

এই কোড "newArr" নামে একটি অ্যারে ডিফাইন করে "oldArr" অ্যারেের কন্টেন্টস ভিত্তিক করে। আমাদের কলব্যাক ফাংশন নতুন অ্যারে একটি ভ্যালু রিটার্ন করে যদি একটি কন্ডিশন মিট হয়। উদাহরণ কন্ডিশনগুলো شامل:

  • item > 5
  • item == "Jessie"
  • item < 3

আপনি JavaScript কম্প্যারিজন অপারেটর ব্যবহার করে আপনার কন্ডিশন বিল্ড করতে পারেন। অথবা, আপনি একটি if স্টেটমেন্ট ব্যবহার করতে পারেন। if স্টেটমেন্ট ব্যবহার করলে আপনি কন্ট্রোল করতে পারেন একাধিক ভ্যালুর মধ্যে কোনটি নতুন লিস্টে যোগ হবে।

Filter JavaScript উদাহরণ

নম্বরের একটি লিস্ট ফিল্টার করা

একটি সিম্পল উদাহরণ থেকে শুরু করি। আমাদের কাছে একটি কফি শপ থেকে পারচেসের একটি লিস্ট আছে। আমরা একটি নতুন লিস্ট তৈরি করতে চাই যেটি $10-এর বেশি পারচেস ডিসপ্লে করবে।

আমাদের পারচেসের লিস্ট এইরকম দেখে:

var purchases = [2.50, 2.70, 10.50, 12.30, 9.60, 2.30, 3.40];

আমরা filter() মেথড ব্যবহার করে $10-এর বেশি ওয়ার্স পারচেস রিট্রিভ করতে পারি:

var big_purchases = purchases.filter(function(purchase) { return purchase > 10; });

আমাদের প্রোগ্রাম চেক করে কোনো পারচেস $10-এর বেশি ওয়ার্স কিনা। একটি পারচেস আমাদের big_purchases লিস্টে যোগ হয় যদি এটি $10-এর বেশি ওয়ার্স হয়। অন্যথায়, পারচেসটি বাদ পড়ে।

big_purchases JavaScript ভেরিয়েবলের ভ্যালু হলো:

[10.5, 12.3]

filter() মেথড সকল এলিমেন্ট রিটার্ন করে যা আমাদের ডিফাইন করা টেস্ট পাস করে। এই টেস্ট হলো "item > 10"। যদি আমরা সব পারচেস অ্যাক্সেস করতে চাই, তবে আমরা আমাদের মূল "purchases" লিস্টে রেফার করতে পারি। আমাদের filter() মেথড $10-এর বেশি ভ্যালুগুলোর একটি অ্যারে রিটার্ন করে।

অবজেক্টের একটি অ্যারে ফিল্টার করা

আমাদের কাছে একটি অ্যারে আছে যেটি একটি স্কুলের সবার নাম ধারণ করে:

var students = [ { id: 1, name: "Alex", class: "First Grade", age: 5 }, { id: 2, name: "Bill", class: "First Grade", age: 5 }, { id: 3, name: "Connor", class: "Second Grade", age: 6 } ];

যদি আমরা শুধু ফার্স্ট গ্রেডের শিক্ষার্থীদের বের করতে চাই? Filter() এটি সহজ করে দেয় এই অপারেশনটি পারফর্ম করতে। চলুন একটি ফাংশন লিখি যা "students" অ্যারে থেকে সব ফার্স্ট-গ্রেডার রিটার্ন করবে:

var firstGradeStudents = students.filter(function (student) { return student.class === "First Grade"; });

Filter() এক প্যারামিটার নেয়। এটি একটি ফাংশন যা নির্ধারণ করে আপনি আপনার ডেটায় কী অপারেশন রান করবেন।

filter() ফাংশন "students" অ্যারেের প্রতিটি অবজেক্টের মধ্য থেকে যায়। filter() সেসব শিক্ষার্থী রিটার্ন করে যাদের ক্লাস "First Grade"-এর সমান। "===" অপারেটর মানে ইকুয়ালিটি।

filter ফাংশন এই নতুন ভ্যালুগুলোর সাথে একটি নতুন অ্যারে তৈরি করবে, যা "firstGradeStudents" ভেরিয়েবল থেকেই অ্যাক্সেসযোগ্য।

উপসংহার

আপনি filter() অ্যারে মেথড ব্যবহার করে একটি এক্সিস্টিং অ্যারেের কন্টেন্টস থেকে একটি নতুন অ্যারে তৈরি করতে পারেন। ক্লুটি filter() মেথডের নামেই আছে। filter() ফিল্টার করে বাদ দেয় একটি এক্সিস্টিং অ্যারে থেকে এলিমেন্টগুলো।

এটাই সব! এখন আপনি JavaScript-এ reduce() আরও কনফিডেন্সের সাথে ব্যবহার করতে পারেন। JavaScript-এ কীভাবে কোড করতে হয় তা আরও জানতে, আমাদের JavaScript বিগিনারদের জন্য বেস্ট টিউটোরিয়াল আর্টিকেল পড়ুন।

  1. JavaScript Onclick: ধাপে ধাপে গাইড

  2. জাভাস্ক্রিপ্টে একাধিক স্ট্রিং দিয়ে অ্যারে ফিল্টার করা

  3. জাভাস্ক্রিপ্টে অন্য একটি অ্যারে অনুযায়ী অ্যারে ফিল্টার করা

  4. জাভাস্ক্রিপ্টে অ্যাসোসিয়েটিভ অ্যারে ফিল্টার করা অন্য অ্যারে দিয়ে