You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
This chapter briefly recaps the features of JavaScript that we've learned by now, paying special attention to subtle moments.
3
+
يلخص هذا الفصل بإيجاز ميزات جافاسكريبت التي تعلمناها حتى الآن، مع التركيز بشكل دقيق على مواضيع معيّنة.
4
4
5
-
## Code structure
5
+
## هيكل الكود البرمجي
6
6
7
-
Statements are delimited with a semicolon:
7
+
يتم الفصل بين التعابير بفاصلة منقوطة:
8
8
9
9
```js run no-beautify
10
10
alert('Hello'); alert('World');
11
11
```
12
12
13
-
Usually, a line-break is also treated as a delimiter, so that would also work:
13
+
كما يمكن اعتبار السطر الجديد كفاصل أيضاً بين التعابير:
14
14
15
15
```js run no-beautify
16
16
alert('Hello')
17
17
alert('World')
18
18
```
19
19
20
-
That's called "automatic semicolon insertion". Sometimes it doesn't work, for instance:
20
+
وهذا ما ندعوه بـِ "الإدراج التلقائي للفاصلة المنقوطة"، ولكنه لا يعمل بشكل صحيح في بعض الأحيان، فعلى سبيل المثال:
21
21
22
22
```js run
23
23
alert("There will be an error after this message")
24
24
25
25
[1, 2].forEach(alert)
26
26
```
27
27
28
-
Most codestyle guides agree that we should put a semicolon after each statement.
28
+
وهنا يجب التنويه أن معظم الأدلة والبرامج التعليمية تشير إلى أنه من الأفضل أن نضع الفواصل المنقوطة عند نهاية التعابير.
29
29
30
-
Semicolons are not required after code blocks `{...}`and syntax constructs with them like loops:
30
+
إلا أنه ليس مطلوبٌ وضع هذه الفواصل المنقوطة عند نهاية أقواس الكتل البرمجية `{...}`والتعليمات الخاصة كالحلقات على سبيل المثال:
31
31
32
32
```js
33
33
functionf() {
34
-
//no semicolon needed after function declaration
34
+
//ليس من المطلوب وضع الفاصلة المنقوطة بعد تعريف التابع
35
35
}
36
36
37
37
for(;;) {
38
-
//no semicolon needed after the loop
38
+
//ليس من المطلوب وضع الفاصلة المنقوطة بعد الحلقة التكرارية
39
39
}
40
40
```
41
41
42
-
...But even if we can put an "extra" semicolon somewhere, that's not an error. It will be ignored.
42
+
ولكن حتى لو قمنا بوضع فاصلة منقوطة إضافية في مكان ما، فهذا ليس بخطأ، حيث سيتمّ تجاهلها.
43
43
44
-
More in: <info:structure>.
44
+
للمزيد من التفاصيل: <info:structure>.
45
45
46
-
## Strict mode
46
+
## الوضع الدقيق (الصارم) (Strict mode)
47
47
48
-
To fully enable all features of modern JavaScript, we should start scripts with`"use strict"`.
48
+
لتمكين وتفعيل جميع ميزات الإصدار الحديث من جافاسكريبت، يجب علينا بدء أي ملف لبرنامج معين بـِ`"use strict"`.
49
49
50
50
```js
51
51
'use strict';
52
52
53
53
...
54
54
```
55
55
56
-
The directive must be at the top of a script or at the beginning of a function body.
56
+
يجب وضع هذه التعليمة أو التوجيه في أعلى النص البرمجي أو في بداية جسم التابع.
57
57
58
-
Without `"use strict"`, everything still works, but some features behave in the old-fashion, "compatible" way. We'd generally prefer the modern behavior.
58
+
وبدون وضع التعليمة `"use strict"`، سيعمل كل شيء على ما يرام، ولكن ستعمل بعض الميزات بأسلوبها القديم المتوافق مع السلوك الحديث. لذلك يُفضل عموماً استخدام هذا الأسلوب الأحدث.
59
59
60
-
Some modern features of the language (like classes that we'll study in the future) enable strict mode implicitly.
60
+
جديرٌ بالذكر، أن بعضاً من هذه الميزات (كالصفوف التي سندرسها في المستقبل) تقوم بتفعيل هذا الوضع الحديث (الدقيق) بشكل ضمني حتى لو لم يتم كتابة التعليمة بشكل صريح.
61
61
62
-
More in: <info:strict-mode>.
62
+
للمزيد من المعلومات: <info:strict-mode>.
63
63
64
-
## Variables
64
+
## المتحولات (المتغيرات)
65
65
66
-
Can be declared using:
66
+
يُمكن تعريفها كالتالي:
67
67
68
68
-`let`
69
-
-`const` (constant, can't be changed)
70
-
-`var` (old-style, will see later)
69
+
-`const` (ثابت، لا يمكن تغيير قيمته)
70
+
-`var` (باستخدام الأسلوب القديم، كما سنراه لاحقاً)
71
71
72
-
A variable name can include:
73
-
-Letters and digits, but the first character may not be a digit.
74
-
-Characters `$`and`_`are normal, on par with letters.
75
-
-Non-Latin alphabets and hieroglyphs are also allowed, but commonly not used.
72
+
يمكن أن يحتوي اسم المتحول على:
73
+
-الحروف والأرقام، ولكن بشرط ألا يكون المحرف الأول رقماً.
: Ask a `question`, and return either what the visitor entered or `null`if they clicked "cancel".
107
+
: عن طريق هذه التعليمة يتم طرح سؤال على المستخدم، مع حقل نصّي لإدخال الجواب المناسب، فيتم إرجاع القيمة التي أدخلها المستخدم أو `null`إذا نقر على زر الإلغاء (cancel).
108
108
109
109
[`confirm(question)`](mdn:api/Window/confirm)
110
-
: Ask a `question` and suggest to choose between Ok and Cancel. The choice is returned as `true/false`.
110
+
: تقوم هذه التعليمة بطرح سؤال مع إمكانية الجواب بموافق (Ok) أو إلغاء (Cancel). وبحسب الاختيار يتم إرجاع قيمة `false/true`.
111
111
112
112
[`alert(message)`](mdn:api/Window/alert)
113
-
: Output a`message`.
113
+
: تقوم هذه التعليمة بإظهار رسالة معيّنة`message`.
114
114
115
-
All these functions are *modal*, they pause the code execution and prevent the visitor from interacting with the page until they answer.
115
+
جميع التوابع السابقة هي عبارة عن ملاحظات شكلية أي يتم فتح نافذة صغيرة في أعلى الصفحة نفسها وتقوم بعرض السؤال، فتقوم هذه الملاحظة بإيقاف تنفيذ الكود البرمجي وتمنع المستخدم من التفاعل مع الصفحة حتى تتم الإجابة على السؤال المطروح.
: Regular: `* + - /`, also `%`for the remainder and`**`for power of a number.
133
+
العوامل الرياضية
134
+
: العوامل النظامية المعروفة كـَ `* + - /`، بالإضافة لـِ `%`لحساب باقي القسمة و`**`لحساب قوى أو أسّ عدد معين.
135
135
136
-
The binary plus `+` concatenates strings. And if any of the operands is a string, the other one is converted to string too:
136
+
يقوم العامل الرياضي `+` بضم سلاسل المحارف أيضاً (strings). وفي حال كان أي من المعاملات (طرفي العامل) من نمط سلسلة محارف، يتم تحويل نمط الطرف الآخر لسلسلة محارف أيضاً في حال لم يكن كذلك:
137
137
138
138
```js run
139
139
alert( '1' + 2 ); // '12', string
140
140
alert( 1 + '2' ); // '12', string
141
141
```
142
142
143
-
Assignments
144
-
: There is a simple assignment: `a = b`and combined ones like`a *= 2`.
143
+
الإسناد
144
+
: الإسناد البسيط هو من الشكل: `a = b`أما الإسناد المركّب فهو من الشكل`a *= 2`.
145
145
146
-
Bitwise
147
-
: Bitwise operators work with 32-bit integers at the lowest, bit-level: see the [docs](mdn:/JavaScript/Reference/Operators/Bitwise_Operators)when they are needed.
146
+
عوامل البِتّات (Bitwise)
147
+
: تقوم عوامل الـ Bitwise بالعمل مع الأعداد الصحيحة من فئة 32-بِت على الأقل، فهي تعمل على مستوى البِت، وللاطلاع عليها يمكن مراجعة [التوثيق](mdn:/JavaScript/Reference/Operators/Bitwise_Operators)عند الحاجة.
148
148
149
-
Conditional
150
-
: The only operator with three parameters: `cond ? resultA : resultB`. If `cond`is truthy, returns`resultA`, otherwise`resultB`.
149
+
العوامل الشرطية
150
+
: والعامل الشرطي هو العامل الوحيد الذي يأخذ ثلاث معاملات: `cond ? resultA : resultB`. فإذا كان الشرط `cond`صحيحاً، سيتمّ إرجاع`resultA` وإلا سيتم إرجاع`resultB`.
151
151
152
-
Logical operators
153
-
: Logical AND `&&`and OR `||`perform short-circuit evaluation and then return the value where it stopped (not necessary `true`/`false`). Logical NOT `!`converts the operand to boolean type and returns the inverse value.
152
+
العوامل المنطقية
153
+
: تقوم العوامل المنطقية AND `&&`وَ OR `||`باختصار عملية تقييم الكود البرمجي وإرجاع تلك القيمة حيث توقفت (وليس بالضرورة أن تكون تلك القيمة `true/false`). أما النفي المنطقي NOT `!`فيقوم بتحويل المعامل المُمرّر إلى نمط boolean ويرد القيمة المعاكسة له (نفي الشرط أو عكسه).
154
154
155
-
Nullish coalescing operator
156
-
: The `??`operator provides a way to choose a defined value from a list of variables. The result of`a ?? b`is `a`unless it's `null/undefined`, then`b`.
155
+
عامل دمج القيم الفارغة (غير الموجودة)
156
+
: يقدّم العامل `??`طريقة لاختيار قيمة محدّدة بين قائمة من المتحولات (المتغيرات). فنتيجة التعبير التالي`a ?? b`هي قيمة `a`ما لم تكن قيمته `null/undefined`، وإلا قيمة`b`.
157
157
158
-
Comparisons
159
-
: Equality check `==`for values of different types converts them to a number (except `null`and`undefined`that equal each other and nothing else), so these are equal:
158
+
المقارنات
159
+
: يقوم عامل التحقق من المساواة `==`للأنماط المختلفة بتحويل المعاملات لنمط رقم (number) (مالم تكن `null`أو`undefined`والتي تتساوى مع بعضها البعض ولا شي آخر يتساوى معها)، وبناءً عليه تعتبر التعابير التالية متساوية:
160
160
161
161
```js run
162
162
alert( 0 == false ); // true
163
163
alert( 0 == '' ); // true
164
164
```
165
165
166
-
Other comparisons convert to a number as well.
166
+
والمقارنات الأخرى تتحوّل لرقم أيضاً.
167
167
168
-
The strict equality operator `===` doesn't do the conversion: different types always mean different values for it.
168
+
في حين لا يقوم عامل المقارنة الدقيق `===` بالتحويل: أي أن الأنماط المختلفة تعني وجود قيم مختلفة دائماً.
169
169
170
-
Values `null` and `undefined` are special: they equal `==` each other and don't equal anything else.
170
+
أما القيم `null` و `undefined` فلها وضعٌ خاص: حيث تتساوى مع بعضها البعض عن طريق عامل المقارنة `==` ولا تتساوى مع أي شيء آخر.
171
171
172
-
Greater/less comparisons compare strings character-by-character, other types are converted to a number.
172
+
تقوم مقارنات الـ أكبر/أصغر بمقارنة سلسلة المحارف محرف محرف، في حين باقي الأنماط يتم تحويلها لنمط الرقم (number).
173
173
174
-
Other operators
175
-
: There are few others, like a comma operator.
174
+
عوامل أخرى
175
+
: هناك عوامل أخرى كذلك، كعامل الفاصلة.
176
176
177
-
More in: <info:operators>, <info:comparison>, <info:logical-operators>, <info:nullish-coalescing-operator>.
177
+
للمزيد من التفاصيل: <info:operators>, <info:comparison>, <info:logical-operators>, <info:nullish-coalescing-operator>.
178
178
179
-
## Loops
179
+
## الحلقات التكرارية
180
180
181
-
-We covered 3 types of loops:
181
+
-كنا قد قمنا سابقاً بتغطية ثلاثة أنواعٍ للحلقات:
182
182
183
183
```js
184
184
// 1
@@ -197,25 +197,25 @@ More in: <info:operators>, <info:comparison>, <info:logical-operators>, <info:nu
197
197
}
198
198
```
199
199
200
-
-The variable declared in`for(let...)`loop is visible only inside the loop. But we can also omit `let`and reuse an existing variable.
201
-
-Directives `break/continue`allow to exit the whole loop/current iteration. Use labels to break nested loops.
200
+
-يكون المتحول المعرف ضمن`for(let...)`مرئياً فقط داخل الحلقة. ولكن بإمكاننا حذف `let`وإعادة استخدام متحول معرّف قبل ذلك.
201
+
-تسمح التعمليات `break/continue`بالخروج من الحلقة بشكل كامل أو من التكرار الحالي فقط. يمكنك استخدامها لكسر الحلقات التكرارية المتداخلة.
202
202
203
-
Details in:<info:while-for>.
203
+
للمزيد من التفاصيل:<info:while-for>.
204
204
205
-
Later we'll study more types of loops to deal with objects.
205
+
سنقوم لاحقاً بدراسة المزيد من أنواع الحلقات التكرارية والتي تتعامل مع الأغراض (الكائنات).
206
206
207
-
## The "switch" construct
207
+
## جملة"switch"
208
208
209
-
The "switch" construct can replace multiple `if` checks. It uses `===` (strict equality) for comparisons.
209
+
يمكن أن تحلّ البنية البرمجية "switch"محلّ العديد من التحققات المبنية باستخدام `if`. حيث تستخدم عامل المقارنة الدقيق `===`للتحقق من القيم الممررة.
210
210
211
-
For instance:
211
+
على سبيل المثال:
212
212
213
213
```js run
214
214
let age = prompt('Your age?', 18);
215
215
216
216
switch (age) {
217
217
case 18:
218
-
alert("Won't work"); // the result of prompt is a string, not a number
218
+
alert("Won't work"); // نتيجة أو خرج التابع السابق هو من نمط سلسلة من المحارف وليس برقم
219
219
break;
220
220
221
221
case "18":
@@ -227,13 +227,13 @@ switch (age) {
227
227
}
228
228
```
229
229
230
-
Details in: <info:switch>.
230
+
للمزيد من التفاصيل:<info:switch>.
231
231
232
-
## Functions
232
+
## الدوال (التوابع)
233
233
234
-
We covered three ways to create a function in JavaScript:
234
+
كنا قد قمنا بتغطية ثلاثة أنواع لإنشاء الدوال في جافاسكريبت:
235
235
236
-
1. Function Declaration: the function in the main code flow
236
+
1. تعريف الدالة: حيث تكون الدالة موجودة ضمن نطاق التنفيذ الأساسي
237
237
238
238
```js
239
239
function sum(a, b) {
@@ -243,7 +243,7 @@ We covered three ways to create a function in JavaScript:
243
243
}
244
244
```
245
245
246
-
2. Function Expression: the function in the context of an expression
246
+
2.الدوال كتعابير: حيث تكون الدوال موجودة ضمن سياق تعبير عادي وليس كتعريف كما سبق
247
247
248
248
```js
249
249
let sum = function(a, b) {
@@ -253,32 +253,33 @@ We covered three ways to create a function in JavaScript:
253
253
};
254
254
```
255
255
256
-
3. Arrow functions:
256
+
3.الدوال كأسهم: (حيث تُرسم الدوال بطريقة تشبه شكل السهم)
257
257
258
258
```js
259
-
// expression at the right side
259
+
// توضع التعابير في الطرف اليميني
260
260
let sum = (a, b) => a + b;
261
261
262
-
// or multi-line syntax with { ... }, need return here:
262
+
// أو يمكن استخدام أكثر من سطر مع أقواس الكتل {...}
263
+
// ولكن سنحتاج لتعليمة return هنا:
263
264
let sum = (a, b) => {
264
265
// ...
265
266
return a + b;
266
267
}
267
268
268
-
// without arguments
269
+
// بلا معاملات
269
270
let sayHi = () => alert("Hello");
270
271
271
-
// with a single argument
272
+
// مع معامل وحيد
272
273
let double = n => n * 2;
273
274
```
274
275
275
276
276
-
- Functions may have local variables: those declared inside its body. Such variables are only visible inside the function.
277
-
- Parameters can have default values: `function sum(a = 1, b = 2) {...}`.
278
-
- Functions always return something. If there's no `return` statement, then the result is `undefined`.
277
+
-يمكن أن تتضمن الدالة على متغيرات محلية: وهي المتغيرات التي يتم تعريفها ضمن جسم الدالة. وهذه المتغيرات تكون مرئية فقط ضمن الدالة نفسها.
278
+
-يمكن أن تحتوي المعاملات على قيم افتراضية:` {...} function sum(a = 1, b = 2)`.
279
+
-تقوم الدوال بإرجاع قيمة دائماً. وإذا لم يكن هنالك تعليمة `return`، ستكون النتيجة هي`undefined`.
279
280
280
-
Details: see <info:function-basics>, <info:arrow-functions-basics>.
281
+
للمزيد من التفاصيل:<info:function-basics>, <info:arrow-functions-basics>.
281
282
282
-
## More to come
283
+
## المزيد قادم
283
284
284
-
That was a brief list of JavaScript features. As of now we've studied only basics. Further in the tutorial you'll find more specials and advanced features of JavaScript.
285
+
كانت تلك قائمة مختصر بميزات جافاسكريبت، وحتى الآن قمنا بدراسة الأساسيات فقط. علاوةً على ذلك وفي البرنامج التعليمي، ستجد المزيد من الميزات الخاصة والمتقدمة لجافاسكريبت.
0 commit comments