Топ 10 JavaScript Shorthands для початківців
Скорочення JavaScript не тільки прискорити процес кодування, але й зробити скрипти коротшими, тому привести до швидше завантаження сторінки. Скорочені коди так само діють, як і їхні довгі версії; вони по суті стояти за те ж саме-тільки в більш компактному форматі. Вони є однією з найпростіших методів оптимізації коду.
Є кілька скорочень JavaScript, однак вони не мають офіційного довідника. Деякі з них дійсно прості, а інші досить залякують навіть досвідчених розробників. У цій статті ви можете знайти 10 скорочень JavaScript для початківців за допомогою яких можна почати з оптимізації коду і написати більш лаконічний код.
1. Десяткові числа
Якщо ви регулярно працювати з великими десятковими знаками це скорочення може бути знахідкою, оскільки ви більше не повинні вводити всі нулі, просто замінюйте їх на e позначення. Наприклад, 1e8 означає додавання восьми нулів після 1 цифра, вона дорівнює 100000000.
Номер після листа e вказує кількість нулів які приходять після цифр (ів) раніше e. Аналогічно, 16e4 це скорочення для 160000, тощо.
/ * Скорочення * / var myVar = 1e8; / * Longhand * / var myVar = 100000000;
2. Приріст, декремент
The скорочення скорочення складається з двох + знаки, це означає, що значення змінної має бути збільшується на одиницю. Аналогічно зменшення скорочення складається з двох - знаки, а це означає, що змінна повинна бути зменшується на одиницю.
Ці два скорочення можна використовувати тільки на числових типах даних. Вони мають незамінну роль в петлях, найчастіше їх використовують для петлі.
/ * Скорочення * / i ++; j--; / * Longhand * / i = i + 1; j = j-1;
3. Додавання, відволікання, множення, ділення
Для кожної з них передбачено скорочення чотири основні математичні операції: додавання, відволікання, множення і ділення. Вони працюють так само, як і оператори інкременту і декременту, тільки тут ви можете змінити значення змінної будь-яким номером (не тільки по одному).
У наведеному нижче прикладі i змінна збільшується на 5, j зменшується на 3, k множиться на 10, і l ділиться на 2.
/ * Скорочення * / i + = 5; j- = 3; k * = 10; l / = 2; / * Longhand * / i = i + 5; j = j-3; k = k * 10; l = l / 2;
4. Визначити розташування символів
The 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 = ["apple", "pear", "orange"] синтаксис. Однак, оголошення асоціативного масиву трохи складніше, як тут, вам потрібно не тільки визначити значення, але й ключі (у випадку регулярних масивів ключі є 0, 1, 2, 3 тощо.).
Асоціативний масив - це a колекція пар ключ-значення. Довгий спосіб полягає в оголошенні масиву, а потім до кожного елементу. Тим не менш, при скороченні нижче, ви також можете оголошують асоціативний масив плюс всі її елементи в той самий час.
У наведеному нижче прикладі myArray асоціативний масив призначає своє місце народження (значення) відомим людям (клавішам).
/ * Скорочення * / var myArray = "Грейс Келлі": "Філадельфія", "Клінт Іствуд": "Сан-Франциско", "Хамфрі Богарт": "Нью-Йорк", "Софі Лорен": "Рим", "Інгрід" Bergman ":" Стокгольм " / * Longhand * / var myArray = new Array (); myArray ["Грейс Келлі"] = "Філадельфія"; myArray ["Clint Eastwood"] = "Сан-Франциско"; myArray ["Humphrey Bogart"] = "Нью-Йорк"; myArray ["Sophia Loren"] = "Рим"; myArray ["Ingrid Bergman"] = "Стокгольм";
7. Оголосити об'єкт
Стенограма для оголошення об'єкта працює так само, як і для асоціативних масивів. Але тут немає пар ключ-значення, але пари власності-значення що вам потрібно помістити між дужками .
Єдина відмінність у синтаксисі скорочення полягає в тому, що Властивості об'єкта не укладені в лапки (ім'я, місце народження, віку, булаJamesBond у наведеному нижче прикладі).
/ * Скорочення * / var myObj = ім'я: "Sean Connery", placeOfBirth: "Edinburgh", вік: 86, wasJamesBond: true; / * Longhand * / var myObj = новий об'єкт (); myObj.name = "Шон Коннері"; myObj.placeOfBirth = "Единбург"; myObj.age = 86; myObj.wasJamesBond = true;
8. Використовуйте умовний оператор
The умовний (потрійний) оператор часто використовується як ярлик для if-else заяву. Вона складається з три частини:
- стан
- що станеться, якщо умова є істинним (
якщо) - що станеться, якщо умова помилкове (
інше)
У наведеному нижче прикладі ми надсилаємо просте повідомлення (всередині повідомлення змінної) для людей, які хочуть увійти до клубу. Використовуючи форму скорочення, це лише один рядок коду виконати оцінку.
var age = 17; / * Скорочення * / var message = вік> = 18? "Дозволено": "Відмовлено"; / * Longhand * / if (вік> = 18) var message = "Дозволено"; else var message = "Відмовлено";
Якщо ви хочете перевірити його просто скопіюйте код у веб-консоль (F12 у більшості браузерів) і змініть значення віку змінна кілька разів.
9. Перевірте наявність
Часто трапляється, що потрібно перевірити, чи є змінною присутній чи ні. The “при наявності” скорочення допоможе вам зробити це з набагато меншим кодом.
Пам'ятайте, що більшість статей на JavaScript-скоростях не дають належної довгої форми, як якщо (myVar) позначення не просто перевіряє, чи не є помилкою, а також кілька інших речей. А саме, змінна не може бути невизначеною, порожньою, нульовою та помилковою.
var myVar = 99; / * Скорочення * / if (myVar) console.log ("змінна myVar визначена І вона не порожня, а не null і не false."); / * Longhand * / if (typeof myVar! == "undefined" && myVar! == "" && myVar! == null && myVar! == 0 && myVar! == false) console.log ("The myVar змінна визначена І вона не порожня, а не null, а не false. "); Ви можете перевірити, як “при наявності” скорочено працює, вставивши наступний фрагмент коду в веб-консоль і змінюється значення myVar декілька разів.
Щоб зрозуміти, як працює ця скорочення, варто перевірити його значеннями "" (порожній рядок), помилковий, 0, вірно, непустий рядок (напр. "Привіт"), число (наприклад. 99), і коли змінна не визначена (просто var myVar;).
10. Перевірте відсутність
The “при наявності” для скорочення можна використовувати перевірити відсутність змінної шляхом розміщення знак оклику перед ним. Знак оклику логічний не оператор у JavaScript (і на більшості мов програмування).
Тому з якщо (! myVar) Нотацію можна перевірити, якщо myVar змінної не є невизначеним, порожнім, нульовим або помилковим.
var myVar; / * Скорочення * / if (! MyVar) console.warn ("змінна myVar є невизначеною (OR) порожньою (OR) null (OR) false."); / * Longhand * / if (typeof myVar === "undefined" || myVar === "" || myVar === null || myVar === 0 || myVar === false) console.warn ("Змінна myVar є невизначеною (OR) порожньою (OR) null (OR) false.");
