JavaScript Kopya Kâğıdı
Modern JavaScript için aranabilir, yazdırılabilir bir başvuru — sözdizimi, diziler, dizeler, nesneler, async/await, DOM ve ES2022+ özellikleri. Ücretsiz.
Değişkenler ve türler
10let x = 1;
Blok kapsamlı, yeniden atanabilir değişken
const PI = 3.14;
Blok kapsamlı sabit bağlama
typeof value
Türü string olarak döndürür
Number('42')
Bir string'i sayıya çevir
String(42)
Bir değeri string'e çevir
parseInt('42px', 10)
Baştaki tam sayıyı ayrıştır (taban 10)
Boolean(0)
Bir değeri true/false'a zorla
value ?? 'default'
Nullish birleştirme (yalnızca null/undefined)
a?.b?.c
Optional chaining, null'da kısa devre yapar
Array.isArray(x)
Bir değerin dizi olup olmadığını kontrol et
Fonksiyonlar
9function add(a, b) { return a + b; }
Adlandırılmış fonksiyon bildirimi
const add = (a, b) => a + b;
Örtük dönüşlü arrow fonksiyon
const f = (a = 1) => a;
Varsayılan parametre değeri
function f(...args) {}
Rest parametreleri bir dizide toplanır
f(...arr)
Bir diziyi argümanlara yay
const { a, b } = obj;
Nesne yapı çözümü
const [x, y] = arr;
Dizi yapı çözümü
(function(){})()
Hemen çağrılan fonksiyon (IIFE)
fn.bind(this)
Sabit bir this bağlamı bağla
String'ler
10`Hello ${name}`
Template literal enterpolasyonu
str.length
Karakter sayısı
str.includes('a')
Alt dizginin var olup olmadığını kontrol et
str.slice(0, 3)
String'in bir kısmını çıkar
str.replace(/a/g, 'b')
Eşleşmeleri değiştir (regex)
str.split(',')
Bir diziye böl
str.trim()
Çevredeki boşlukları kaldır
str.toUpperCase()
Büyük harfe çevir
str.padStart(3, '0')
Başı bir uzunluğa doldur
str.at(-1)
İndeksteki karakter (negatifleri destekler)
Diziler
11arr.map(x => x * 2)
Her öğeyi dönüştür
arr.filter(x => x > 0)
Eşleşen öğeleri tut
arr.reduce((a, b) => a + b, 0)
Tek bir değere indirge
arr.find(x => x.id === 1)
İlk eşleşen öğe
arr.some(x => x > 0)
Herhangi bir öğe eşleşirse true
arr.every(x => x > 0)
Tüm öğeler eşleşirse true
arr.includes(3)
Bir değeri kontrol et
arr.sort((a, b) => a - b)
Sayısal artan sıralama
[...new Set(arr)]
Yinelenen değerleri kaldır
arr.flat(Infinity)
İç içe dizileri tamamen düzleştir
arr.at(-1)
Son öğe (negatif indeks)
Nesneler
9Object.keys(obj)
Kendi sıralanabilir anahtarlarının dizisi
Object.values(obj)
Kendi değerlerinin dizisi
Object.entries(obj)
[anahtar, değer] çiftleri dizisi
{ ...a, ...b }
Nesneleri birleştir (spread)
Object.assign({}, a, b)
Bir hedefe kopyala/birleştir
Object.freeze(obj)
Bir nesneyi değişmez yap
{ [key]: value }
Hesaplanmış özellik adı
obj.hasOwnProperty('x')
Kendi özelliğini kontrol et
structuredClone(obj)
Bir nesneyi derin klonla
Async ve promise'ler
9async function f() {}
Bir async fonksiyon tanımla
await fetch(url)
Bir promise çözülene kadar duraklat
Promise.all([p1, p2])
Hepsinin çözülmesini bekle
Promise.allSettled([p1, p2])
Hepsinin sonuçlanmasını bekle
Promise.race([p1, p2])
İlk sonuçlananla çöz
new Promise((res, rej) => {})
Manuel olarak bir promise oluştur
try { await f(); } catch (e) {}
Async hatalarını işle
setTimeout(fn, 1000)
Bir gecikmeden sonra çalıştır (ms)
queueMicrotask(fn)
Bir microtask zamanla
Akış kontrolü
9if (a) {} else if (b) {} else {}
Koşullu dallar
a ? b : c
Ternary ifadesi
switch (x) { case 1: break; }
Çok yönlü dallanma
for (const x of arr) {}
Değerleri yinele (iterable'lar)
for (const k in obj) {}
Nesne anahtarlarını yinele
while (cond) {}
Bir koşul geçerliyken döngü
arr.forEach((x, i) => {})
Her öğe için bir callback çalıştır
break / continue
Bir döngü yinelemesinden çık veya atla
label: for (...) { break label; }
İç içe döngülerden çık
DOM ve olaylar
10document.querySelector('.x')
İlk eşleşen öğe
document.querySelectorAll('.x')
Tüm eşleşen öğeler (NodeList)
el.addEventListener('click', fn)
Bir olay dinleyici ekle
el.classList.toggle('active')
Bir CSS sınıfını değiştir
el.dataset.id
Bir data-id özniteliğini oku
el.textContent = 'hi'
Metni güvenle ayarla (HTML yok)
el.setAttribute('aria-hidden', true)
Bir öznitelik ayarla
e.preventDefault()
Varsayılan eylemi iptal et
el.closest('.parent')
En yakın eşleşen üst öğe
document.createElement('div')
Yeni bir öğe oluştur
Sınıflar ve modüller
9class A extends B {}
Kalıtımlı sınıf
constructor() { super(); }
Başlat ve üst öğeyi çağır
#private = 1;
Özel sınıf alanı
static create() {}
Sınıf üzerinde statik metot
get value() {}
Getter erişimcisi
export default fn;
Varsayılan modül dışa aktarımı
export { a, b };
Adlandırılmış modül dışa aktarımları
import x, { y } from './m.js'
Varsayılan + adlandırılmış içe aktarımlar
const m = await import('./m.js')
Dinamik import
“:q” ile eşleşen bir girdi yok.
Yardıma mı ihtiyacınız var?
Bu araçta bir sorun mu buldunuz? Ekibimize bildirin.