জাভাস্ক্রিপ্টে অ্যাসিঙ্ক/অ্যাওয়েট
এই আর্টিকেলে আমরা জাভাস্ক্রিপ্টে অ্যাসিঙ্ক/অ্যাওয়েট ব্যাখ্যা করব।
YouTube Video
জাভাস্ক্রিপ্টে অ্যাসিঙ্ক/অ্যাওয়েট
জাভাস্ক্রিপ্টে async (এবং await) এমন ফিচার যা অ্যাসিঙ্ক্রোনাস অপারেশন আরও সহজবোধ্য এবং পড়তে সুবিধাজনক করার জন্য ডিজাইন করা হয়েছে। এটি ব্যবহারের মাধ্যমে আপনি প্রচলিত কলব্যাক ফাংকশন এবং Promise চেইনের জটিলতা কমাতে পারেন এবং অ্যাসিনক্রোনাস কোডকে সিঙ্ক্রোনাস কোডের মতো করে লিখতে পারেন।
async ফাংশন
async একটি ফাংশনকে অ্যাসিঙ্ক্রোনাস ফাংশন হিসেবে চিহ্নিত করতে ব্যবহৃত হয়। async ফাংশন সবসময় একটি প্রমিজ রিটার্ন করে। async চিহ্নিত ফাংশনের ভিতরে, আপনি await ব্যবহার করতে পারেন একটি প্রমিজের ফলাফল প্রত্যাবর্তন করার জন্য অপেক্ষা করতে।
async ফাংশনের মৌলিক সিনট্যাক্স
1async function myAsyncFunction() {
2 // Write asynchronous processing here
3 return 'Result'; // Return a Promise
4}এই ক্ষেত্রে, myAsyncFunction() কল করা হলে স্বয়ংক্রিয়ভাবে একটি প্রমিজ অবজেক্ট রিটার্ন করে। যখন প্রমিজ রেজলভ হয়, এর ফলাফলটি return দ্বারা রিটার্ন করা ভ্যালু হয়ে যায়।
উদাহরণ: মৌলিক async ফাংশন
1async function greet() {
2 return 'Hello, World!';
3}
4
5greet().then((message) => {
6 console.log(message); // Displays "Hello, World!"
7});await
await একটি প্রমিজ রেজলভ হওয়ার জন্য অপেক্ষা করার জন্য ব্যবহৃত হয়। await ব্যবহার করে আপনি প্রমিজের রেজলভ হওয়া পর্যন্ত এক্সিকিউশনকে থামিয়ে রাখতে পারেন এবং প্রমিজের ফলাফল পেতে পারেন। await শুধুমাত্র একটি async ফাংশনের ভিতরে ব্যবহার করা যেতে পারে।
উদাহরণ: কিভাবে await ব্যবহার করবেন
1async function fetchData() {
2 // Wait for the result of the Promise
3 const data = await fetch('https://codesparklab.com/json/example.json');
4 // Wait for the asynchronous operation to complete
5 const jsonData = await data.json();
6 // Retrieve and display the data
7 console.log(jsonData);
8}
9
10fetchData();উপরের উদাহরণে, এটি fetch ফাংশন দ্বারা রিটার্নকৃত প্রমিজের জন্য await দিয়ে অপেক্ষা করে এবং তারপর ফলাফল ব্যবহার করে আরও অ্যাসিঙ্ক্রোনাস অপারেশন সম্পন্ন করে।
async/await এর সাথে এরর হ্যান্ডলিং
যদি একটি async ফাংশনের ভিতরে কোনো এরর ঘটে, তবে সেই এররটি প্রমিজের একটি reject হিসেবে গণ্য করা হয়। আপনি এরর হ্যান্ডলিং করার জন্য try...catch স্টেটমেন্ট ব্যবহার করতে পারেন।
উদাহরণ: এরর হ্যান্ডলিং
1async function fetchData() {
2 try {
3 // Invalid URL
4 const data = await fetch('https://api.invalid-url.com/data');
5 const jsonData = await data.json();
6 console.log(jsonData);
7 } catch (error) {
8 // Catch the error
9 console.error('Failed to fetch data:', error);
10 }
11}
12
13fetchData();try...catch ব্লক ব্যবহার করে আপনি অ্যাসিঙ্ক্রোনাস অপারেশন চলাকালে ঘটে যাওয়া এরর ক্যাচ করতে পারেন এবং এরর ঘটলে প্রোগ্রাম ক্র্যাশ হওয়া প্রতিরোধ করতে পারেন।
async/await এর সুবিধা
প্রচলিত Promise চেইনের তুলনায়, async/await নিম্নলিখিত সুবিধাগুলি প্রদান করে:।
- উন্নত পাঠযোগ্যতা
- অ্যাসিনক্রোনাস প্রসেসিং সিঙ্ক্রোনাস কোডের মতো করে লেখা যায়, ফলে গভীরভাবে নেস্ট করা
Promiseচেইন এবং কলব্যাকের জটিলতা এড়ানো যায়।
- অ্যাসিনক্রোনাস প্রসেসিং সিঙ্ক্রোনাস কোডের মতো করে লেখা যায়, ফলে গভীরভাবে নেস্ট করা
- সহজ ডিবাগিং
- এটি যেহেতু সিঙ্ক্রোনাস কোডের মতো দেখায়, তাই ডিবাগিং এবং এরর হ্যান্ডলিং আরও সহজ হয়ে যায়।
- উন্নত রক্ষণাবেক্ষণযোগ্যতা
- অ্যাসিনক্রোনাস প্রক্রিয়াগুলি আরও সহজভাবে লেখা যায়, ফলে কোড পরিবর্তন বা সংশোধন করা সহজ হয় এবং দীর্ঘমেয়াদে রক্ষণাবেক্ষণযোগ্যতাও বৃদ্ধি পায়।
উদাহরণ: Promise চেইন বনাম async/await
চলেন আমরা Promise চেইন ব্যবহৃত কোড এবং async/await ব্যবহৃত কোডের তুলনা করি।
1// Code using Promise chains
2function fetchDataPromise() {
3 fetch('https://codesparklab.com/json/example.json')
4 .then((response) => response.json())
5 .then((data) => {
6 console.log(data);
7 })
8 .catch((error) => {
9 console.error('Failed to fetch data:', error);
10 });
11}
12
13// Code using async/await
14async function fetchDataAsync() {
15 try {
16 const response = await fetch('https://codesparklab.com/json/example.json');
17 const data = await response.json();
18 console.log(data);
19 } catch (error) {
20 console.error('Failed to fetch data:', error);
21 }
22}async/await ব্যবহার করলে আপনি অ্যাসিনক্রোনাস প্রক্রিয়া সরলরেখায় লিখতে পারেন, যার ফলে কোড আরও পাঠযোগ্য হয়।
একাধিক অ্যাসিঙ্ক্রোনাস অপারেশন একই সাথে সম্পাদন করুন
Promise.all() অথবা Promise.race() কে await এর সাথে যুক্ত করে, আপনি একাধিক অ্যাসিঙ্ক্রোনাস অপারেশন একই সাথে সম্পাদন করতে পারেন এবং তাদের ফলাফল দলবদ্ধভাবে পরিচালনা করতে পারেন।
উদাহরণ: একাধিক অ্যাসিঙ্ক্রোনাস অপারেশন সমসাময়িকভাবে সম্পাদন করা
1async function fetchMultipleData() {
2 try {
3 const [data1, data2] = await Promise.all([
4 fetch('https://codesparklab.com/json/example1.json'),
5 fetch('https://codesparklab.com/json/example2.json')
6 ]);
7 const jsonData1 = await data1.json();
8 const jsonData2 = await data2.json();
9 console.log(jsonData1, jsonData2);
10 } catch (error) {
11 console.error('Failed to fetch data:', error);
12 }
13}
14
15fetchMultipleData();Promise.all() একই সাথে একাধিক Promise সমাধান করে এবং তাদের ফলাফল অ্যারের আকারে প্রদান করে। এটি সকল Promise সমাধান হওয়ার জন্য অপেক্ষা করে, এবং যদি কোনো একটি ব্যর্থ হয়, তবে এটি সামগ্রিকভাবে ব্যর্থতা হিসেবে বিবেচিত হয়।
সারসংক্ষেপ
asyncফাংশন: সর্বদা একটি Promise প্রদান করে এবং অ্যাসিঙ্ক্রোনাস প্রসেসিং লেখার জন্য ব্যবহৃত হয়।await: একটি Promise সমাধান হওয়ার জন্য অপেক্ষা করতে এবং তার ফলাফল গ্রহণ করতে ব্যবহৃত হয়।- ত্রুটি পরিচালনা: অ্যাসিঙ্ক্রোনাস প্রসেসিং চলাকালীন ঘটে যাওয়া ত্রুটি পরিচালনা করতে
try...catchব্যবহার করুন। - আপনার একাধিক অ্যাসিঙ্ক্রোনাস অপারেশন: আপনি
Promise.all()ব্যবহার করে একাধিক অ্যাসিঙ্ক্রোনাস অপারেশন একই সাথে সম্পাদন করতে পারেন।
async/await অ্যাসিঙ্ক্রোনাস প্রসেসিং পরিচালনার জন্য শক্তিশালী টুল, তাই জটিল অ্যাসিঙ্ক্রোনাস লজিক সরল করতে এগুলো ব্যবহার করতে নিশ্চিত হতে হবে।
আপনি আমাদের ইউটিউব চ্যানেলে ভিজ্যুয়াল স্টুডিও কোড ব্যবহার করে উপরের নিবন্ধটি অনুসরণ করতে পারেন। দয়া করে ইউটিউব চ্যানেলটিও দেখুন।