1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
|
---
title: אחסון המידע שאנחנו צריכים - משתנים וקבועים
slug: Learn/JavaScript/First_steps/Variables
translation_of: Learn/JavaScript/First_steps/Variables
---
<div>{{LearnSidebar}}</div>
<div>{{PreviousMenuNext("Learn/JavaScript/First_steps/What_went_wrong", "Learn/JavaScript/First_steps/Math", "Learn/JavaScript/First_steps")}}</div>
<p class="summary">לאחר קריאת המאמרים הקודמים, אתם אמורים לדעת כבה מהי JavaScript ומה היא יכולה לעשות עבורנו, כיצד אנו משתמשים ביחד עם טכנולוגיות web אחרות ומה המאפיינים העיקריים שלה ממעוף הציפור. במאמר זה אנחנו ניכנס לעומק של הבסיס של השפה ונסתכל על אחד מאבני הבניין של השפה - משתנים.</p>
<table class="learn-box">
<tbody>
<tr>
<th scope="row">ידע מוקדם:</th>
<td>הבנה בסיסית של מחשב, הבנה בסיסית של HTML, CSS ו - JavaScript.</td>
</tr>
<tr>
<th scope="row">מטרה:</th>
<td>לקבל הכרות עם הבסיס של המשתנים.</td>
</tr>
</tbody>
</table>
<h2 id="כלים_נדרשים">כלים נדרשים</h2>
<p>לאורך מאמר זה, תתבקשו להזין מספר שורות קוד בקונסולה על מנת לבדוק את ההבנה שלכם. אם אתם משתמשים בדפדפן במחשב, הדרך הכי טובה לבדוק את הקוד היא באמצעות הקונסולה של JavaScript. לפרטים נוספים אודות הקונסולה ראה <a href="/en-US/docs/Learn/Common_questions/What_are_browser_developer_tools">What are browser developer tools</a>.</p>
<h2 id="מהו_משתנה">מהו משתנה?</h2>
<p>משתנה הוא קופסאת אחסון או קונטיינר, לערך מסויים. כמו שאנחנו עשויים להשתמש במספר על מנת לסכום, או במחרוזת על מנת להציג טקסט. משהו מיוחד בנוגע למשתנים הוא שהערכים שלהם יכולים להשתנות. נסתכל על הדוגמא הבאה:</p>
<pre class="brush: html"><button>Press me</button></pre>
<pre class="brush: js">const button = document.querySelector('button');
button.onclick = function() {
let name = prompt('What is your name?');
alert('Hello ' + name + ', nice to see you!');
}</pre>
<p>{{ EmbedLiveSample('What_is_a_variable', '100%', 50, "", "", "hide-codepen-jsfiddle") }}</p>
<p>בדוגמא זו, לחיצה על הכפתור תריץ מספר שורות קוד. הקוד בשורה 4 מקפיץ הודעה על גבי המסך של המשתמש ומבקש ממנו להכניס את שמו ומאחסן את הערך שהוזן במשתנה שעונה לשם <code>name</code>. הקוד בשורה 5 מקפיץ לנו הודעה נוספת עם שמו של המשתמש, שנלקח מהערך של המשתנה <code>name</code>.</p>
<p>על מנת להבין מדוע זה שימושי כל כך, נסו לחשוב על דרך לרשום את הדוגמא הזו, מבלי להשתמש במשתנה. זה עלול להיראות כמו הקוד הבא:</p>
<pre class="example-bad">let name = prompt('What is your name?');
if (name === 'Adam') {
alert('Hello Adam, nice to see you!');
} else if (name === 'Alan') {
alert('Hello Alan, nice to see you!');
} else if (name === 'Bella') {
alert('Hello Bella, nice to see you!');
} else if (name === 'Bianca') {
alert('Hello Bianca, nice to see you!');
} else if (name === 'Chris') {
alert('Hello Chris, nice to see you!');
}
// ... and so on ...</pre>
<p>אתם אולי לא מבינים עדיין את הסינטקס להצהרה על משתנה, אבל אתם מבינים את הרעיון - אם לא היו לנו משתנים, היינו צריכים לרשום כמויות עצומות של קוד, על מנת לבדוק האם השם אשר הוכנס על ידי המשתמש תואם למה שהגדרנו ואז להציג את ההודעה המתאימה. ברור ששימוש באופציה זו אינו יעיל בשום צורה ופשוט לא יעבוד שכן לא ניתן להכניס את האפשרויות בעולם.</p>
<p>קיומם של משתנים הוא הגיוני ונדרש, וככל שנלמד יותר לעומק JavaScript אנחנו נתרגל לשימוש בהם באופן טבעי.</p>
<p>דבר מיוחד נוסף לגבי משתנים הוא העובדה שהם יכולים להכיל כל דבר - לא רק מחרוזת או מספרים. משתנים יכולים להכיל גם מידע מורכב ואפילו פונקציות שלמות. נלמד על כך בהמשך.</p>
<div class="note">
<p><strong>לתשומת לב</strong>: אנחנו אומרים שמשתנים מכילים ערכים. זוהי אבחנה שחשוב לשים אליה. משתנים אינם ערכים בעצמם; הם רק קופסאות אחסון - קונטיינרים, בעבור ערכים. ניתן לדמיין זאת באמצעות התמונה הבאה:</p>
</div>
<p><img alt="" src="https://mdn.mozillademos.org/files/13506/boxes.png" style="display: block; height: 436px; margin: 0px auto; width: 1052px;"></p>
<h2 id="Declaring_a_variable_-_הצהרה_על_משתנה">Declaring a variable - הצהרה על משתנה</h2>
<p>על מנת לעשות שימוש במשתנה, אנחנו קודם כל צריכים ליצור אותו, או יותר מדוייק, אנחנו צריכים להצהיר עליו. על מנת להצהיר על משתנה אנחנו צריכים להשתמש במילה השמורה <code>var</code> <strong>או</strong> במילה השמורה <code>let</code> ולאחריהן השם שנרצה לתת למשתנה:</p>
<pre class="brush: js">let myName;
let myAge;</pre>
<p>כאן הצהרנו על שני משתנים שנקראים <code>myName</code> ו- <code>myAge</code>. נסו להזין את השורות האלו בקונסולה. לאחר מכן, נסו ליצור משתנה אחד או שניים בעצמכם.</p>
<div class="note">
<p><strong>לתשומת לב</strong>: ב- JavaScript, כל הוראת קוד (לא כל שורת קוד) צריכה להסתיים עם הסימן <code>;</code> - אם לא נכניס סימן זה, הקוד רוב הסיכויים יעבוד, אבל אם נכניס מספר שורות קוד ביחד, כנראה שלא. אנא התרגלו להוסיף <code>;</code> בעת שאתם כותבים את הקוד שלכם.</p>
</div>
<p>אתם יכולים לבדוק האם הערכים האלו קיימים בסביבת ההרצה על ידי הדפסה של שמות המשתנים לקונסולה כפי שמתואר להלן:</p>
<pre class="brush: js">myName;
myAge;</pre>
<p>כרגע למשתנים אלו אין כל ערך. אנחנו רק הצהרנו עליהם ובכך הם נוצרו, אך הם כרגע מעין ״קופסאות ריקות״. כשאנחנו מזינים את שמות המשתנים בקונסולה, קיבלנו בקונסולה <code>undefined</code>. אם לא היינו מצהירים עליהם, היינו מקבלים הודעת שגיאה אחרת. נסו להבין מה ההבדל ביניהם.</p>
<pre class="brush: js">scoobyDoo;</pre>
<div class="note">
<p><strong>לתשומת לב</strong>: אל תבלבלו בין משתנה שקיים אך לא מכיל ערך לבין משתנה שלא קיים כלל. אם נחשוב עליהם כקופסאות אחסון, משתנה שהוצהר אך לא נתנו לו ערך יצר לנו קופסא לאחסון, אך לא אחסנו בו כלום. כלומר הקופסא קיימת אך ריקה. במקרה כזה נקבל את הערך <code>undefined</code>.</p>
<p>לעומת זאת, משתנה שלא הוצהר, זה כאילו לא יצרנו את קופסת האחסון מלכתחילה ולכן הודעת השגיאה שנקבל היא שהדפדפן לא מוצא את המשתנה, כלומר, הוא לא מוצא את קופסאת האחסון (כי לא יצרנו אותה).</p>
</div>
<h2 id="השמת_ערך_למשתנה">השמת ערך למשתנה</h2>
<p>ברגע שהצהרנו על משתנה, אנחנו יכולים לאתחל אותו עם ערך שנשים לו. אנחנו עושים זאת על ידי סימן ה-״שווה״ - <code>=</code>, ולאחריו הערך שאנחנו נרצה לשים במשתנה. לדוגמא:</p>
<pre class="brush: js">myName = 'Chris';
myAge = 37;</pre>
<p>נסו להזין בקונסולה את הקוד הבא. אתם אמורים להראות שהערכים שהשמנו למשתנים מוחזרים לנו בקונסולה. שוב, אנחנו יכולים לקבל את הערך של משתנה על ידי הזנת שמו לקונסולה. ננסה זאת שוב:</p>
<pre class="brush: js">myName;
myAge;</pre>
<p>ניתן להצהיר על משתנה וכן להשים לו ערך באותו זמן:</p>
<pre class="brush: js">let myDog = 'Rover';</pre>
<p>זו ככל הנראה תהיה הדרך שבה נרשום משתנים - הצהרה והשמה באותה שורה שכן זוהי דרך מהירה יותר מאשר לרשום הצהרה בשורה אחת והשמה של ערך בשורה אחרת.</p>
<h2 id="ההבדלים_בין_var_לבין_let">ההבדלים בין var לבין let</h2>
<p>בשלב זה אתם בטח שואלים ״מדוע צריכים שתי מילים שמורות על מנת להגדיר משתנים?״ או ״למה יש לנו גם את <code>let</code> וגם את <code>var</code>?״</p>
<p>הסיבות הן בעיקר היסטוריות. כאשר JavaScript רק נוצרה, היה קיים רק <code>var</code>. זה עבד במרבית המקרים, אבל היו לו סוגיות שונות בצורה ובדרך שבה הוא עבד. ההתנהגות שלו הייתה יכולה להיות מבלבלת וקצת מעצבנת. לכן, <code>let</code> נוצר בגרסאות מודרניות יותר של JavaScript, והציג מילה שמורה חדשה ליצירת משתנים, אשר פועלת בצורה אחרת מהמילה השמורה <code>var</code> ומתקנת את הסוגיות שהיו עם דרך ההגדרה הקודמת. סתם לידיעה - דרך זו של שימוש במילה השמורה <code>let</code> החלה בגרסת העדכון החשובה של JavaScript שנקראת ES2015 (ES6).</p>
<p>אנו נגע במספר הבדלים פשוטים ביניהם, אך לא ניגע בכולם כרגע. אנו נבין את ההבדלים ביניהם בהמשך ככל שניכנס יותר לעומק של השפה. אם תרצו להרחיב בנושא - היכנסו לקישור <a href="/en-US/docs/Web/JavaScript/Reference/Statements/let">let reference page</a>.</p>
<p>נתחיל בכך שאם נרשום מספר שורות קוד שבהן נצהיר על משתנה ונשים בו ערך. אנחנו יכולים להצהיר על משתנה באמצעות שימוש במילה <code>var</code> גם לאחר שהשמנו בו ערך והתוכנית עדיין תעבוד. כלומר, המשתנה יהיה מוכר לדפדפן. לדוגמא:</p>
<pre class="brush: js">myName = 'Chris';
function logName() {
console.log(myName);
}
logName();
var myName;</pre>
<div class="note">
<p><strong>לתשומת לב</strong>: קוד זה לא יעבוד כשננסה להכניס אותו שורה אחר שורה בקונסולה אלא רק כשנכניס את כל שורות קוד באמצעות JavaScript.</p>
</div>
<p>זה עובד בגלל מנגנון שנקרא <strong>Hoisting. </strong>אם תרצו להרחיב על כך, ראו <a href="/en-US/docs/Web/JavaScript/Reference/Statements/var#var_hoisting">קישור</a> לפרטים נוספים על הנושא. בקצרה המשמעות שלו היא שב-JavaScript הצהרות על משתנים (והצהרות בכללי) מבוצעות לפני שיתר הקוד רץ, כלומר, הצהרה על משתנה במקום מסויים בקוד תהיה זהה להצהרה שלו בתחילת הקוד. יחד עם זאת, חשוב לשים לב שמנגנון זה משפיע רק על הצהרה של משתנים ולא על השמה של ערכים אליהם. הערכים שלהם יושמו אליהם בהתאם לסדר ריצת הקוד. </p>
<p>Hoisting לא מתבצע יותר עם המילה השמורה <code>let</code>. אם נשנה את <code>var</code> ל- <code>let</code> בדוגמא למעלה, זה יציג לנו שגיאה. זה דבר טוב כמובן - הצהרה על משתנה לאחר שאנחנו משימים לו ערך גורמת לבלבול ולקושי בקריאה והבנה של הקוד.</p>
<p>בנוסף, כשאנחנו משתמשים ב- <code>var</code>, אנחנו יכולים להצהיר על המשתנה שיצרנו באמצעותו כמה פעמים שנרצה ואילו בעת שימוש ב- <code>let</code> אנחנו לא יכולים. הקוד הבא לדוגמא, יעבוד:</p>
<pre class="brush: js">var myName = 'Chris';
var myName = 'Bob';</pre>
<p>אבל הקוד הבא יקפיץ לנו שגיאה בשורה השנייה:</p>
<pre class="brush: js">let myName = 'Chris';
let myName = 'Bob';</pre>
<p>ולכן נצטרך לרשום אותו בצורה הבאה:</p>
<pre class="brush: js">let myName = 'Chris';
myName = 'Bob';</pre>
<p>שוב, מדובר בכלל חשוב אשר נועד למנוע הצהרה חוזרת של משתנה. אנו ממליצים לבצע שימוש כמה שיותר ב- <code>let</code> מאשר ב-<code>var</code> . אין שום סיבה שנרצה להשתמש ב- <code>var</code>, אלא אם אנחנו צריכים לתמוך בגרסאות ישנות של אינטרנט אקספלורר (גרסאות ישנות אלו לא תומכות ב- <code>let</code> אלא רק החל מגרסה 11; הדפדפן אדג׳ לעומת זאת תומך במלואו ב-<code>let</code>).</p>
<div class="note">
<p><strong>לתשומת לב</strong>: אנחנו בשלבים של עדכון הדוגמאות בקורס זה לשימוש ב- <code>let</code> במקום <code>var</code>.</p>
</div>
<h2 id="עדכון_משתנה">עדכון משתנה</h2>
<p>ברגע שמשתנה הוצהר והושם לו ערך, אנחנו יכולים לשנות (או לעדכן) את הערך שנמצא באותו משתנה, פשוט על ידי השמה של ערך אחר. נסו להזין את הקוד הבא בקונסולה:</p>
<pre class="brush: js">myName = 'Bob';
myAge = 40;</pre>
<h3 id="מס׳_כללים_בנוגע_לשמות_משתנים">מס׳ כללים בנוגע לשמות משתנים</h3>
<p>אנחנו יכולים לקרוא למשתנים שלנו כמעט בכל שם שנרצה, אבל ישנן מס׳ הגבלות. באופן כללי, היצמדו לשימוש באותיות לועזיות (0-9, a-z, A-Z) ולתו מסוג קו תחתון.</p>
<ul>
<li>אל תשתמשו בתווים אחרים מכיוון שהם עלולים לגרום לשגיאות או שיהיה קשה להבין אותם - דמיינו שמתכנת צרפתי קורא למשתנים בשפה הצרפתית ומתכנת בריטי מנסה להבין מה פשר המשתנה.</li>
<li>אל תשימו קו תחתון בתחילת שמו של המשתנה - קו תחתון זה משמש במספר מבנים של JavaScript על מנת להצביע על דברים ספציפיים וזה עשוי לגרום לבלבול.</li>
<li>אל תשתמשו במספרים בתחילת השם של המשתנה. זה יגרום לשגיאה.</li>
<li>מוסכמה מקובלת היא להשתמש ב-<a href="https://en.wikipedia.org/wiki/CamelCase#Variations_and_synonyms">״lower camel case"</a> - כאשר אנו קוראים למשתנה בשם המכיל מס׳ מילים, המילה הראשונה תתחיל באות קטנה, ואילו יתר המילים לאחר יתחילו באות גדולה.</li>
<li>אנא תנו למשתנים שלכם שמות הגיוניים ואינטואטיביים, על מנת לנסות לתאר כמה שניתן איזה מידע הם מכילים. אל תשתמשו באותיות או במספרים לבד. מצד שני, אל תקראו למשתנים בשמות ארוכים מדי.</li>
<li>משתנים הם case sensitive — כך לדוגמא המשתנה <code>myage</code> הוא משתנה שונה מהמשתנה <code>myAge</code>.</li>
<li>נסו להימנע משימוש במילים השמורים של JavaScript בתור שמות למשתנים. מילים שמורות אלו אותן מילים שמרכיבות את הסינטקס של השפה. כלומר, אנחנו לא יכולים להשתמש במילים כגון: <code>var</code>, <code>function</code>, <code>let</code>, וכן גם <code>for</code> כשמות למשתנים שלנו. הדפדפן יזהה אותם כרכיבי קוד אחרים, מה שעלול לגרום רוב הסיכויים לשגיאה.</li>
</ul>
<div class="note">
<p><strong>לתשומת לב</strong>: ניתן למצוא את רשימת המילים השמורות של השפה ב- <a href="/en-US/docs/Web/JavaScript/Reference/Lexical_grammar#Keywords">Lexical grammar — keywords</a>.</p>
</div>
<p>דוגמא למתן שמות למשתני בצורה נכונה:</p>
<pre class="example-good">age
myAge
init
initialColor
finalOutputValue
audio1
audio2</pre>
<p>דוגמא למתן שמות למשתני בצורה לא נכונה:</p>
<pre class="example-bad">1
a
_12
myage
MYAGE
var
Document
skjfndskjfnbdskjfb
thisisareallylongstupidvariablenameman</pre>
<p>מילים שמורות:</p>
<pre class="example-invalid">var
Document
</pre>
<p>נסו ליצור מספר משתנים חדשים בהתאם לכללים שציינו למעלה.</p>
<h2 id="סוגי_משתנים">סוגי משתנים</h2>
<p>ישנם מס׳ סוגים של מידע שנוכל לאחסן במשתנים. בחלק הזה אנחנו נתאר אותם בקצרה. במאמרים הבאים אנו נלמד אותם לעומק.</p>
<h3 id="Numbers_-_מספרים">Numbers - מספרים</h3>
<p>אנחנו יכולים לאחסן מספרים כמשתנים, בין אם הם מספר שלם, כמו 30, או בין אם הם מספר עשרוני, כמו 2.456. ב- JavaScript אנחנו לא צריכים להצהיר על סוג המשתנה, בשונה מכמה שפות תכנות אחרות. כשאנחנו נותנים למשתנה ערך מסוג מספר, אנחנו <strong>לא</strong> משימים את הערך בין גרשיים. לדוגמא:</p>
<pre class="brush: js">let myAge = 17;</pre>
<h3 id="Strings_-_מחרוזות">Strings - מחרוזות</h3>
<p>מחרוזות אלו חלקים של טקסט. כאשר אנחנו נותנים למשתנה ערך של מחרוזת, אנחנו צריכים לעטוף את המחרוזת בגרשיים כפולות <code>" "</code> או בגרש בודד <code>' '</code> אחרת JavaScript עלולה לנסות לפרש את הקוד כשם נוסף למשתנה. לדוגמא:</p>
<pre class="brush: js">let dolphinGoodbye = 'So long and thanks for all the fish';</pre>
<h3 id="Booleans_-_בוליאנים">Booleans - בוליאנים</h3>
<p>בוליאנים אלו ערכי אמת או שקר. משתנים שמכילים ערך בוליאני יכולים לקבל 2 ערכים: או ערך אמת <code>true</code> או ערך שקר <code>false</code>. לדוגמא:</p>
<pre class="brush: js">let iAmAlive = true;</pre>
<p>בפועל, אנחנו נשתמש במשתנה מסוג בוליאני בדרך הבאה:</p>
<pre class="brush: js">let test = 6 < 3;</pre>
<p>כאן ביצענו שימוש באופרטור ״קטן מ-״ (<code><</code>) על מנת לבדוק האם 6 קטן מ-3. כפי שניתן לצפות, זה יחזיר לנו <code>false</code> מכיוון ש-6 לא קטן מ-3. נלמד יותר לעומק על אופרטורים אלו בהמשך הקורס.</p>
<h3 id="Arrays_-_מערכים">Arrays - מערכים</h3>
<p>מערך הוא בעצם אובייקט יחיד, המכיל מספר ערכים המתוחמים בתוך סוגריים מרובעות. נסו להכניס את הקוד הבא לתוך הקונסולה:</p>
<pre class="brush: js">let myNameArray = ['Chris', 'Bob', 'Jim'];
let myNumberArray = [10, 15, 40];</pre>
<p>ברגע שהמערכים האלו מוצהרים, אנחנו יכולים לגשת לכל איבר במערך באמצעות ציון המיקום שלו במערך. נסו את הקוד הבא:</p>
<pre class="brush: js">myNameArray[0]; // should return 'Chris'
myNumberArray[2]; // should return 40</pre>
<p>הסוגרים המרובעות מצביעות על האינדקס המתאים למיקום של האיבר שאנחנו רוצים שיוחזר. שימו לב שהמיקומים במערך מתחילים מ-0. כלומר, האיבר הראשון במערך הוא באינדקס 0.</p>
<p>נרחיב על מערכים ב<a href="/en-US/docs/Learn/JavaScript/First_steps/Arrays">מאמר בהמשך הקורס</a>.</p>
<h3 id="Objects_-_אובייקטים">Objects - אובייקטים</h3>
<p>בתכנות, אובייקט הוא מבנה של קוד שמדמה אובייקט בעולם האמיתי. הוא מייצג מעין קופסא המכילה מידע על הגובה שלו, הרוחב שלו, האורך שלו או מאפיינים נוספים. אנחנו יכולים לדוגמא לייצר אובייקט שידמה אדם, ואובייקט זה יכיל מידע על שמו, גובה, משקל, שפה מדוברת וכד׳.</p>
<p>הכניסו את הקוד הבא בקונסולה:</p>
<pre class="brush: js">let dog = { name : 'Spot', breed : 'Dalmatian' };</pre>
<p>על מנת לאחזר מידע המאוחסן באובייקט, השתמשו בקוד הבא:</p>
<pre class="brush: js">dog.name</pre>
<p>אנו לא נעמיק בנושא אובייקטים כעת - אנו נלמד לעומק את הנושא ב<a href="/en-US/docs/Learn/JavaScript/Objects">מאמר</a> בהמשך.</p>
<h2 id="השמת_משתנים_דינאמית">השמת משתנים דינאמית</h2>
<p>JavaScript היא שפה דינאמית. שלא כמו שפות אחרת, ב- JavaScript אנחנו לא צריכים לציין איזה סוג של מידע יאוסן בתוך המשתנה (מספרים, מחרוזות, מערכים וכד׳).</p>
<p>לדוגמא, אם אנחנו מצהירים על משתנה ונותנים לו ערך שעטוף בגרשיים, הדפדפן יתייחס אליו כמחרוזת:</p>
<pre class="brush: js">let myString = 'Hello';</pre>
<p>אם נכניס מספרים בתוך הגרשיים, הוא עדיין יהיה מחרוזת!</p>
<pre class="brush: js">let myNumber = '500'; // oops, this is still a string
typeof myNumber;
myNumber = 500; // much better — now this is a number
typeof myNumber;</pre>
<p>נסו להכניס את הקוד שלמעלה לקונסולה שורה אחר שורה, וראו התוצאות. אתם תשימו לב שאתם משתמשים באופטור מיוחד שנקרא <a href="/en-US/docs/Web/JavaScript/Reference/Operators/typeof">typeof</a> - אופרטור זה מחזיר לנו את סוג הערך המאוחסן במשתנה שהעברנו לו. הפעם הראשונה שהרצנו את האופרטור הזה, הוא החזיר <code>string</code>, שכן באותה נקודה, המשתנה <code>myNumber</code> מכיל מחרוזת, <code>'500'</code>. בדקו מה הקונסולה תחזיר כשנזין את שתי השורות האחרונות.</p>
<h2 id="Constants_-_קבועים">Constants - קבועים</h2>
<p>להרבה שפות תכנות יש את הקונספט של <em>constant</em> או <em>קבוע</em> — משתנה שברגע שהכנסו לו ערך, אותו ערך לא משתנה. ישנן הרבה סיבות מדוע נרצה להשתמש בהם, מסיבות אבטחה - (אם סקריפט של אתר אחר מנסה לשנות את הערכים זה עלול ליצור בעיות) עד לפתרון שגיאות של הקוד והבנה שלו (קשה יותר לשנות בטעות ערכים שלא אמורים להשתנות).</p>
<p>בשלביה המוקדים של השפה, קבועים לא היו קיימים. כעת יש בשפה קבועים ואנו משתמשים במילה השמורה <code>const</code>, על מנת להצהיר עליהם ולהשים בערך ערך שלא ישתנה:</p>
<pre class="brush: js">const daysInWeek = 7<span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><span class="objectBox objectBox-number">;
const hoursInDay = 24;</span></span></span></span></pre>
<p><span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><span class="objectBox objectBox-number"><code>const</code> עובד בדיוק כמו <code>let</code>, למעט העובדה שאנחנו לא יכולים לתת ל- <code>const</code> ערך חדש. בדוגמא הבאה, השורה השנייה תציג לנו שגיאה בקונסולה:</span></span></span></span></p>
<pre class="brush: js">const daysInWeek = 7<span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><span class="objectBox objectBox-number">;
daysInWeek = 8;</span></span></span></span></pre>
<h2 id="לסיכום">לסיכום</h2>
<p>במאמר זה למדנו אודות משתנים - מהם, כיצד ליצור אותם ומה ההבדל בינם לקבועים. במאמר הבא אנחנו נלמד אודות מתמתיקה בסיסית ב-JavaScript.</p>
<p>{{PreviousMenuNext("Learn/JavaScript/First_steps/What_went_wrong", "Learn/JavaScript/First_steps/Maths", "Learn/JavaScript/First_steps")}}</p>
<h2 id="במודול_זה">במודול זה</h2>
<ul>
<li><a href="/he/docs/Learn/JavaScript/First_steps/What_is_JavaScript">מה זה JavaScript?</a></li>
<li><a href="/he/docs/Learn/JavaScript/First_steps/A_first_splash">מבט ראשון ל- JavaScript</a></li>
<li><a href="/he/docs/Learn/JavaScript/First_steps/What_went_wrong">מה השתבש? פתרון בעיות ב-JavaScript</a></li>
<li><a href="/he/docs/Learn/JavaScript/First_steps/Variables">אחסון המידע שאנחנו צריכים - משתנים — Variables</a></li>
<li><a href="/he/docs/Learn/JavaScript/First_steps/Math">מתמתיקה בסיסית ב- JavaScript — מספרים ואופרטורים</a></li>
<li><a href="/he/docs/Learn/JavaScript/First_steps/Strings">התמודדות עם טקסט — מחרוזות (Strings) ב-JavaScript</a></li>
<li><a href="/he/docs/Learn/JavaScript/First_steps/Useful_string_methods">מתודות שימושיות למחרוזות</a></li>
<li><a href="/he/docs/Learn/JavaScript/First_steps/Arrays">מערכים - Arrays</a></li>
<li><a href="/he/docs/Learn/JavaScript/First_steps/Silly_story_generator">תרגיל: Silly story generator</a></li>
</ul>
|