למעלה 10 קצרנות JavaScript למתחילים
קצרנות לא רק להאיץ את תהליך קידוד אלא גם לעשות סקריפטים קצרים יותר, ולכן להוביל טעינת דפים מהירה יותר. קודי קצרנות תקפים בדיוק כמו גירסאותיהם הארוכות. הם בעצם לעמוד על אותו דבר-רק בפורמט קומפקטי יותר. הם אחד הטכניקות הפשוטות ביותר אופטימיזציה קוד.
יש כמה ג 'אווה shorthands, אולם הם אין לך מדריך התייחסות רשמי. חלקם פשוטים, בעוד אחרים מפחידים למדי אפילו עבור מפתחים מנוסים. במאמר זה, אתה יכול למצוא 10 קצרנות JavaScript למתחילים שבו אתה יכול להתחיל עם אופטימיזציה קוד לכתוב קוד תמציתי יותר.
1. מספרים עשרוניים
אם אתה באופן קבוע לעבוד עם ספרות עשרוניות גדולות זה קצרנות יכול להיות Godsend, כפי שאתה לא צריך להקליד את כל אפסים יותר, פשוט להחליף אותם עם ה סימון. לדוגמה, 1e8 פירושו תוספת של שמונה אפסים לאחר 1 ספרה, זה שווה ל 100000000.
המספר שאחרי המכתב ה מציין את מספר האפסים כי אחרי הספרה (s) לפני ה. כמו כן, 16e4 הוא קצרנות עבור 160000, וכו.
/ * קצרנות * / var myVar = 1e8; / * Longhand * / var myVar = 100000000;
2. הגדלה, הפחתה
ה קיצור קצר מורכב משניים + כלומר, הערך של משתנה הוא להיות בתוספת אחת. באופן דומה, קיצור קצר מורכב משני - סימנים, והמשמעות היא שהמשתנה יהיה מופחת על ידי אחד.
אלה שני קיצור יכול לשמש רק על סוגי נתונים מספריים. יש להם תפקיד חיוני בלולאות, במקרה השימוש הנפוץ ביותר שלהם הוא ל לולאה.
/ * קצרנות * / i ++; j--; / * Longhand * / i = i + 1; j = j-1;
3. הוסף, להסיח, להכפיל, לחלק
יש קיצור לכל אחד ארבע פעולות בסיסיות מתמטיות: תוספת, הסחת דעת, כפל וחילוק. הם פועלים באופן דומה למפעילי ההוספה וההקטנה, רק כאן, אתה יכול לשנות את הערך של משתנה לפי מספר כלשהו (לא רק על ידי אחד).
בדוגמה שלהלן, אני משתנה הוא על ידי 5, י מופחת על ידי 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. קביעת מיקום תו
ה 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, וכו '.).
מערך אסוציאטיבי הוא אוסף של זוגות ערך מפתח. הדרך הארוכה היא להכריז על המערך, ולאחר מכן להוסיף כל רכיב בזה אחר זה. עם זאת, עם קצרנות למטה, אתה יכול גם להכריז על המערך האסוציאטיבי ועוד על כל מרכיביו באותו הזמן.
בדוגמה שלהלן, myArray המערך האסוציאטיבי מקצה את מקום לידתם (ערכים) לאנשים מפורסמים (מפתחות).
* "קלינט איסטווד": "סאן פרנסיסקו", "האמפרי בוגארט", "ניו יורק סיטי", "סופיה לורן", "רומא", "אינגריד" ברגמן ":" שטוקהולם " / * Longhand * / var myArray = New Array (); myArray ["גרייס קלי"] = "פילדלפיה"; myArray ["קלינט איסטווד"] = "סן פרנסיסקו"; myArray ["המפרי בוגארט"] = "ניו יורק"; myArray ["סופיה לורן"] = "רומא"; myArray ["אינגריד ברגמן"] = "שטוקהולם";
7. הכרת אובייקט
קיצור עבור הכרזת אובייקט עובד באופן דומה לזה של מערכים אסוציאטיביים. עם זאת, כאן אין זוגות מפתח ערך אבל זוגות ערך רכוש כי אתה צריך מקום בין הפלטה .
ההבדל היחיד בתחביר הקיצור הוא זה מאפייני אובייקט אינם סגורים במרכאות (שם, מקום לידה, גיל, היה בדוגמה הבאה).
/ * קצרנות * / var myObj = שם: "שון קונרי", placeOfBirth: "אדינבורו", גיל: 86, wasJamesBond: true; / * Longhand * / var myObj = אובייקט חדש (); myObj.name = "שון קונרי"; myObj.placeOfBirth = "אדינבורו"; myObj.age = 86; myObj.wasJamesBond = true;
.8 השתמש במפעיל מותנה
ה (מותנה) הוא משמש לעתים קרובות קיצור עבור אחרת הצהרה. זה מורכב מ שלושה חלקיםYou
- ה תנאי
- מה קורה אם המצב נכון (
אם) - מה קורה אם המצב הוא שקר (
Other)
בדוגמה הבאה, אנו שולחים הודעה פשוטה (בתוך הודעה משתנה) לאנשים שרוצים להיכנס למועדון. באמצעות טופס קצרנות, זה רק שורה אחת של קוד להפעיל את ההערכה.
גיל 17 = / * קצרנות * / var הודעה = גיל> = 18? "מותר": "נדחה"; / * Longhand * / if (גיל> = 18) var message = "מותר"; אחר var message = "נדחתה";
אם אתה רוצה לבדוק את זה רק להעתיק את הקוד לתוך קונסולת האינטרנט (F12 ברוב הדפדפנים) ולשנות את הערך של גיל משתנה מספר פעמים.
9. בדוק נוכחות
זה קורה לעתים קרובות כי אתה צריך לבדוק אם הוא משתנה נוכחים או לא. ה “אם נוכחות” קצרנות עוזר לך לעשות זאת עם קוד הרבה פחות.
היזהר כי רוב המאמרים על ג 'אווה shorthands לא נותנים את הטופס longhand הנכון, כמו אם (myVar) סימון לא פשוט לבדוק אם המשתנה אינו שקר, אלא גם קומץ דברים אחרים. כלומר, המשתנה לא יכול להיות מוגדר, ריק, ריק, שקר.
var myVar = 99; / * קצרנות * / אם (myVar) console.log ("משתנה myVar מוגדר וזה לא ריק ולא ריק ולא שקר."); / * Longhand * / if (typeof myVar! == "undefined" && myVar! == "& && myVar! == null && myVar! == 0 && myVar! == false) console.log (" The myVar משתנה מוגדר וזה לא ריק ולא ריק ולא שקר. "); אתה יכול לבדוק איך “אם נוכחות” עובד על ידי הוספת קטע הקוד הבא לתוך קונסולת האינטרנט שינוי הערך של MyVar כמה פעמים.
כדי להבין איך זה עובד קצרנות, כדאי לבדוק את זה עם ערכי " (מחרוזת ריקה), שקר, 0, נכון, מחרוזת שאינה ריקה (למשל. "היי"), מספר (למשל. 99), וכאשר המשתנה אינו מוגדר (פשוט var meVar;).
10. בדוק היעדרות
ה “אם נוכחות” קצרנות יכול לשמש לבדוק את העדר משתנה על ידי הנחה סימן קריאה לפניו. סימן הקריאה הוא הגיונית לא מפעיל ב- JavaScript (וברוב שפות התכנות).
לכן, עם אם (! myVar) סימון, אתה יכול לבדוק אם MyVar משתנה אינו מוגדר, ריק, ריק או שקר.
var meVar; / * קצרנות * / אם (! MyVar) console.warn ("המשתנה myVar אינו ריק (OR) ריק (OR) ריק (OR) שקר."); / * Longhand * / if (typeof myVar === "undefined" || myVar === "" || myVar === null || myVar === 0 || myVar === false) console.warn ("המשתנה myVar אינו ריק (OR) ריק (OR) שקר (OR) שקר.");
