JavaScript tarz rehberi

Tüm JavaScript projelerinizde her zaman aynı kod anlaşmalarını kullanın.

JavaScript kod anlaşmaları

Kod anlaşmaları (Coding conventions) şu anlama gelir:Programlama tarzı yönlendirme talimatlarıBu ilkeler genellikle şunları içerir:

  • Değişken ve fonksiyon adlandırma ve beyan kuralları
  • Boşluk, içe aktarma ve yorumlama kuralları
  • Programlama alışkanlıkları ve kurallar

Kod anlaşmalarıKaliteyi sağlama:

  • Kodun okunabilirliğini artırma
  • Kodun bakımını kolaylaştırma

Kod anlaşmaları, takımınız tarafından izlenen yazılılmış kurallar veya kişisel kod alışkanlıklarınız olabilir.

Bu sayfa, CodeW3C.com tarafından kullanılan genel JavaScript kod anlaşmalarını tanıtmaktadır.

Sizi bir sonraki bölüm

变量名

在 CodeW3C.com，我们对标识符名称（变量和函数）使用了驼峰式大小写.

所有名称以字母开头。

在本页的底部，我们会更广泛地讨论命名规则。

firstName = "Bill";
lastName = "Gates";
price = 19.90;
tax = 0.20;
fullPrice = price + (price * tax);

运算符周围的空格

始终在运算符（ = + - * / ）周围以及逗号之后添加空格：

Örnek

var x = y + z;
var values = ["Volvo", "Saab",  "Fiat"];

代码缩进

始终使用对代码块缩进使用 4 个空格：

函数

function toCelsius(fahrenheit) {
    return (5 / 9) * (fahrenheit - 32);
}

请不要对缩进使用制表符。不同的编辑器对 tab 的解释也不尽相同。

语句规则

简单语句的通用规则：

始终以分号结束单条语句：

Örnek

var values = ["Volvo", "Saab",  "Fiat"];
var person = {
    firstName: "Bill",
     lastName: "Gates",
    age: 50,
    eyeColor:  "blue"
};

复杂语句的通用规则：

  • 在第一行的结尾处写开括号
  • 在开括号前使用一个空格
  • 在新行上写闭括号，不带前导空格
  • 不要以分号来结束复杂语句

函数：

function toCelsius(fahrenheit) {
    return (5 / 9) * (fahrenheit - 32);
}

循环：

for (i = 0; i < 5; i++) {
    x += i;
}

条件：

if (time < 20) {
    greeting = "Good day";
} else {
     greeting = "Good evening";
}

对象规则

对象定义的通用规则：

  • 把开括号与对象名放在同一行
  • 在每个属性与其值之间使用冒号加一个空格
  • 不要在最后一个属性值对后面写逗号
  • 在新行上写闭括号，不带前导空格
  • 始终以分号结束对象定义

Örnek

var person = {
    firstName: "Bill",
    lastName: "Gates",
    age: 19,
    eyeColor:  "blue"
};

短对象可以在一行中压缩，只在属性之间使用空格，就像这样：

var person = {firstName:"Bill", lastName:"Gates", age:50, eyeColor:"blue"};

Satır uzunluğu 80'den küçük

Okunabilirliği artırmak için, her satırın uzunluğunu 80 karakterden fazla tutmamak gereklidir.

JavaScript ifadeleri bir satırın uzunluğunu aşarsa, en iyi satır değişimi nokta işareti veya virgülün ardından olur.

Örnek

document.getElementById("demo").innerHTML =
    "Hello Kitty.";

Kişisel olarak deneyin

Adlandırma anlaşması

Tüm kodlarınız için aynı adlandırma anlaşmasını kullanmanız gerektiğini her zaman unutmayın. Örneğin:

  • Değişken ve fonksiyon adlarıat kuyruk büyük küçük harfyazmak
  • Küresel değişkenler kullanılırBüyük harf(Bu yapmayız, ancak oldukça yaygındır)
  • Sabitler (örneğin PI) kullanılırBüyük harf

Değişken adlarında kullanmamız gerekip gerekmediğinetireveat kuyruk büyük küçük harfveyaAlt çizgimi?

Bu, programcılar arasında sıkça tartışılan bir sorudur. Cevap, bu soruyu kimin yanıtladığına bağlıdır:

HTML ve CSS'deki tireler:

HTML5 özellikleri data- ile başlayabilir (data-quantity, data-price).

CSS, property-names'de tire kullanır (font-size).

Tireler yanlışlıkla çarpma işareti olarak algılabilir. JavaScript adlandırma, tire kullanımına izin vermez.

Alt çizgi:

Birçok programcı alt çizgiyi (date_of_birth) özellikle SQL veritabanlarında kullanmayı tercih eder.

Alt çizgi genellikle PHP referanslarında kullanılır.

Pascal adlandırma yöntemi (PascalCase):

C dil programcıları genellikle Pascal adlandırma yöntemini kullanır.

At kuyruk büyük küçük harf (camelCase):

JavaScript kendisi, jQuery ve diğer JavaScript kütüphaneleri at kuyruk büyük küçük harf (camelCase) kullanır.

JavaScript adlandırma, $ işaretiyle başlamamalıdır. Bu, JavaScript kütüphanesi adlandırma çatışmasına neden olabilir.

HTML'de JavaScript yükleme

Dışarıdan script yüklemek için basit bir dil kullanın (type özelliği zorunlu değildir):

<script src="myscript.js"></script>

HTML elementlerine erişim

“Düzensiz” HTML stillerinin sonuçları, belki de JavaScript hatalarına neden olabilir.

Bu iki JavaScript ifadesi farklı sonuçlar üretebilir:

var obj = getElementById("Demo")
var obj = getElementById("demo")

Eğer mümkünse, HTML'de aynı adlandırma anlaşmasını kullanın (JavaScript gibi).

HTML Styl Sheet Kılavuzu'na erişim.

dosya uzantıları

HTML dosyaları .html Uzantı (değil .htm)

CSS dosyaları .css Uzantı.

JavaScript dosyaları .js Uzantı.

Küçük harf dosya adları kullanın

Çoğu web sunucusu (Apache, Unix) dosya adlarının büyük-küçük harfe duyarlıdır:

london.jpg London.jpg olarak erişilemez.

Diğer web sunucuları (Microsoft'un IIS) büyük-küçük harfe duyarlı değildir:

london.jpg London.jpg veya london.jpg olarak erişilebilir.

Eğer büyük-küçük harf karışımı kullanıyorsanız, kesin ve tutarlı kalmanız gerekir.

Eğer站点从大小写不敏感的服务器转移到对大小写敏感的服务器，即使这种小错误也可能破坏您的网站。

Bu sorunları önlemek için mümkünse her zaman küçük harf dosya adları kullanın.

Performans

Bilgisayarlar kod anlaşmaları kullanmaz. Çoğu kural, programın çalışmasına çok az etki eder.

Sınırlı betikler için yatay kayma ve ek boşluklar önemli değildir.

Geliştirme sırasındaki betikler için okunabilirlik öncelikli olmalıdır. Daha büyük üretim betiklerini küçültmek gerekir.