Najnowsze tutoriale tworzenie stron internetowych
 

JavaScript Najlepsze praktyki

❮ Poprzedni Następny Rozdział ❯

Unikaj zmiennych globalnych, unikać new , unikać == unikać eval()

Unikać Zmienne globalne

Zminimalizować wykorzystanie zmiennych globalnych.

Obejmuje wszystkie typy danych, obiektów i funkcji.

Zmienne globalne i funkcje mogą być zastępowane przez inne skrypty.

Za pomocą zmiennych lokalnych zamiast, i nauczyć się korzystać z zamknięć .

Zawsze Zadeklaruj zmienne lokalne

Wszystkie zmienne używane w funkcji powinny być zadeklarowane jako zmienne lokalne.

Zmienne lokalne musi być zadeklarowana z var hasła, w przeciwnym razie będą one zmienne globalne.

Tryb ścisły nie pozwala na zmienne nierejestrowanej.

Deklaracje na szczycie

Jest to dobra praktyka, kodowanie umieścić wszystkie deklaracje na szczycie każdego skryptu lub funkcji.

Ta wola:

  • Daj czystsze kod
  • Podaj jedno miejsce do poszukiwania zmiennych lokalnych
  • Łatwiej uniknąć niepożądanych (domniemanych) zmiennych globalnych
  • Ograniczyć możliwość ponownych zgłoszeń niepożądanych
// 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;

To samo odnosi się do zmiennych pętli:

// Declare at the beginning
var i;

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

Domyślnie JavaScript porusza wszystkie deklaracje na górę (podnoszenia JavaScript).

Inicjalizacja zmiennych

Jest to dobra praktyka, aby zainicjować zmienne kodowanie podczas ich podawania.

Ta wola:

  • Daj czystsze kod
  • Podaj jedno miejsce do inicjalizacji zmiennych
  • Unikaj wartości niezdefiniowane
// Declare and initiate at the beginning
var firstName = "",
    lastName = "",
    price = 0,
    discount = 0,
    fullPrice = 0,
    myArray = [],
    myObject = {};

Inicjowanie zmiennych przedstawiono ideę przeznaczenia (i przeznaczone typ danych).

Nigdy stwierdzenie, liczba, ciąg znaków lub obiektów Boolean

Zawsze traktować ciągi cyfr lub wartości logicznych jako wartości pierwotnych. Nie jako obiektów.

Deklarowanie tych typów jako obiekty, spowalnia szybkość wykonania i wytwarza nieprzyjemnych skutków ubocznych:

Przykład

var x = "John";             
var y = new String("John");
(x === y) // is false because x is a string and y is an object.
Spróbuj sam "

Albo jeszcze gorzej:

Przykład

var x = new String("John");             
var y = new String("John");
(x == y) // is false because you cannot compare objects.
Spróbuj sam "

Nie używaj new Object()

  • Użyj {} zamiast new Object()
  • Użyj "" zamiast new String()
  • Użyj 0 zamiast new Number()
  • Użyj false zamiast new Boolean()
  • Użyj [] zamiast new Array()
  • Użyj /()/ zamiast new RegExp()
  • Użyj function (){} zamiast new Function()

Przykład

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
Spróbuj sam "

Strzeż Automatyczna Konwersje

Pamiętaj, że liczby mogą być przypadkowo zamienione na łańcuchy lub NaN (Not a Number).

JavaScript jest luźno wpisane. Zmienna może zawierać różne typy danych, a zmienna może zmienić jej typ danych:

Przykład

var x = "Hello";     // typeof x is a string
x = 5;               // changes typeof x to a number
Spróbuj sam "

Podczas wykonywania operacji matematycznych, JavaScript może konwersji liczb na łańcuchy:

Przykład

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
Spróbuj sam "

Odjęcie ciąg z ciągu znaków, nie generuje błąd, ale zwraca NaN (Not a Number):

Przykład

"Hello" - "Dolly"    // returns NaN
Spróbuj sam "

Użyj === Porównanie

== Operator porównania zawsze konwertuje (w celu dopasowania typów) przed porównaniem.

=== Porównanie siły operatora wartości i rodzaju:

Przykład

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

0 === "";       // false
1 === "1";      // false
1 === true;     // false
Spróbuj sam "

Użyj ustawień domyślnych parametrów

Jeśli funkcja jest wywoływana z brakującym argumentem, wartość brakujących argumentów ma wartość undefined .

Wartości niezdefiniowane może złamać kod. Jest to dobry zwyczaj, aby przypisać wartości domyślne argumentów.

Przykład

function myFunction(x, y) {
    if (y === undefined) {
        y = 0;
    }
}
Spróbuj sam "

Czytaj więcej na temat parametrów funkcji i argumentów na parametry funkcji

Koniec przełączniki domyślne

Zawsze kończy swoje wypowiedzi Przełącznik z niewykonania zobowiązania. Nawet jeśli uważasz, że nie ma takiej potrzeby.

Przykład

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";
}
Spróbuj sam "

Należy unikać stosowania eval()

eval() Funkcja ta służy do uruchomienia tekst jako kod. W prawie wszystkich przypadkach nie powinno być konieczne, aby go używać.

Ponieważ umożliwia wykonanie dowolnego kodu do uruchomienia, jest to także problem bezpieczeństwa.


❮ Poprzedni Następny Rozdział ❯