En son web geliştirme öğreticiler
 

JavaScript En İyi Uygulamalar


Global değişkenleri kaçının önlemek new , önlemek == önlemek eval()


Küresel Değişkenler kaçının

Küresel değişkenlerin kullanımını en aza indirin.

Bu, tüm veri türlerini, nesne ve işlevleri içerir.

Küresel değişkenler ve fonksiyonlar diğer komut tarafından üzerine yazılabilir.

Yerine yerel değişkenler kullanın ve nasıl kullanılacağını öğrenmek kapanışlarını .


Daima Yerel Değişkenler beyan

Bir işlevde kullanılan tüm değişkenler yerel değişkenler olarak beyan edilmelidir.

Yerel değişkenler ile beyan edilmesi gerekir var aksi takdirde küresel değişkenler haline gelecek, anahtar kelime.

Katı mod bildirilmemiş değişkenler izin vermez.


Üstte Bildirimleri

Her komut dosyası veya fonksiyonun üstünde tüm bildirimleri koymak için iyi bir kodlama uygulamadır.

Bu irade:

  • temizleyici kodu ver
  • Yerel değişkenler için bakılacak tek yer sağlamak
  • Daha kolay istenmeyen önlemek için yapın (implied) genel değişkenleri
  • İstenmeyen yeniden beyanname olasılığını azaltın
// Declare at the beginning
var firstName, lastName, price, discount, fullPrice;

// Use later
firstName = "John";
lastName = "Doe";

price = 19.90;
discount = 0.10;

fullPrice = price * 100 / discount;

Bu aynı zamanda döngü değişkenleri için de geçerli:

// Declare at the beginning
var i;

// Use later
for (i = 0; i < 5; i++) {

Varsayılan olarak, JavaScript üst tüm bildirimleri taşır (JavaScript hoisting) .


Değişkenler başlat

Bildirirken değişkenlerini başlatmak için iyi bir kodlama uygulamadır.

Bu irade:

  • temizleyici kodu ver
  • değişkenlerini başlatmak için tek bir yer sağlamak
  • tanımsız değerler kaçının
// Declare and initiate at the beginning
var firstName = "",
    lastName = "",
    price = 0,
    discount = 0,
    fullPrice = 0,
    myArray = [],
    myObject = {};

Değişkenlerini başlatma amaçlanan kullanımı hakkında bir fikir sunar (and intended data type) .


Numara, Dize veya Boole Nesneleri beyan Asla

Her zaman ilkel değerler olarak sayılar, dizeleri, Mantıksal değerlere davranın. Değil nesneler olarak.

nesneler olarak, bu tür bildirilmesi, yürütme hızı yavaşlar ve kötü yan etkiye neden olur:

Örnek

var x = "John";             
var y = new String("John");
(x === y) // is false because x is a string and y is an object.
Kendin dene "

Ya da daha kötüsü:

Örnek

var x = new String("John");             
var y = new String("John");
(x == y) // is false because you cannot compare objects.
Kendin dene "

Bunu Kullanma new Object()

  • Kullan {} yerine new Object()
  • Kullan "" yerine new String()
  • Kullanım 0 yerine new Number()
  • Kullanım false yerine new Boolean()
  • Kullan [] yerine new Array()
  • Kullan /()/ yerine new RegExp()
  • Kullanın function () {} yerine new Function()

Örnek

var x1 = {};           // new object
var x2 = "";           // new primitive string
var x3 = 0;            // new primitive number
var x4 = false;        // new primitive boolean
var x5 = [];           // new array object
var x6 = /()/;         // new regexp object
var x7 = function(){}; // new function object
Kendin dene "

Otomatik Tipi Dönüşümler dikkat

Sayılar yanlışlıkla dizeleri veya dönüştürülebilir olduğunu dikkat NaN (Sayı Değil).

JavaScript gevşek yazılır. Bir değişken, farklı veri tipleri içerebilir ve değişken veri türü değiştirebilir:

Örnek

var x = "Hello";     // typeof x is a string
x = 5;               // changes typeof x to a number
Kendin dene "

matematiksel işlemler yaparken, JavaScript dizeleri numaralar dönüştürebilirsiniz:

Örnek

var x = 5 + 7;       // x.valueOf() is 12,  typeof x is a number
var x = 5 + "7";     // x.valueOf() is 57,  typeof x is a string
var x = "5" + 7;     // x.valueOf() is 57,  typeof x is a string
var x = 5 - 7;       // x.valueOf() is -2,  typeof x is a number
var x = 5 - "7";     // x.valueOf() is -2,  typeof x is a number
var x = "5" - 7;     // x.valueOf() is -2,  typeof x is a number
var x = 5 - "x";     // x.valueOf() is NaN, typeof x is a number
Kendin dene "

Bir hata oluşturmaz, bir dizeden bir dize çıkarılarak ama döndürür NaN (Not a Number) :

Örnek

"Hello" - "Dolly"    // returns NaN
Kendin dene "

Kullanım === Karşılaştırma

== karşılaştırma operatörü her zaman dönüştürür (to matching types) karşılaştırmadan önce.

=== değerleri ve Çeşidi operatör kuvvetleri karşılaştırması:

Örnek

0 == "";        // true
1 == "1";       // true
1 == true;      // true

0 === "";       // false
1 === "1";      // false
1 === true;     // false
Kendin dene "

Parametre Varsayılanları kullan

Bir işlev eksik bir argüman ile çağrılırsa, eksik argüman değeri olarak ayarlanır undefined .

Tanımsız değerler kodunu bozabilir. Argümanları varsayılan değerleri atamak için iyi bir alışkanlıktır.

Örnek

function myFunction(x, y) {
    if (y === undefined) {
        y = 0;
    }
}
Kendin dene "

En fonksiyon parametreleri ve argümanları hakkında daha fazlasını okuyun Fonksiyon Parametreleri


Varsayılan Your Anahtarlar End

Her zaman varsayılan ile anahtar ifadeleri sonunda. Bile bunun için gerek yoktur düşünüyorum.

Örnek

switch (new Date().getDay()) {
    case 0:
        day = "Sunday";
        break;
    case 1:
        day = "Monday";
        break;
    case 2:
        day = "Tuesday";
        break;
    case 3:
        day = "Wednesday";
        break;
    case 4:
        day = "Thursday";
        break;
    case 5:
        day = "Friday";
        break;
    case 6:
        day = "Saturday";
        break;
    default:
        day = "Unknown";
}
Kendin dene "

Kullanma kaçının eval()

eval() işlev kodu olarak metin çalıştırmak için kullanılır. Neredeyse her durumda, onu kullanmak için gerekli olmamalıdır.

o kodun çalıştırılmasına izin verir, çünkü aynı zamanda bir güvenlik sorunu teşkil etmektedir.