JavaScriptin parhaat käytännöt

Vältä globaaleja muuttujia,new,===,eval()

Vältä globaaleja muuttujia

Vältä käyttämästä globaaleja muuttujia mahdollisimman paljon.

Sisältää kaikki datatyypit, objektit ja funktiot.

Globaalit muuttujat ja funktiot voidaan korvata toisilla skripteillä.

Käytä paikallisia muuttujia ja oppi, miten käyttääSuljetut lohkot

Ilmoitetaan aina paikalliset muuttujat

Kaikki muuttujat, joita käytetään funktiossa, tulisi ilmoittaa paikallisiksipaikallinenmuuttuja

paikallinen muuttujaonkautta var Muuttujia määritellään avainsanoilla, muuten ne muuttuvat globaaliksi.

Tarkka tila ei salli määrittämättömiä muuttujia.

Ilmoitetaan ylös

Hyvä ohjelmointitapa on sijoittaa kaikki määrittelyt jokaisen skriptin tai funktion ylös.

Tämän tekemisen etuna on:

  • Antaa puhdempaa koodia
  • Tarjoaa hyvän paikan etsiä paikallisia muuttujia
  • Helpompi välttää ei tarvittavia globaaleja muuttujia
  • Vähentää ei tarvittavien uudelleenmäärittelyjen mahdollisuuksia
// Ilmoitetaan ylös
var firstName, lastName, price, discount, fullPrice;
// Käytetään myöhemmin
firstName = "Bill";
lastName = "Gates";
price = 19.90;
discount = 0.10;
fullPrice = price * 100 / discount;

Tämä voidaan käyttää myös silmukkamuuttujana:

// Ilmoitetaan ylös
var i;
// Käytetään myöhemmin
for (i = 0; i < 5; i++)  {

Oletusarvon mukaan JavaScript siirtää kaikki määrittelyt ylös (JavaScript:n nosto).

Alustetaan muuttujat

On hyvä tapa alustaa muuttujat, kun ne määritellään.

Tämän tekemisen etuna on:

  • Siistimpi koodi
  • Alusta muuttujat erillisessä paikassa
  • Vältä määrittelemättömiä arvoja
// Ilmoita ja alusta alusta alkuun
var firstName = "",
    lastName  = "",
    price = 0,
    discount = 0,
    fullPrice  = 0,
    myArray = [],
    myObject = {};

Muuttujien alustus auttaa meitä ymmärtämään odotetun käytön ja odotetun tietotyyppin.

Älä määrittele lukuja, merkkijonoja tai boolean-objekteja

Aina pidä luvut, merkkijonot tai boolean-arvot alkuperäisinä arvoina, ei objekteina.

Jos nämä tyyppien määrittelyt tehdään objekteiksi, ne voivat hidastaa suorituskykyä ja aiheuttaa ikäviä sivuvaikutuksia:

esimerkki

var x = "Bill";             
var y = new String("Bill");
(x === y) // Tulos on false, koska x on merkkijono ja y on objekti.

Kokeile itse

Tai jopa vielä pahempaa:

esimerkki

var x = new String("Bill");             
var y = new String("Bill");
(x == y) // Tulos on false, koska et voi vertailla objekteja.

Kokeile itse

Älä käytä new Object()

  • Käytä {} korvaamaan new Object()
  • Käytä "" korvaamaan new String()
  • Käytä 0 korvaamaan new Number()
  • Käytä false korvaamaan new Boolean()
  • Käytä [] korvaamaan new Array()
  • Käytä /()/ korvaamaan new RegExp()
  • Käytä function (){} korvaamaan new Function()

esimerkki

var x1 = {};           // Uusi objekti
var x2 = "";           // Uusi alkuperäinen merkkijono
var x3 = 0;            // Uusi alkuperäinen luku
var x4 = false;        // Uusi alkuperäinen boolean-arvo
var x5 = [];           // Uusi taulukko-objekti
var x6 = /()/;         // Uusi säännöllinen lauseke
var x7 = function(){}; // Uusi funktio-objekti

Kokeile itse

Tietotyyppien automaattinen muuntaminen

Ota huomioon, että luvut voidaan vahingossa muuntaa merkkijonoksi tai NaN(Ei luku).

JavaScript kuuluu laiskan tyyppisiin kieliin. Muuttujat voivat sisältää erilaisia tietotyyppejä, ja muuttujat voivat muuttaa tietotyyppiään:

esimerkki

var x = "Hello";     // typeof x 为字符串
x = 5;               // 把 typeof x 更改为数值

Kokeile itse

如果进行数学运算,JavaScript 能够将数值转换为字符串:

esimerkki

var x = 5 + 7;       // x.valueOf() 是 12,  typeof x 是数值
var x = 5 + "7";     // x.valueOf() 是 57,  typeof x 是字符串
var x = "5" + 7;     // x.valueOf() 是 57,  typeof x 是字符串
var x = 5 - 7;       // x.valueOf() 是 -2,  typeof x 是数值
var x = 5 - "7";     // x.valueOf() 是 -2,  typeof x 是数值
var x = "5" - 7;     // x.valueOf() 是 -2,  typeof x 是数值
var x = 5 - "x";     // x.valueOf() 是 NaN, typeof x 是数值

Kokeile itse

用字符串减去字符串,不会产生错误而是返回 NaN(Not a Number):

esimerkki

"Hello" - "Dolly"    // 返回 NaN

Kokeile itse

使用 === 比较

== 比较运算符总是在比较之前进行类型转换(以匹配类型)。

=== 运算符会强制对值和类型进行比较:

esimerkki

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

Kokeile itse

使用 Parameter Defaults

如果调用函数时缺少一个参数,那么这个缺失参数的值会被设置为 undefined

undefined 值会破坏您的代码。为参数设置默认值是一个好习惯。

esimerkki

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

Kokeile itse

Lue lisääFunktioargumentitTämä luku sisältää lisätietoja funktioiden parametreista.

lopeta switch defaultilla

käytä oletus lopettamaan switch lause. Vaikka et uskoisi tarpeen.

esimerkki

switch (new Date().getDay()) {
    tapaus 0:
        day = "Sunday";
        katkaise;
    tapaus 1:
        day = "Monday";
         katkaise;
    tapaus 2:
        day = "Tuesday";
         katkaise;
    tapaus 3:
        day = "Wednesday";
         katkaise;
    tapaus 4:
        day = "Thursday";
         katkaise;
    tapaus 5:
        day = "Friday";
         katkaise;
    tapaus 6:
        day = "Saturday";
         katkaise;
    oletus:
        day = "Unknown";
} 

Kokeile itse

Vältä käytettäessä eval()

eval() Funktiot käytetään tekstin koodina suorittamiseen. Käytännössä ei ole tarvetta käyttää sitä.

Sallittu on jokaisen koodin suorittaminen, mikä samalla tarkoittaa turvallisuusongelmia.