JavaScript চিট শিট
আধুনিক JavaScript-এর একটি অনুসন্ধানযোগ্য, প্রিন্টযোগ্য রেফারেন্স — সিনট্যাক্স, অ্যারে, স্ট্রিং, অবজেক্ট, async/await, DOM এবং ES2022+ ফিচার। বিনামূল্যে।
ভেরিয়েবল ও টাইপ
10let x = 1;
ব্লক-স্কোপড, পুনঃনির্ধারণযোগ্য ভেরিয়েবল
const PI = 3.14;
ব্লক-স্কোপড const বাইন্ডিং
typeof value
টাইপ স্ট্রিং হিসেবে ফেরত দেয়
Number('42')
স্ট্রিংকে number-এ রূপান্তর
String(42)
মানকে স্ট্রিং-এ রূপান্তর
parseInt('42px', 10)
শুরুর integer পার্স (base 10)
Boolean(0)
মানকে true/false-এ রূপান্তর
value ?? 'default'
Nullish coalescing (শুধু null/undefined)
a?.b?.c
Optional chaining, null-এ থেমে যায়
Array.isArray(x)
মান array কিনা যাচাই
ফাংশন
9function add(a, b) { return a + b; }
নামযুক্ত function ঘোষণা
const add = (a, b) => a + b;
অন্তর্নিহিত return সহ arrow function
const f = (a = 1) => a;
ডিফল্ট প্যারামিটার মান
function f(...args) {}
Rest প্যারামিটার array-তে জমা হয়
f(...arr)
Array-কে arguments হিসেবে spread
const { a, b } = obj;
Object destructuring
const [x, y] = arr;
Array destructuring
(function(){})()
তাৎক্ষণিক-চালিত ফাংশন (IIFE)
fn.bind(this)
নির্দিষ্ট this কনটেক্সট bind
স্ট্রিং
10`Hello ${name}`
Template literal ইন্টারপোলেশন
str.length
অক্ষরের সংখ্যা
str.includes('a')
substring আছে কিনা যাচাই
str.slice(0, 3)
স্ট্রিংয়ের অংশ বের করা
str.replace(/a/g, 'b')
মিল প্রতিস্থাপন (regex)
str.split(',')
Array-তে ভাগ করা
str.trim()
চারপাশের whitespace সরানো
str.toUpperCase()
বড় হাতের অক্ষরে রূপান্তর
str.padStart(3, '0')
শুরু একটি দৈর্ঘ্যে pad করা
str.at(-1)
index-এ অক্ষর (ঋণাত্মক সমর্থিত)
Array
11arr.map(x => x * 2)
প্রতিটি উপাদান রূপান্তর
arr.filter(x => x > 0)
মিলযুক্ত উপাদান রাখা
arr.reduce((a, b) => a + b, 0)
একটি মানে reduce করা
arr.find(x => x.id === 1)
প্রথম মিলযুক্ত উপাদান
arr.some(x => x > 0)
কোনো উপাদান মিললে true
arr.every(x => x > 0)
সব উপাদান মিললে true
arr.includes(3)
মান আছে কিনা যাচাই
arr.sort((a, b) => a - b)
সংখ্যাগত ঊর্ধ্বক্রম sort
[...new Set(arr)]
ডুপ্লিকেট মান সরানো
arr.flat(Infinity)
নেস্টেড array সম্পূর্ণ flatten
arr.at(-1)
শেষ উপাদান (ঋণাত্মক index)
Object
9Object.keys(obj)
নিজস্ব enumerable key-এর array
Object.values(obj)
নিজস্ব মানের array
Object.entries(obj)
[key, value] জোড়ার array
{ ...a, ...b }
Object মার্জ (spread)
Object.assign({}, a, b)
target-এ কপি/মার্জ
Object.freeze(obj)
Object immutable করা
{ [key]: value }
Computed property নাম
obj.hasOwnProperty('x')
নিজস্ব property আছে কিনা যাচাই
structuredClone(obj)
Object-এর deep clone
Async ও promise
9async function f() {}
async function ঘোষণা
await fetch(url)
promise resolve হওয়া পর্যন্ত অপেক্ষা
Promise.all([p1, p2])
সব resolve হওয়ার অপেক্ষা
Promise.allSettled([p1, p2])
সব settle হওয়ার অপেক্ষা
Promise.race([p1, p2])
প্রথম settle হওয়াটি দিয়ে resolve
new Promise((res, rej) => {})
ম্যানুয়ালি promise তৈরি
try { await f(); } catch (e) {}
async এরর হ্যান্ডল
setTimeout(fn, 1000)
বিলম্বের পর চালানো (ms)
queueMicrotask(fn)
microtask শিডিউল
কন্ট্রোল ফ্লো
9if (a) {} else if (b) {} else {}
শর্তাধীন শাখা
a ? b : c
Ternary এক্সপ্রেশন
switch (x) { case 1: break; }
বহু-পথ শাখা
for (const x of arr) {}
মান iterate (iterable)
for (const k in obj) {}
object key iterate
while (cond) {}
শর্ত বহাল থাকা পর্যন্ত loop
arr.forEach((x, i) => {})
প্রতি উপাদানে callback চালানো
break / continue
loop থেকে বের বা iteration বাদ
label: for (...) { break label; }
নেস্টেড loop থেকে break
DOM ও ইভেন্ট
10document.querySelector('.x')
প্রথম মিলযুক্ত উপাদান
document.querySelectorAll('.x')
সব মিলযুক্ত উপাদান (NodeList)
el.addEventListener('click', fn)
event listener যুক্ত করা
el.classList.toggle('active')
CSS class টগল
el.dataset.id
data-id অ্যাট্রিবিউট পড়া
el.textContent = 'hi'
নিরাপদে টেক্সট সেট (HTML ছাড়া)
el.setAttribute('aria-hidden', true)
অ্যাট্রিবিউট সেট
e.preventDefault()
ডিফল্ট অ্যাকশন বাতিল
el.closest('.parent')
নিকটতম মিলযুক্ত ancestor
document.createElement('div')
নতুন element তৈরি
Class ও module
9class A extends B {}
উত্তরাধিকার সহ class
constructor() { super(); }
প্যারেন্ট ইনিশিয়ালাইজ ও কল
#private = 1;
প্রাইভেট class ফিল্ড
static create() {}
class-এ static মেথড
get value() {}
Getter অ্যাক্সেসর
export default fn;
ডিফল্ট module export
export { a, b };
নামযুক্ত module export
import x, { y } from './m.js'
ডিফল্ট + নামযুক্ত import
const m = await import('./m.js')
Dynamic import
“:q”-এর সাথে কোনো এন্ট্রি মেলে না।
সাহায্য দরকার?
এই টুলে কোনো সমস্যা পেয়েছেন? আমাদের দলকে জানান।