Yeni Başlayanlar İçin En İyi 10 JavaScript Kısayeti
JavaScript kısa mesajları sadece kodlama sürecini hızlandırmakla kalmaz, aynı zamanda betikleri daha kısa hale getirir, daha hızlı sayfa yükleri. Kestirme kodlar, kestirme sürümleri kadar geçerlidir; onlar esasen aynı şey için durmak-sadece daha kompakt bir formatta. En basit kod optimizasyon tekniklerinden biridir.
Ancak birkaç JavaScript kısayolu var. resmi bir referans rehberiniz yok. Bazıları gerçekten basit, bazıları ise deneyimli geliştiriciler için bile korkutucu. Bu yazıda bulabilirsiniz Yeni başlayanlar için 10 JavaScript shorthands kod optimizasyonu ile başlayabileceğiniz ve daha kısa kod yazabileceğiniz.
1. Ondalık sayılar
Düzenli olarak büyük ondalık sayılarla çalışmak Artık tüm sıfırları yazmanız gerekmediği için bu kestirme nimettir olabilir. e
notasyonu. Örneğin, 1E8
sonra sekiz sıfırın eklenmesi anlamına gelir. 1
basamak, eşittir 100000000
.
Harften sonraki sayı e
sıfır sayısını gösterir önceki haneden sonra gelen e
. aynı şekilde, 16e4
kısacası 160000
, vb.
/ * Shorthand * / var myVar = 1e8; / * Longhand * / var myVar = 100000000;
2. Artış, azalış
artan steno iki oluşur +
işaretler, bir değişkenin değerinin olacağı anlamına gelir bir artırıldı. Benzer şekilde azaltma kestirme iki oluşur -
işaretler ve değişkenin olduğu anlamına gelir. bir azalmış.
Bu iki kısa yol kullanılabilir sadece sayısal veri türlerinde. Döngülerde vazgeçilmez bir rol oynarlar, en sık kullandıkları durum ise için
döngü.
/ * Shorthand * / i ++; j--; / * Longhand * / i = i + 1; J, J-1 =;
3. Ekleme, dikkat dağıtma, çarpma, bölme
Her biri için bir steno var. dört temel matematiksel işlem: toplama, dikkat dağıtma, çarpma ve bölme. Artırma ve azaltma operatörlerine benzer şekilde çalışırlar, tam burada, bir değişkenin değerini değiştirebilirsiniz herhangi bir numara ile (sadece bir değil).
Aşağıdaki örnekte ben
değişken artımlı 5
, j
tarafından azaltılır 3
, k
ile çarpılır 10
, ve l
bölünür 2
.
/ * Shorthand * / i + = 5; j = 3; k * = 10; l / = 2; / * Longhand * / i = i + 5; J, J-3 =; k = k * 10; l = l / 2;
4. Karakter konumunu belirle
charAt ()
yöntem en çok kullanılan dize yöntemlerinden biridir, döndürür. belirtilen konumda karakter (örneğin, 5inci dizgenin karakteri). Bunun yerine kullanabileceğiniz basit bir kestirme var: köşeli parantez içine alınmış karakter konumu dizeden sonra.
Dikkat edin charAt ()
yöntem sıfır tabanlı. bu nedenle, MyString [4]
5 dönecekinci dizedeki karakter ("Y"
örnekte).
var myString = "Doğum günün kutlu olsun"; / * Kestirme * / myString [4]; / * Longhand * / myString.charAt (4);
5. Değişkenleri toplu olarak bildirin
Oluşturmak istiyorsan aynı anda birden fazla değişken Bunları birer birer yazmak zorunda değilsiniz. Kullanmak için yeterli var
(veya let
) anahtar kelime sadece bir kere, o zaman sadece oluşturmak istediğiniz değişkenleri listeleyebilirsiniz., virgülle ayrılmış.
Bu steno ile her ikisini de beyan edebilirsiniz. tanımsız değişkenler ve değeri olan değişkenler.
/ * Shorthand * / var i, j = 5, k = "Günaydın", l, m = yanlış; / * Longhand * / var i; var j = 5; var k = "Günaydın"; var 1; var m = yanlış;
6. Bir ilişkisel dizi bildirin
Bir diziyi JavaScript'te bildirmek, kullanımı oldukça basit bir iştir. var myArray = ["elma", "armut", "portakal"]
sözdizimi. ancak, ilişkisel dizi bildirmek biraz daha karmaşıktır, burada olduğu gibi, sadece değerleri tanımlamanız gerekmez, ayrıca anahtarlar da vardır (normal dizilerde 0, 1, 2, 3, vb.
).
Bir ilişkisel dizi Anahtar-değer çiftlerinin toplanması. Uzun yol, diziyi bildirmek ve ardından her öğeyi birer birer eklemektir. Ancak, aşağıdaki steno ile ilişkisel diziyi bildirmek artı tüm unsurları aynı zamanda.
Aşağıdaki örnekte myArray
ilişkisel dizi doğum yerlerini (değerler) ünlü insanlara (anahtarlar) atar..
/ * Shorthand * / var myArray = "Grace Kelly": "Philadelphia", "Clint Eastwood": "San Francisco", "Humphrey Bogart": "New York Şehri", "Sophia Loren": "Roma", "Ingrid Bergman ":" Stockholm " / * Longhand * / var myArray = new Array (); myArray ["Grace Kelly"] = "Philadelphia"; myArray ["Clint Eastwood"] = "San Francisco"; myArray ["Humphrey Bogart"] = "New York Şehri"; myArray ["Sophia Loren"] = "Roma"; myArray ["Ingrid Bergman"] = "Stockholm";
7. Bir nesne bildirin
İçin steno nesne bildirimi ilişkisel diziler için benzer şekilde çalışır. Ancak burada, anahtar / değer çiftleri yoktur, ancak özellik değeri çiftleri diş telleri arasına yerleştirmeniz gerekir .
Shorthand sözdizimindeki tek fark şudur: nesne özellikleri tırnak içine alınmaz (isim
, doğum yeri
, yaş
, wasJamesBond
aşağıdaki örnekte).
/ * Shorthand * / var myObj = name: "Sean Connery", placeOfBirth: "Edinburgh", yaş: 86, wasJamesBond: true; / * Longhand * / var myObj = new Object (); myObj.name = "Sean Connery"; myObj.placeOfBirth = "Edinburgh"; myObj.age = 86; myObj.wasJamesBond = true;
8. Koşullu işleci kullanın.
koşullu (üçlü) operatör sıkça için kısayol if-else
Beyan. Bu oluşmaktadır Üç parça:
- şart
- ne olur durum doğru (
Eğer
) - ne olur durum yanlış (
Başka
)
Aşağıdaki örnekte basit bir mesaj gönderiyoruz ( mesaj
değişken) bir kulübe girmek isteyenlere. Kestirme formu kullanarak, bu sadece bir satır kod değerlendirme yapmak.
değişken yaş = 17; / * Shorthand * / var message = yaş> = 18? "İzin Verildi": "Reddedildi"; / * Longhand * / if (yaş> = 18) var message = "İzin Verildi"; else var message = "Reddedildi";
Sadece test etmek istiyorsanız kodu web konsoluna kopyalayın (Çoğu tarayıcıda F12) ve değerini değiştirin. yaş
birkaç kez değişken.
9. Varlığını kontrol edin
Bir değişkenin olup olmadığını kontrol etmeniz gerektiğinde sık sık olur. şimdiki zaman ya da değil. “eğer varsa” steno çok daha az kodla yapmanıza yardımcı olur.
JavaScript kısaltmalarıyla ilgili çoğu makalenin, uygun el yazısı formunu vermediğini unutmayın. eğer (myVar)
gösterim sadece değişkenin yanlış olup olmadığını kontrol etmiyor, aynı zamanda bir sürü başka şeyi de kontrol ediyor. Yani, değişken tanımsız, boş, boş ve yanlış olamaz.
var myVar = 99; / * Shorthand * / if (myVar) console.log ("myVar değişkeni tanımlandı VE boş değil VE boş değil VE yanlış değil."); / * Longhand * / if (typof myVar! == "undefined" && myVar! == "" && myVar! == null && myVar! == 0 && myVar! == yanlış) console.log ("The MyVar değişken tanımlanır VE boş değil VE boş değil VE yanlış değil. ");
Nasıl test edebilirsiniz “eğer varsa” steno, aşağıdaki kod parçasını web konsoluna ekleyerek çalışır ve değerini değiştirmek myVar
biraz zaman.
Bu stenonun nasıl çalıştığını anlamak için, değerleri ile test etmeye değer ""
(boş dize), yanlış
, 0
, doğru
, boş olmayan bir dize (ör.. "Merhaba"
), bir sayı (ör.. 99
) ve değişken tanımsız olduğunda (sadece var myVar;
).
10. Devamsızlığı kontrol et
“eğer varsa” steno için kullanılabilir değişkenin yokluğunu kontrol edin yerleştirerek ondan önce ünlem işareti. Ünlem işareti mantıksal operatör değil JavaScript'te (ve çoğu programlama dilinde).
Bu nedenle, ile if (! myVar)
gösterimde, sen kontrol edebilirsiniz myVar
değişken tanımsız, boş, boş veya yanlış değil.
var myVar; / * Shorthand * / if (! MyVar) console.warn ("myVar değişkeni tanımsız (VEYA) boş (OR) boş (OR) yanlış."); / * Longhand * / if (typof myVar === "undefined" || myVar === "" || myVar === null || myVar === 0 || myVar === false) console.warn ("MyVar değişkeni tanımsız (OR) boş (OR) boş (OR) yanlış.");