← Blog · 16 Nisan 2026 · ConvertCaseHQ Ekibi · 6 dk okuma

JavaScript değişken adlandırma: camelCase için geliştirici rehberi

JavaScript'te değişkenleri, fonksiyonları, parametreleri ve nesne özelliklerini camelCase (cartTotal, fetchOrders), sınıfları ve React bileşenlerini PascalCase (ShoppingCart) ile adlandırın; CONSTANT_CASE'i ise programın ömrü boyunca sabit kalan değerlere (MAX_RETRIES) saklayın. Google'ın ve Airbnb'nin JavaScript stil kılavuzları bu kadarında hemfikir, JavaScript'in kendi yerleşik öğeleri de aynı örüntüyü izliyor.

Rehberin geri kalanı önce motorun gerçekte neyi zorunlu kıldığını, sonra bunun üstüne eklenen gelenekleri, en sonunda da ekiplerin ayrıştığı sınır durumlarını ele alıyor: hangi const değerlerinin büyük harfi hak ettiği, özel alanlar, kısaltmalar ve bir API'den gelen snake_case veriler.

JavaScript'in kendisi neye izin verir?

Dilin kuralları kısadır. Bir tanımlayıcı harfle, alt çizgiyle ya da dolar işaretiyle başlar; sonraki karakterler rakam da olabilir. Harfler ASCII ile sınırlı değildir: MDN'nin kendi örneği Almanca Früh sözcüğüdür. Adlar büyük/küçük harfe duyarlıdır, yani total ve Total iki ayrı değişkendir; new, class ve delete gibi ayrılmış sözcükler de değişken adı olarak kullanılamaz.

let total = 1;
let Total = 2;      // a different variable
const café = "ok";  // Unicode letters are allowed
const $price = 9.99;
const _unused = null;

// const 2fast = true;  // SyntaxError: can't start with a digit
// const new = 1;       // SyntaxError: reserved word

Özellik adları daha da serbesttir: Tırnak içine alırsanız her dize olur; headers["Content-Type"] bu sayede mümkündür. Bu kuralların ötesindeki her şey gelenektir ve tam da bu yüzden üzerinde anlaşmaya değer.

Değişkenler, fonksiyonlar ve özellikler için camelCase

camelCase, JavaScript'te adlandırdığınız hemen her şey için varsayılandır. Değerlere isim, fonksiyonlara fiil adı verin; böylece bir satır cümle gibi okunur:

const orderCount = orders.length;
const isLoggedIn = Boolean(session);
const user = { firstName: "Ada", lastLogin: null };

function calculateShipping(order) {
  // ...
}

Mantıksal (boolean) değerlerde is, has ya da can öneki (isLoggedIn, hasAccess), “neyin doğru ya da yanlış olduğu?” sorusunu kimse sormadan yanıtlar. Google'ın kılavuzu da boolean getter'lar için aynı önekleri kullanır (isFoo, hasFoo).

Google'ın kılavuzunda uzunluk için de iyi bir kural var: Makul ölçüde olabildiğince açıklayıcı olun ve harf silerek kısaltmayın. errorCount ve customerId geçer; nErr ve cstmrId geçmez. Kılavuzun istisnası, kapsamı on satır ya da daha kısa olan bir değişkendir; kısa bir döngüdeki i ya da points.map((x) => x * 2) içindeki x gibi.

Koleksiyonlar, sayaçlar ve olay işleyicileri

Birkaç örüntü adları öngörülebilir kılar. Dizi için çoğul (users), tek bir öğe için tekil kullanın; böylece for (const user of users) doğal okunur. Bir arama nesnesini anahtarına göre (usersById), bir sayıyı da saydığı şeye göre (userCount) adlandırın. React belgeleri olaylar için yaygın bir gelenek tarif eder: İşleyiciler handle artı olay adıyla (handleClick) adlandırılır, işleyici kabul eden prop'lar ise on ve büyük bir harfle başlar (onClick, onSave).

Sınıflar, yapıcılar ve bileşenler için PascalCase

new ile oluşturduğunuz her şey PascalCase alır; React'in bileşen olarak çizdiği her şey de:

class ShoppingCart {
  addItem(item) {
    // ...
  }
}
const cart = new ShoppingCart();

function OrderSummary({ order }) {
  return <section>{order.id}</section>;
}

Sınıflarda bu bir gelenektir. React'te ise zorunludur: React belgeleri bileşen adlarının büyük harfle başlaması gerektiğini, yoksa çalışmayacaklarını söylüyor; çünkü JSX, <section> gibi küçük harfli etiketleri düz HTML öğesi sayar. TypeScript'te aynı PascalCase arayüzlere, tür takma adlarına ve enum'lara verilir.

Yerleşik öğeler bunların hepsine örnek olur. Yapıcılar PascalCase (Map, Promise, Date), metotlar camelCase (Object.fromEntries, Array.prototype.flatMap), sabit değerler ise büyük harflidir (Math.PI, Number.MAX_SAFE_INTEGER).

CONSTANT_CASE ne zaman kullanılır (ve ne zaman kullanılmaz)

Sabitler en çok kafa karıştıran konudur, çünkü const “sabit” demek değildir. Yalnızca değişkenin yeniden atanmasını engeller; işaret ettiği dizi ya da nesne yine de değişebilir. İki büyük stil kılavuzu da büyük harfi daha katı bir şeye ayırır:

Google: CONSTANT_CASE, modül düzeyindeki (ve statik özelliklerdeki) derinlemesine değişmez değerler içindir. Bir nesneyi hiç değiştirmemeyi amaçlamak yetmez; fonksiyonların içinde tanımlanan sabitler ise lowerCamelCase kalır.
Airbnb: Büyük harf isteğe bağlıdır ve yalnızca dışa aktarılan, const ile tanımlanan ve (iç içe özellikleri dahil) hiç değişmeyeceğine güvenilebilen değerler içindir. Bir dosyadaki her const'u büyük harfe çevirmek gereksizdir.

// Module level, never changes: capitals
export const MAX_UPLOAD_BYTES = 5 * 1024 * 1024;
export const ORDER_STATUS = Object.freeze({ PENDING: "pending", SHIPPED: "shipped" });

function visibleNames(items) {
  const visible = items.filter((item) => !item.hidden); // const, but not a constant
  const names = [];                                     // const binding, mutable array
  for (const item of visible) names.push(item.name);
  return names;
}

Kılavuzlar, enum benzeri bir nesnenin anahtarlarında ayrılır. Google, enum üyelerini yukarıdaki gibi CONSTANT_CASE yazar; Airbnb ise büyük harfli bir dışa aktarımın içinde küçük harfli anahtarları tercih eder. Bütün kod tabanı aynısını yapıyorsa ikisi de uygundur. Bir tuzak daha: Object.freeze sığdır; yani dondurulmuş bir nesne yine de değişebilen iç içe bir nesne barındırabilir.

Özel alanlar: alt çizgi değil, # kullanın

“Özel” üyeleri başa alt çizgi koyarak işaretleme alışkanlığı (this._count) yalnızca bir ipucudur; herkes özelliği yine okuyup yazabilir. Airbnb'nin kılavuzu tam da bu nedenle başta ya da sonda alt çizgi kullanılmamasını söyler; Google'ın TypeScript kılavuzu da bunları önek ve sonek olarak yasaklar. Modern JavaScript'in gerçek özel alanları var:

class Counter {
  #count = 0;
  increment() {
    return ++this.#count;
  }
}

const counter = new Counter();
counter.increment();
counter.count;   // undefined
// counter.#count  // SyntaxError outside the class

Kısaltmalar: userId mi, userID mi?

Google'ın kuralı kısaltmaları sıradan sözcük gibi ele almaktır: customerId, xmlHttpRequest, loadHttpUrl. Airbnb'ninki bunun tersi: Bir kısaltmayı ya tamamen büyük ya tamamen küçük harfle tutun, SMSContainer ya da httpRequests gibi. Tarayıcının kendisi bile karar verememiş: XMLHttpRequest, innerHTML, getElementById ve encodeURIComponent aynı platformda yan yana duruyor.

Biz Google'ın kuralını seçerdik, çünkü öngörülebilir, sözcük sınırlarını görünür tutar ve büyük/küçük harf stilleri arasında temiz biçimde dönüşür. Ama tutarlılık, seçimden daha önemli. Her büyük kılavuzun kısaltma kuralını camelCase ile PascalCase yazımızda karşılaştırıyoruz.

API'lerden gelen snake_case verilerle başa çıkmak

Python, Ruby ya da bir SQL veritabanının desteklediği API'ler çoğunlukla size first_name gibi anahtarlar verir. Bunların kodunuza yayılmasına izin vermeyin. Verinin geldiği noktada yeniden adlandırın; parçalama (destructuring) bunu tek satıra indirir:

const response = await fetch("/api/users/42");
const { first_name: firstName, last_login: lastLogin } = await response.json();

Yüklerin tamamı için, anahtarları özyinelemeli olarak dönüştüren, her yön için küçük bir fonksiyon yazın ve API istemcinizde çağırın; bunlardan birini camelCase JSON'u snake_case'e dönüştürme yazımızda adım adım gösteriyoruz. Tek seferlik bir yeniden adlandırma için büyük/küçük harf dönüştürücümüz last_login adını tek tıkla lastLogin yapar.

ESLint ile zorunlu kılın

İki temel ESLint kuralı bunların çoğunu kapsar. camelcase, adların ortasındaki alt çizgileri işaretler; tamamı büyük harf olan sabitleri ve baştaki ya da sondaki alt çizgileri görmezden gelir. new-cap ise küçük harfli bir adla kullanılan new'i ve new olmadan çağrılan, büyük harfle başlayan bir fonksiyonu işaretler.

// eslint.config.js
export default [
  {
    rules: {
      camelcase: ["error", { properties: "never" }],
      "new-cap": "error",
    },
  },
];

properties: "never" seçeneği, camelcase kuralının data.first_name gibi API alanlarından şikâyet etmesini durdurur, ama tanımladığınız değişkenleri yine denetler. TypeScript projelerinde @typescript-eslint/naming-convention daha da ileri gider ve her tür tanımlayıcı (değişkenler, fonksiyonlar, sınıflar, tür parametreleri ve daha fazlası) için izin verilen biçimi ayarlamanıza olanak tanır. Google'ın kurallarının tamamı Google JavaScript Style Guide belgesinde.

JavaScript değişken adlandırma kontrol listesi

Değişkenler, fonksiyonlar, parametreler, metotlar ve özellikler için camelCase.
Sınıflar, yapıcılar, React bileşenleri ile TypeScript türleri, arayüzleri ve enum'ları için PascalCase.
Hiç değişmeyen modül düzeyi değerler için CONSTANT_CASE; her const için değil.
Alt çizgi önekleri yerine #private alanlar.
Katkı rehberinize yazılmış tek bir kısaltma kuralı.
snake_case API anahtarları, bir kez ve sınırda dönüştürülmüş.