Topp 10 JavaScript Shorthands för nybörjare
JavaScript shorthands inte bara påskynda kodningsprocessen utan även göra skript kortare, därför leda till snabbare sidladdningar. Shorthandkoder är lika giltiga som deras longhand-versioner; de väsentligen stå för samma sak-bara i ett mer kompakt format. De är en av de enklaste kodoptimeringsteknikerna.
Det finns flera JavaScript-kortfattningar, dock de har ingen officiell referensguide. Vissa är väldigt enkla, medan andra är ganska skrämmande även för erfarna utvecklare. I den här artikeln hittar du 10 JavaScript shorthands för nybörjare med vilken du kan börja med kodoptimering och skriva mer kortfattad kod.
1. Decimaltal
Om du regelbundet arbeta med stora decimaler den här shorthanden kan vara gudom, eftersom du inte behöver skriva ut alla nollor längre, bara byt ut dem med e
notation. Till exempel, 1E8
betyder tillägg av åtta nollor efter 1
siffra, det motsvarar 100000000
.
Numret efter bokstaven e
anger antalet nollor som kommer efter siffra (r) före e
. Likaledes, 16e4
är stenografi för 160 tusen
, etc.
/ * Stenografi * / var myVar = 1e8; / * Longhand * / var myVar = 100000000;
2. Ökning, minskning
De inkrement stenografi består av två +
tecken betyder det att värdet av en variabel ska vara inkrementeras av en. På samma sätt, minskning stenografi består av två -
tecken, och det betyder att variabeln ska vara dekrementeras av en.
Dessa två shorthands kan användas endast på numeriska datatyper. De har en oumbärlig roll i loopar, deras vanligaste användningsfall är för
slinga.
/ * Stenografi * / i ++; j--; / * Longhand * / i = i + 1; j = j-1;
3. Lägg till, distrahera, multiplicera, dela upp
Det finns en stenografi för var och en av fyra grundläggande matematiska operationer: addition, distraktion, multiplikation och division. De fungerar på samma sätt som inkrement och minskning operatörer, bara här kan du ändra värdet på en variabel med vilket nummer som helst (inte bara av en).
I exemplet nedan är jag
variabel ökas med 5
, j
minskas av 3
, k
multipliceras med 10
, och l
delas med 2
.
/ * Stenografi * / i + = 5; j- = 3; k * = 10; l / = 2; / * Longhand * / i = i + 5; j = j-3; k = k * 10; l = l / 2;
4. Bestäm karaktärsställningen
De charAt ()
metod är en av de mest använda strängmetoderna, den returnerar tecken på en angiven position (till exempel 5th karaktär av en sträng). Det finns en enkel stenografi du kan använda istället: du lägger till karaktärsposition inkl. hakparenteser efter strängen.
Var uppmärksam på att charAt ()
metoden är nollbaserade. Därför, Mystring [4]
kommer att returnera 5th tecken i strängen ("Y"
i exemplet).
var myString = "Grattis på födelsedagen"; / * Shorthand * / myString [4]; / * Longhand * / myString.charAt (4);
5. Förklara variabler i bulk
Om du vill skapa mer än en variabel samtidigt du behöver inte skriva ut dem en efter en. Det är tillräckligt att använda var
(eller låta
) sökord bara en gång, då kan du bara lista vilka variabler du vill skapa, separeras med ett komma.
Med denna stenografi kan du deklarera båda odefinierade variabler och variabler med ett värde.
/ * Shorthand * / var jag, j = 5, k = "God morgon", l, m = false; / * Longhand * / var i; var j = 5; var k = "God morgon"; var l; var m = false;
6. Förklara en associativ array
Att avklara en array i JavaScript är en relativt enkel uppgift, genom att använda var myArray = ["äpple", "päron", "orange"]
syntax. dock, förklara en associativ array är lite mer komplicerat, som här behöver du inte bara definiera värdena utan även nycklarna (i händelse av vanliga arrayer är nycklarna 0, 1, 2, 3, etc.
).
En associativ array är a samling av nyckelvärdespar. Longhand-sättet är att deklarera arrayen och sedan lägga till varje element en efter en. Men med stenografi nedan kan du också deklarera den associativa gruppen plus alla dess element på samma gång.
I exemplet nedan är myArray
associativ array tilldelar deras födelseort (värden) till kända personer (nycklar).
/ * Shorthand * / var myArray = "Grace Kelly": "Philadelphia", "Clint Eastwood": "San Francisco", "Humphrey Bogart": "New York City", "Sophia Loren": "Rom", "Ingrid Bergman ":" Stockholm " / * Longhand * / var myArray = ny Array (); myArray ["Grace Kelly"] = "Philadelphia"; myArray ["Clint Eastwood"] = "San Francisco"; myArray ["Humphrey Bogart"] = "New York City"; myArray ["Sophia Loren"] = "Rome"; myArray ["Ingrid Bergman"] = "Stockholm";
7. Deklarera ett föremål
Shorthand för objektdeklaration fungerar på samma sätt som för associativa arrays. Men här är det inte nyckelvärdespar men fastighetsvärdespar som du behöver placera mellan axlarna .
Den enda skillnaden i shorthandsyntaxen är det Objektegenskaper bifogas inte citattecken (namn
, födelseort
, ålder
, wasJamesBond
i exemplet nedan).
/ * Shorthand * / var myObj = namn: "Sean Connery", placeOfBirth: "Edinburgh", ålder: 86, varJamesBond: true; / * Longhand * / var myObj = nytt objekt (); myObj.name = "Sean Connery"; myObj.placeOfBirth = "Edinburgh"; myObj.age = 86; myObj.wasJamesBond = true;
8. Använd den villkorliga operatören
De villkorlig (ternär) operatör används ofta som genväg för om annat
påstående. Den består av tre delar:
- de tillstånd
- vad händer om villkoret är sant (
om
) - vad händer om villkoret är felaktigt (
annan
)
I exemplet nedan skickar vi ett enkelt meddelande (inuti meddelande
variabel) till personer som vill gå in i en klubb. Med shorthandformen är det bara en rad kod till kör utvärderingen.
var ålder = 17; / * Shorthand * / var message = ålder> = 18? "Tillåtet": "Nekad"; / * Longhand * / if (ålder> = 18) var message = "Allowed"; else var message = "Denied";
Om du bara vill testa det kopiera koden till webbkonsolen (F12 i de flesta webbläsare) och ändra värdet på ålder
variabel ett par gånger.
9. Kontrollera närvaro
Det händer ofta att du måste kontrollera om en variabel är närvarande eller ej. De “om närvaro” stenografi hjälper dig att göra det med mycket mindre kod.
Akta dig för att de flesta artiklar på JavaScript-kortfattningar inte ger rätt longhandform, som om (myVar)
notation kontrollerar inte bara om variabeln inte är falsk men också en handfull andra saker. Namnlösa: Variabeln kan inte vara odefinierad, tom, null och falsk.
var myVar = 99; / * Shorthand * / if (myVar) console.log ("MyVar-variabeln är definierad OCH den är inte tom och inte null och inte falsk."); / * Longhand * / if (typeof myVar! == "undefined" && myVar! == "" && myVar! == null && myVar! == 0 && myVar! == false) console.log ("MyVar variabel definieras och den är inte tom och inte null och inte falsk. ");
Du kan testa hur “om närvaro” stenografi fungerar genom att infoga följande kodbit i webbkonsolen och ändra värdet av myVar
några gånger.
För att förstå hur denna stenografi fungerar, är det värt att testa det med värdena på ""
(tom sträng), falsk
, 0
, Sann
, en icke-tom sträng (t.ex.. "Hej"
), ett tal (t.ex.. 99
), och när variabeln är odefinierad (helt enkelt var minVar;
).
10. Kontrollera frånvaron
De “om närvaro” stenografi kan användas till kontrollera frånvaron av en variabel genom att placera ett utropstecken framför det. Utropstecknet är logisk ej operatör i JavaScript (och i de flesta programmeringsspråk).
Därför med om (! myVar)
notation, kan du kontrollera om myVar
variabel är inte odefinierad, tom, null eller falsk.
var minVar; / * Shorthand * / if (! MyVar) console.warn ("MyVar-variabeln är odefinierad (OR) tom (OR) null (OR) false."); / * Longhand * / om (typ av myVar === "undefined" || myVar === "" || myVar === null || myVar === 0 || myVar === false) console.warn ("MyVar-variabeln är odefinierad (OR) tom (OR) null (OR) false.");