Топ 10 JavaScript Shorthands за начинаещи
Скорости на JavaScript не само да ускори процеса на кодиране, но и да направи скриптовете по-кратки и следователно да доведе до по-бързо зареждане на страници. Стенографските кодове са също толкова валидни, колкото и техните дълги версии; те по същество за същото нещо-само в по-компактен формат. Те са една от най-простите техники за оптимизиране на кода.
Има няколко скорошни кода на JavaScript, обаче те нямате официален справочник. Някои от тях са много прости, а други са доста плашещи дори за опитни разработчици. В тази статия можете да намерите 10 JavaScript shorthands за начинаещи с които можете да започнете с оптимизация на кода и да напишете по-кратък код.
1. Десетични числа
Ако редовно работа с големи десетични знаци тази стенография може да бъде божи дар, тъй като не е нужно повече да пишете всички нули, просто ги заменете с д нотация. Например, 1e8 означава добавянето на осем нули след 1 цифра, тя е равна на 100000000.
Номерът след писмото д показва броя на нулите които следват преди цифрата или цифрите д. по същия начин, 16e4 е съкращението за 160000, и т.н..
/ * Стенопис * / var myVar = 1e8; / * Longhand * / var myVar = 100000000;
2. Нарастване, намаляване
Най- стенографска стъпка се състои от две + знаци, това означава, че стойността на дадена променлива е да бъде нараства с една. По подобен начин стенография на декремента се състои от две - знаци, и това означава, че променливата трябва да бъде намален с един.
Тези две обозначения могат да бъдат използвани само за числови типове данни. Те имат незаменима роля в контурите, като най-често срещаният им случай е за контур.
/ * Стенопис * / i ++; j--; / * Longhand * / i = i + 1; J = J-1;
3. Добавяйте, разсейвайте, умножавайте, разделяйте
За всяка от тях има стенография четири основни математически операции: добавяне, разсейване, умножение и деление. Те работят подобно на операторите на инкременти и декременти, само тук можете да промените стойността на променлива с произволен номер (не само по един).
В примера по-долу аз променливата се увеличава с 5, к се намалява с 3, к се умножава по 10, и л е разделена на 2.
/ * Стенопис * / i + = 5; J- = 3; к * = 10; л / = 2; / * Longhand * / i = i + 5; J = J-3; к = к * 10; L = L / 2;
4. Определете позицията на символа
Най- charAt () метод е един от най-често използваните низови методи, той връща знак на определена позиция (например 5тата символ на низ). Вместо това можете да използвате обикновена стенография: добавяте позиция на знака, затворена в квадратни скоби след низ.
Обърнете внимание, че charAt () метод нулева база. Следователно, MyString [4] ще върне 5тата знак в низ ("Y" в примера).
var myString = "Честит рожден ден"; / * Стенопис * / myString [4]; / * Longhand * / myString.charAt (4);
5. Обявяване на променливите в насипно състояние
Ако искате да създадете повече от една променлива едновременно не е нужно да ги пишете един по един. Достатъчно е да използвате Var (или позволявам) ключова дума само веднъж, тогава можете просто да изброите променливите, които искате да създадете, разделени със запетая.
С тази стенография можете да декларирате и двете неопределени променливи и променливи със стойност.
/ * Стенопис * / var i, j = 5, k = "Добро утро", l, m = false; / * Longhand * / var i; var j = 5; var k = "Добро утро"; var l; var m = false;
6. Обявяване на асоциативен масив
Обявяването на масив в JavaScript е относително проста задача, като се използва var myArray = ["ябълка", "круша", "оранжево"] синтаксис. въпреки това, обявяване на асоциативен масив е малко по-сложно, тъй като тук не само трябва да дефинирате стойностите, но и ключовете (в случай на редовни масиви ключовете са 0, 1, 2, 3 и т.н..).
Асоциативен масив е a събиране на двойки ключ-стойност. В longhand начин е да се декларира масив, след това добавете всеки елемент един по един. Въпреки това, със стенограмите по-долу, можете също декларират асоциативния масив плюс всички негови елементи по същото време.
В примера по-долу MyArray асоциативен масив присвоява мястото им на раждане (стойности) на известни хора (ключове).
/ * Стенопис * / var myArray = "Грейс Кели": "Филаделфия", "Клинт Истууд": "Сан Франциско", "Хъмфри Богарт": "Ню Йорк Сити", "София Лорен": "Рим", "Ингрид" Bergman ":" Стокхолм " / * Longhand * / var myArray = new Array (); myArray ["Грейс Кели"] = "Филаделфия"; myArray ["Clint Eastwood"] = "Сан Франциско"; myArray ["Humphrey Bogart"] = "Ню Йорк Сити"; myArray ["София Лорен"] = "Рим"; myArray ["Ingrid Bergman"] = "Стокхолм";
7. Обяснете обект
Стенографията за декларация на обект работи подобно на тази за асоциативни масиви. Но тук няма двойки ключ-стойност, а двойки собственост-стойност което трябва да поставите между скобите .
Единствената разлика в синтаксиса на стенограмите е тази Свойствата на обекта не са включени в кавички (име, място на раждане, възраст, wasJamesBond в примера по-долу).
/ * Стенопис * / var myObj = name: "Sean Connery", placeOfBirth: "Edinburgh", възраст: 86, wasJamesBond: true; / * Longhand * / var myObj = нов обект (); myObj.name = "Шон Конъри"; myObj.placeOfBirth = "Единбург"; myObj.age = 86; myObj.wasJamesBond = true;
8. Използвайте условния оператор
Най- условен (троен) оператор често се използва като пряк път за ако-друго изявление. Състои се от три части:
- на състояние
- какво ще стане, ако условието е вярно (
ако) - какво ще стане, ако условието е невярно (
още)
В примера по-долу изпращаме просто съобщение (вътре в съобщение променлива) за хора, които искат да влязат в клуб. Използвайки стенографската форма, това е само един ред от код изпълнете оценката.
var age = 17; / * Съкращение * / var съобщение = възраст> = 18? „Разрешено“: „Отказано“; / * Longhand * / if (възраст> = 18) var message = "Разрешено"; else var message = "Отказано";
Ако искате да го тествате просто копирайте кода в уеб конзолата (F12 в повечето браузъри) и променете стойността на възраст променлива няколко пъти.
9. Проверете присъствието
Често се случва да проверите дали дадена променлива е присъства или не. Най- “ако е налице” стенография ви помага да направите това с много по-малко код.
Пазете се от това, че повечето статии на JavaScript накратко не дават правилната форма на дългата ръка ако (myVar) Нотацията не просто проверява дали променливата не е фалшива, а също и няколко други неща. А именно променливата не може да бъде неопределен, празен, нулев и невярен.
var myVar = 99; / * Стенопис * / if (myVar) console.log ("Променливата myVar е дефинирана и не е празна и не е нула и не е фалшива."); / * Longhand * / if (от тип myVar! == "undefined" && myVar! == "" && myVar! == null && myVar! == 0 && myVar! == false) console.log ("The myVar променливата е дефинирана И тя не е празна и не е нула и не е невярна. "); Можете да тествате как “ако е налице” Стенографията работи чрез вмъкване на следния кодов фрагмент в уеб конзолата и промяна на стойността на myVar няколко пъти.
За да разберем как работи тази стенография, си струва да го тестваме със стойностите на "" (празен низ), фалшив, 0, вярно, не празен низ (напр. "Здрасти"), число (напр. 99), и когато променливата е неопределена (просто var myVar;).
10. Проверете отсъствието
Най- “ако е налице” може да се използва за краткост проверете отсъствието на променлива чрез поставяне удивителен знак преди него. Удивителният знак е логически не оператор в JavaScript (и в повечето програмни езици).
Следователно, с ако (! myVar) нотация, можете да проверите дали myVar променлив не е неопределен, празен, нулев или невярен.
var myVar; / * Стенопис * / if (! MyVar) console.warn ("Променливата myVar е неопределена (OR) empty (OR) null (OR) false."); / * Longhand * / if (тип на myVar === "undefined" || myVar === "" || myVar === null || myVar === 0 || myVar === false) console.warn ("Променливата myVar е неопределена (OR) empty (OR) null (OR) false.");
