JavaScript Cheat Sheet: דף עזר מהיר
עודכן לאחרונה
משתנים (let, const, var)
הצהרה על ערכים; העדיפו const, אחר כך let, והימנעו מ-var.
| פעולה | תחביר |
|---|---|
| תחום בלוק, אפשר להשים מחדש | let count = 0; |
| תחום בלוק, אי אפשר להשים מחדש | const name = "Ada"; |
| תחום פונקציה (ישן) | var x = 1; |
| הצהרה בלי ערך | let result; |
| כמה הצהרות | let a = 1, b = 2; |
| אובייקט קבוע (התוכן ניתן לשינוי) | const user = {}; user.id = 1; |
טיפוסי נתונים
הטיפוסים הפרימיטיביים וטיפוסי ההפניה, ואיך לבדוק אותם.
| טיפוס | דוגמה |
|---|---|
| מספר | let n = 42; |
| מחרוזת | let s = "hi"; |
| בוליאני | let ok = true; |
| מערך | let arr = [1, 2, 3]; |
| אובייקט | let obj = { id: 1 }; |
| Null / undefined | let a = null;, let b; |
| בדיקת טיפוס | typeof n |
| המרה | Number("7"), String(42), Boolean(0) |
מחרוזות ו-template literals
בנייה ועיבוד של טקסט.
| פעולה | תחביר |
|---|---|
| Template literal | Hi ${name}, age ${age} (עטפו ב-backticks) |
| אורך | text.length |
| אותיות גדולות / קטנות | text.toUpperCase(), text.toLowerCase() |
| הסרת רווחים | text.trim() |
| החלפת כל המופעים | text.replaceAll("a", "b") |
| פיצול למערך | text.split(",") |
| בדיקת הכלה | text.includes("js") |
| חיתוך | text.slice(0, 3) |
מערכים ומתודות של מערכים
אוספים מסודרים והמתודות שעוברות עליהם.
| פעולה | תחביר |
|---|---|
| הוספה / הסרה בסוף | arr.push(4), arr.pop() |
| הוספה / הסרה בהתחלה | arr.unshift(0), arr.shift() |
| שינוי כל פריט | arr.map(x => x * 2) |
| שמירת פריטים תואמים | arr.filter(x => x > 0) |
| צמצום לערך יחיד | arr.reduce((sum, x) => sum + x, 0) |
| מציאת פריט | arr.find(x => x.id === 1) |
| בדיקת some / every | arr.some(f), arr.every(f) |
| האינדקס של ערך | arr.indexOf(3), arr.includes(3) |
| חיבור למחרוזת | arr.join(", ") |
אובייקטים
אוספים של מפתח-ערך.
| פעולה | תחביר |
|---|---|
| יצירה | const user = { id: 1, name: "Ada" }; |
| גישה למאפיין | user.name, user["name"] |
| הוספה / עדכון של מאפיין | user.age = 25; |
| מחיקת מאפיין | delete user.age; |
| קבלת כל המפתחות / הערכים | Object.keys(user), Object.values(user) |
| קבלת זוגות | Object.entries(user) |
| מיזוג אובייקטים | Object.assign({}, a, b) |
| העתקה רדודה | const copy = { ...user }; |
בקרת זרימה
תנאים ולולאות.
| פעולה | תחביר |
|---|---|
| If / else if / else | if (x > 0) { … } else { … } |
| טרינרי | const y = x > 0 ? 1 : 0; |
| Switch | switch (x) { case 1: … break; } |
| לולאת for | for (let i = 0; i < 5; i++) { … } |
| For-of (ערכים) | for (const item of arr) { … } |
| For-in (מפתחות) | for (const key in obj) { … } |
| לולאת while | while (x < 10) { … } |
פונקציות ופונקציות חץ
הגדרת בלוקים לשימוש חוזר שאפשר לקרוא להם.
| פעולה | תחביר |
|---|---|
| הצהרת פונקציה | function add(a, b) { return a + b; } |
| פונקציית חץ | const add = (a, b) => a + b; |
| פונקציית חץ עם ארגומנט אחד | const sq = x => x * x; |
| פונקציית חץ בלי ארגומנטים | const now = () => Date.now(); |
| פרמטר עם ערך ברירת מחדל | function f(x = 0) { … } |
| פרמטרי rest | function f(...args) { … } |
| הפעלה מיידית (IIFE) | (() => { … })(); |
Destructuring ו-spread
פירוק ערכים והעתקה/מיזוג של מבנים.
| פעולה | תחביר |
|---|---|
| Destructuring של מערך | const [a, b] = arr; |
| Destructuring של אובייקט | const { id, name } = user; |
| שינוי שם תוך כדי פירוק | const { id: userId } = user; |
| ערך ברירת מחדל | const { age = 0 } = user; |
| Spread של מערך | const all = [...a, ...b]; |
| Spread של אובייקט | const next = { ...user, age: 25 }; |
| Rest בתוך destructuring | const [first, ...rest] = arr; |
Promises ו-async/await
טיפול בעבודה אסינכרונית כמו בקשות רשת.
| פעולה | תחביר |
|---|---|
| פונקציה אסינכרונית | async function load() { … } |
| המתנה ל-promise | const data = await fetch(url); |
| Then / catch | promise.then(res => …).catch(err => …) |
| Try / catch עם await | try { await f(); } catch (e) { … } |
| Resolve / reject | Promise.resolve(1), Promise.reject(err) |
| המתנה לכולם | await Promise.all([a, b]) |
| הראשון שמסתיים | await Promise.race([a, b]) |
התחביר המודרני של JavaScript שהכי שימושי, בעמוד אחד. ה-JavaScript cheat sheet הזה הוא דף עזר מהיר ל-ES6+ היומיומי: הצהרה על משתנים, מתודות של מחרוזות ושל מערכים, אובייקטים, פונקציות חץ, destructuring ו-async/await.
כל מה שכאן הוא JavaScript סטנדרטי שרץ בדפדפנים מודרניים וב-Node.js. העתיקו את מה שצריך, או נסו כל קטע קוד בזמן אמת בעורך האונליין של JS, בלי שום התקנה. רק מתחילים? קורס JavaScript האינטראקטיבי והחינמי של Coddy מלמד את אותו תחביר בצורה מעשית.
שאלות נפוצות על ה-JavaScript cheat sheet
האם ה-JavaScript cheat sheet הזה בחינם?
כן. ה-JavaScript cheat sheet הזה חינמי לגמרי, בלי צורך בהרשמה. שמרו אותו במועדפים וחזרו אליו בכל פעם שצריך לבדוק תחביר, מתודה של מערך או דפוס async.
מה ההבדל בין == ל-=== ב-JavaScript?
== הוא שוויון רופף: הוא ממיר את האופרנדים לאותו טיפוס לפני ההשוואה, ולכן 0 == "0" הוא true. === הוא שוויון קפדני: הוא משווה גם ערך וגם טיפוס בלי המרה, ולכן 0 === "0" הוא false. העדיפו === (ו-!==) כמעט בכל מקרה: הוא צפוי ונמנע מהמרות מפתיעות.מה ההבדל בין let, const ו-var?
const ו-let תחומים לבלוק ונוספו ב-ES6; var תחום לפונקציה וישן יותר. השתמשו ב-const לערכים שלעולם לא משימים מחדש, ב-let לערכים שכן, והימנעו מ-var כדי למנוע באגים של hoisting ושל תחום. שימו לב שעדיין אפשר לשנות את התוכן של אובייקט או מערך שהוגדרו עם const: רק הקישור עצמו קבוע.אפשר לתרגל JavaScript אונליין?
כן. פתחו את עורך האונליין של JS כדי להריץ כל קטע קוד מדף העזר הזה בדפדפן, בלי שום התקנה. כשתרצו מסגרת מסודרת, קורס JavaScript האינטראקטיבי והחינמי של Coddy לוקח אתכם צעד אחר צעד ממשתנים ולולאות ועד מתודות של מערכים ו-async/await.
האם דף העזר הזה מתאים למתחילים?
כן. הוא מסודר מהבסיס (משתנים, טיפוסי נתונים, מחרוזות) ועד destructuring ו-async/await, כך שאפשר להשתמש בחלקים העליונים כבר מהיום הראשון ולהתקדם ליכולות המודרניות של ES6+.
משאבים קשורים
עוד דפי עזר
