Add languages Russian, Arabic, Chinese, Portuguese (#18305)
This commit is contained in:
Beau Carnes
committed by
mrugesh mohapatra
mrugesh mohapatra
parent
09d3eca712
commit
2ca3a2093f
@ -0,0 +1,76 @@
|
||||
---
|
||||
id: 587d7b7d367417b2b2512b1d
|
||||
title: ' Iterate Through the Keys of an Object with a for...in Statement'
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: يتكرر عبر مفاتيح كائن مع لـ ... في بيان
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> في بعض الأحيان قد تحتاج إلى التكرار من خلال جميع المفاتيح داخل كائن. يتطلب هذا بناء جملة محددًا في JavaScript يسمى <dfn>for ... في</dfn> العبارة. بالنسبة <code>users</code> ، قد يبدو هذا: <blockquote style=";text-align:right;direction:rtl"> لـ (السماح للمستخدم بالمستخدمين) { <br> console.log (المستخدم)؛ <br> }؛ <br><br> // سجلات: <br> آلان <br> جيف <br> ساره <br> ريان </blockquote> في هذا البيان ، قمنا بتعريف <code>user</code> متغير ، وكما ترى ، تمت إعادة تعيين هذا المتغير أثناء كل عملية تكرار لكل مفتاح من مفاتيح الكائن كالتعبير المتكرر من خلال الكائن ، مما أدى إلى طباعة اسم كل مستخدم إلى وحدة التحكم. <strong>ملحوظة:</strong> <br> لا تحتفظ الكائنات بأمر على المفاتيح المخزنة مثل المصفوفات؛ وبالتالي ، يكون موضع المفاتيح في كائن ما ، أو الترتيب النسبي الذي يظهر فيه ، غير ذي صلة عند الإشارة إلى هذا المفتاح أو الوصول إليه. </section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> لقد قمنا بتعريف وظيفة ، <code>countOnline</code> ؛ استخدم عبارة <dfn>for ... في</dfn> العبارة داخل هذه الوظيفة للتكرار بين المستخدمين في كائن <code>users</code> وإرجاع عدد المستخدمين الذين تم تعيين الخاصية الخاصة بهم <code>online</code> إلى <code>true</code> . </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: يحتوي كائن <code>users</code> على المستخدمين <code>Jeff</code> <code>Ryan</code> مع تعيين <code>online</code> على <code>true</code> والمستخدمين <code>Alan</code> <code>Sarah</code> مع تعيين <code>online</code> إلى <code>false</code>
|
||||
testString: 'assert(users.Alan.online === false && users.Jeff.online === true && users.Sarah.online === false && users.Ryan.online === true, "The <code>users</code> object contains users <code>Jeff</code> and <code>Ryan</code> with <code>online</code> set to <code>true</code> and users <code>Alan</code> and <code>Sarah</code> with <code>online</code> set to <code>false</code>");'
|
||||
- text: ترجع الدالة <code>countOnline</code> عدد المستخدمين الذين تم تعيين الخاصية <code>online</code> إلى <code>true</code>
|
||||
testString: 'assert((function() { users.Harry = {online: true}; users.Sam = {online: true}; users.Carl = {online: true}; return countOnline(users) })() === 5, "The function <code>countOnline</code> returns the number of users with the <code>online</code> property set to <code>true</code>");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
let users = {
|
||||
Alan: {
|
||||
age: 27,
|
||||
online: false
|
||||
},
|
||||
Jeff: {
|
||||
age: 32,
|
||||
online: true
|
||||
},
|
||||
Sarah: {
|
||||
age: 48,
|
||||
online: false
|
||||
},
|
||||
Ryan: {
|
||||
age: 19,
|
||||
online: true
|
||||
}
|
||||
};
|
||||
|
||||
function countOnline(obj) {
|
||||
// change code below this line
|
||||
|
||||
// change code above this line
|
||||
}
|
||||
|
||||
console.log(countOnline(users));
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,59 @@
|
||||
---
|
||||
id: 5a661e0f1068aca922b3ef17
|
||||
title: Access an Array's Contents Using Bracket Notation
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: الوصول إلى محتويات صفيف باستخدام تدرج قوس
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> إن الميزة الأساسية لأي بنية بيانات هي ، بالطبع ، القدرة على تخزين البيانات فحسب ، بل أيضًا القدرة على استرداد البيانات الموجودة في الأمر. والآن ، بعد أن تعلمنا كيفية إنشاء مصفوفة ، فلنبدأ في التفكير في كيفية الوصول إلى معلومات هذا الصفيف. عندما نحدد صفيفًا بسيطًا كما هو موضح أدناه ، يوجد 3 عناصر فيه: <blockquote style=";text-align:right;direction:rtl"> let ourArray = ["a"، "b"، "c"]؛ </blockquote> في صفيف ، يحتوي كل عنصر صفيف على <dfn>فهرس</dfn> . يتضاعف هذا المؤشر كموضع لهذا العنصر في الصفيف ، وكيف يمكنك الرجوع إليه. ومع ذلك، فمن المهم أن نلاحظ، أن صفائف جافا سكريبت <dfn>صفر-فهرستها،</dfn> وهذا يعني أن العنصر الأول من مجموعة هو في الواقع في موقف <em><strong>الصفري،</strong></em> وليس الأول. من أجل استرداد عنصر من صفيف ، يمكننا وضع فهرس بين قوسين وإلحاقه بنهاية مصفوفة ، أو بشكل أكثر شيوعًا ، إلى متغير يشير إلى كائن مصفوفة. هذا هو المعروف باسم <dfn>تدوين قوس</dfn> . على سبيل المثال ، إذا أردنا استرداد <code>"a"</code> من <code>ourArray</code> وتعيينه إلى متغير ، فيمكننا القيام بذلك باستخدام الكود التالي: <blockquote style=";text-align:right;direction:rtl"> دع ourVariable = ourArray [0]؛ <br> // our المتغير يساوي "a" </blockquote> بالإضافة إلى الوصول إلى القيمة المرتبطة بفهرس ، يمكنك أيضًا <em>تعيين</em> فهرس لقيمة باستخدام نفس الترميز: <blockquote style=";text-align:right;direction:rtl"> ourArray [1] = "not b anymore"؛ <br> // ourArray الآن تساوي ["a"، "not b anymore"، "c"]؛ </blockquote> باستخدام تدوين قوس ، قمنا الآن بإعادة تعيين العنصر في الفهرس 1 من <code>"b"</code> إلى <code>"not b anymore"</code> . </section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> لإكمال هذا التحدي ، قم بتعيين الموضع الثاني (الرقم <code>1</code> ) من <code>myArray</code> إلى أي شيء تريده ، إلى جانب <code>"b"</code> . </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: '<code>myArray[0]</code> يساوي <code>"a"</code>'
|
||||
testString: 'assert.strictEqual(myArray[0], "a", "<code>myArray[0]</code> is equal to <code>"a"</code>");'
|
||||
- text: 'لم يعد <code>myArray[1]</code> مضبوطًا على <code>"b"</code>'
|
||||
testString: 'assert.notStrictEqual(myArray[1], "b", "<code>myArray[1]</code> is no longer set to <code>"b"</code>");'
|
||||
- text: '<code>myArray[2]</code> يساوي <code>"c"</code>'
|
||||
testString: 'assert.strictEqual(myArray[2], "c", "<code>myArray[2]</code> is equal to <code>"c"</code>");'
|
||||
- text: '<code>myArray[3]</code> يساوي <code>"d"</code>'
|
||||
testString: 'assert.strictEqual(myArray[3], "d", "<code>myArray[3]</code> is equal to <code>"d"</code>");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
let myArray = ["a", "b", "c", "d"];
|
||||
// change code below this line
|
||||
|
||||
//change code above this line
|
||||
console.log(myArray);
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,73 @@
|
||||
---
|
||||
id: 587d7b7c367417b2b2512b1a
|
||||
title: Access Property Names with Bracket Notation
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: الوصول إلى خاصية الأسماء مع تدرج قوس
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> في التحدي الكائن الأول ذكرنا استخدام تدوين قوس كطريقة للوصول إلى قيم الممتلكات باستخدام تقييم متغير. على سبيل المثال ، تخيل أن <code>foods</code> يتم استخدامها في برنامج لسجل النقدية في السوبر ماركت. لدينا بعض الوظائف التي تحدد <code>foods</code> <code>selectedFood</code> ونريد أن نتحقق من أن <code>foods</code> كائن لوجود ذلك الطعام. قد يبدو هذا كالتالي: <blockquote style=";text-align:right;direction:rtl"> السماح selectFood = getCurrentFood (scannedItem)؛ <br> السماح للمخزون = الأطعمة [selectFood] ؛ </blockquote> سيقوم هذا الكود بتقييم القيمة المخزنة في المتغير <code>selectedFood</code> والصادر وإعادة قيمة هذا المفتاح في كائن <code>foods</code> ، أو يتم <code>undefined</code> إذا لم تكن موجودة. يعتبر تدرج قوس مفيد جدًا لأن أحيانًا لا تكون خصائص الكائن معروفة قبل وقت التشغيل أو نحتاج إلى الوصول إليها بطريقة أكثر ديناميكية. </section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> لقد قمنا بتعريف وظيفة ، <code>checkInventory</code> ، الذي يتلقى عنصرًا تم مسحه ضوئيًا كوسيطة. قم <code>scannedItem</code> القيمة الحالية لمفتاح <code>scannedItem</code> في كائن <code>foods</code> . يمكنك افتراض أنه سيتم توفير المفاتيح الصالحة فقط كوسيطة <code>checkInventory</code> . </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: <code>checkInventory</code> هي وظيفة
|
||||
testString: 'assert.strictEqual(typeof checkInventory, "function", "<code>checkInventory</code> is a function");'
|
||||
- text: 'يجب أن يحتوي جسم <code>foods</code> على أزواج القيمة الرئيسية التالية: <code>apples: 25</code> ، <code>oranges: 32</code> ، <code>plums: 28</code> ، <code>bananas: 13</code> ، <code>grapes: 35</code> ، <code>strawberries: 27</code>'
|
||||
testString: 'assert.deepEqual(foods, {apples: 25, oranges: 32, plums: 28, bananas: 13, grapes: 35, strawberries: 27}, "The <code>foods</code> object should have only the following key-value pairs: <code>apples: 25</code>, <code>oranges: 32</code>, <code>plums: 28</code>, <code>bananas: 13</code>, <code>grapes: 35</code>, <code>strawberries: 27</code>");'
|
||||
- text: <code>checkInventory("apples")</code> <code>25</code>
|
||||
testString: 'assert.strictEqual(checkInventory("apples"), 25, "<code>checkInventory("apples")</code> should return <code>25</code>");'
|
||||
- text: <code>checkInventory("bananas")</code> <code>13</code>
|
||||
testString: 'assert.strictEqual(checkInventory("bananas"), 13, "<code>checkInventory("bananas")</code> should return <code>13</code>");'
|
||||
- text: <code>checkInventory("strawberries")</code> <code>27</code>
|
||||
testString: 'assert.strictEqual(checkInventory("strawberries"), 27, "<code>checkInventory("strawberries")</code> should return <code>27</code>");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
let foods = {
|
||||
apples: 25,
|
||||
oranges: 32,
|
||||
plums: 28,
|
||||
bananas: 13,
|
||||
grapes: 35,
|
||||
strawberries: 27
|
||||
};
|
||||
// do not change code above this line
|
||||
|
||||
function checkInventory(scannedItem) {
|
||||
// change code below this line
|
||||
|
||||
}
|
||||
|
||||
// change code below this line to test different cases:
|
||||
console.log(checkInventory("apples"));
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,61 @@
|
||||
---
|
||||
id: 587d78b2367417b2b2512b0e
|
||||
title: Add Items to an Array with push() and unshift()
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: إضافة عناصر إلى مصفوفة بدفع () و unshift ()
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> لم يتم إصلاح طول الصفيف ، مثل أنواع البيانات التي يمكن أن تحتويها. يمكن تعريف المصفوفات بطول أي عدد من العناصر ، ويمكن إضافة العناصر أو إزالتها بمرور الوقت ؛ بمعنى آخر ، المصفوفات <dfn>قابلة للتغيير</dfn> . في هذا التحدي ، سننظر في طريقتين يمكننا من <code>Array.push()</code> تعديل صفيف <code>Array.push()</code> : <code>Array.push()</code> و <code>Array.unshift()</code> . تأخذ كلتا الطريقتين عنصرًا واحدًا أو أكثر كمعلمات وإضافة هذه العناصر إلى الصفيف الذي يتم استدعاء الأسلوب عليه؛ تضيف طريقة <code>push()</code> عناصر إلى نهاية صفيف ، <code>unshift()</code> عناصر إلى البداية. خذ بعين الاعتبار ما يلي: <blockquote style=";text-align:right;direction:rtl"> واسمحوا twentyThree = 'الثالث والعشرون' ؛ <br> let romanNumerals = ['XXI'، 'XXII']؛ <br><br> romanNumerals.unshift ('XIX'، 'XX')؛ <br> // الآن تساوي ['XIX' ، 'XX' ، 'XXI' ، 'XXII'] <br><br> romanNumerals.push (twentyThree)؛ <br> // الآن تساوي ['XIX'، 'XX'، 'XXI'، 'XXII'، 'XXIII'] لاحظ أنه يمكننا أيضًا تمرير المتغيرات ، مما يتيح لنا مرونة أكبر في تعديل بيانات المصفوفة ديناميكيًا. </blockquote></section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> لقد حددنا وظيفة ، <code>mixedNumbers</code> ، والتي نحن نمرر مصفوفة كحجة. قم بتعديل الوظيفة باستخدام <code>push()</code> و <code>unshift()</code> لإضافة <code>'I', 2, 'three'</code> إلى بداية الصفيف و <code>7, 'VIII', 9</code> إلى النهاية بحيث يحتوي الصفيف الذي تم إرجاعه على تمثيلات للأرقام 1-9 بالترتيب. </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: '<code>mixedNumbers(["IV", 5, "six"])</code> يجب أن تعود الآن <code>["I", 2, "three", "IV", 5, "six", 7, "VIII", 9]</code>'
|
||||
testString: 'assert.deepEqual(mixedNumbers(["IV", 5, "six"]), ["I", 2, "three", "IV", 5, "six", 7, "VIII", 9], "<code>mixedNumbers(["IV", 5, "six"])</code> should now return <code>["I", 2, "three", "IV", 5, "six", 7, "VIII", 9]</code>");'
|
||||
- text: يجب استخدام الدالة <code>mixedNumbers</code> الأسلوب <code>push()</code>
|
||||
testString: 'assert.notStrictEqual(mixedNumbers.toString().search(/\.push\(/), -1, "The <code>mixedNumbers</code> function should utilize the <code>push()</code> method");'
|
||||
- text: و <code>mixedNumbers</code> وظيفة يجب الاستفادة من <code>unshift()</code> طريقة
|
||||
testString: 'assert.notStrictEqual(mixedNumbers.toString().search(/\.unshift\(/), -1, "The <code>mixedNumbers</code> function should utilize the <code>unshift()</code> method");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
function mixedNumbers(arr) {
|
||||
// change code below this line
|
||||
|
||||
// change code above this line
|
||||
return arr;
|
||||
}
|
||||
|
||||
// do not change code below this line
|
||||
console.log(mixedNumbers(['IV', 5, 'six']));
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,63 @@
|
||||
---
|
||||
id: 587d78b3367417b2b2512b11
|
||||
title: Add Items Using splice()
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: إضافة عناصر باستخدام لصق ()
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> تذكر في التحدي الأخير ذكرنا أن <code>splice()</code> يمكن أن يستغرق ما يصل إلى ثلاثة معلمات؟ حسنا ، يمكننا أن نذهب خطوة أخرى مع <code>splice()</code> - بالإضافة إلى إزالة العناصر ، يمكننا استخدام هذه المعلمة الثالثة ، والتي تمثل واحد أو أكثر من العناصر ، <em>لإضافتها</em> كذلك. يمكن أن يكون هذا مفيدًا بشكل لا يصدق للتبديل السريع لعنصر أو مجموعة من العناصر ، لعنصر آخر. على سبيل المثال ، لنفترض أنك تخزن نظام ألوان لمجموعة من عناصر DOM في مصفوفة ، وتريد تغيير لون بشكل ديناميكي بناءً على إجراء ما: <blockquote style=";text-align:right;direction:rtl"> function colorChange (arr، index، newColor) { <br> arr.splice (index، 1، newColor)؛ <br> عودة arr؛ <br> } <br><br> let colorScheme = ['# 878787'، '# a08794'، '# bb7e8c'، '# c9b6be'، '# d1becf']؛ <br><br> colorScheme = colorChange (colorScheme، 2، '# 332327')؛ <br> // أزلنا '# bb7e8c' وأضفنا '# 332327' في مكانها <br> // colorScheme now equalals '' # 878787 '،' # a08794 '،' # 332327 '،' # c9b6be '،' # d1becf '] </blockquote> تأخذ هذه الدالة صفيفًا من القيم السداسية ، وهو فهرس يتم عنده إزالة عنصر ، واللون الجديد لاستبدال العنصر المُزال به. قيمة الإرجاع هي صفيف يحتوي على نظام ألوان تم تعديله حديثًا! في حين أن هذا المثال مفرط في التبسيط ، يمكننا أن نرى القيمة التي يمكن أن تستخدم بها <code>splice()</code> إلى أقصى إمكاناتها. </section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> لقد حددنا وظيفة ، <code>htmlColorNames</code> ، والتي تأخذ مصفوفة من ألوان HTML كوسيطة. قم بتعديل الوظيفة باستخدام <code>splice()</code> لإزالة العنصرين الأولين من الصفيف وأضف <code>'DarkSalmon'</code> و <code>'BlanchedAlmond'</code> في <code>'DarkSalmon'</code> الخاصة. </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: 'يجب أن <code>htmlColorNames</code> <code>["DarkSalmon", "BlanchedAlmond", "LavenderBlush", "PaleTurqoise", "FireBrick"]</code>'
|
||||
testString: 'assert.deepEqual(htmlColorNames(["DarkGoldenRod", "WhiteSmoke", "LavenderBlush", "PaleTurqoise", "FireBrick"]), ["DarkSalmon", "BlanchedAlmond", "LavenderBlush", "PaleTurqoise", "FireBrick"], "<code>htmlColorNames</code> should return <code>["DarkSalmon", "BlanchedAlmond", "LavenderBlush", "PaleTurqoise", "FireBrick"]</code>");'
|
||||
- text: يجب أن تستخدم الدالة <code>htmlColorNames</code> الأسلوب <code>splice()</code>
|
||||
testString: 'assert(/.splice/.test(code), "The <code>htmlColorNames</code> function should utilize the <code>splice()</code> method");'
|
||||
- text: يجب عدم استخدام <code>shift()</code> أو <code>unshift()</code> .
|
||||
testString: 'assert(!/shift|unshift/.test(code), "You should not use <code>shift()</code> or <code>unshift()</code>.");'
|
||||
- text: يجب عدم استخدام تدوين قوس الصفيف.
|
||||
testString: 'assert(!/\[\d\]\s*=/.test(code), "You should not use array bracket notation.");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
function htmlColorNames(arr) {
|
||||
// change code below this line
|
||||
|
||||
// change code above this line
|
||||
return arr;
|
||||
}
|
||||
|
||||
// do not change code below this line
|
||||
console.log(htmlColorNames(['DarkGoldenRod', 'WhiteSmoke', 'LavenderBlush', 'PaleTurqoise', 'FireBrick']));
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,67 @@
|
||||
---
|
||||
id: 587d7b7c367417b2b2512b18
|
||||
title: Add Key-Value Pairs to JavaScript Objects
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: إضافة أزواج Key-Value إلى كائنات JavaScript
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> في أبسط صورها ، تكون الكائنات مجرد مجموعات من <dfn>أزواج القيمة الرئيسية</dfn> ، أو بعبارة أخرى ، أجزاء من البيانات تم تعيينها لمعرفات فريدة نسميها <dfn>خصائص</dfn> أو <dfn>مفاتيح</dfn> . دعونا نلقي نظرة على مثال بسيط جدا: <blockquote style=";text-align:right;direction:rtl"> اترك FCC_User = { <br> اسم المستخدم: "awesome_coder" ، <br> المتابعون: 572 ، <br> النقاط: 1741 ، <br> completedProjects: 15 <br> }؛ </blockquote> يعرّف الرمز أعلاه كائن يسمى <code>FCC_User</code> يحتوي على أربعة <dfn>خصائص</dfn> ، كل منها تعيين إلى قيمة محددة. إذا أردنا معرفة عدد <code>followers</code> <code>FCC_User</code> ، فيمكننا الوصول إلى ذلك الموقع بكتابة: <blockquote style=";text-align:right;direction:rtl"> السماح userData = FCC_User.followers؛ <br> // userData يساوي 572 </blockquote> هذا ما يسمى <dfn>dot notation</dfn> . بدلاً من ذلك ، يمكننا أيضًا الوصول إلى مكان الإقامة باستخدام الأقواس ، مثل: <blockquote style=";text-align:right;direction:rtl"> السماح لـ userData = FCC_User ['المتابعين'] <br> // userData يساوي 572 </blockquote> لاحظ أنه مع <dfn>تدوين قوس</dfn> ، أرفقنا <code>followers</code> في علامات اقتباس. هذا لأن الأقواس تسمح لنا بالفعل بتمرير متغير ليتم تقييمه كاسم خاصية (تلميح: ضع ذلك في الاعتبار لاحقًا!). لو مررنا <code>followers</code> بدون علامات الاقتباس ، كان محرك جافا سكريبت قد حاول تقييمه كمتغير ، وكان من <code>ReferenceError: followers is not defined</code> . </section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> باستخدام نفس الصيغة ، يمكننا أيضًا <em><strong>إضافة</strong></em> أزواج قيمة رئيسية <em><strong>جديدة</strong></em> إلى الكائنات. لقد أنشأنا كائن <code>foods</code> مع ثلاثة مداخل. أضف ثلاثة إدخالات إضافية: <code>bananas</code> بقيمة <code>13</code> ، <code>grapes</code> بقيمة <code>35</code> ، <code>strawberries</code> بقيمة <code>27</code> . </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: <code>foods</code> هي كائن
|
||||
testString: 'assert(typeof foods === "object", "<code>foods</code> is an object");'
|
||||
- text: يحتوي جسم <code>foods</code> على <code>"bananas"</code> رئيسي بقيمة <code>13</code>
|
||||
testString: 'assert(foods.bananas === 13, "The <code>foods</code> object has a key <code>"bananas"</code> with a value of <code>13</code>");'
|
||||
- text: يحتوي جسم <code>foods</code> على <code>"grapes"</code> الرئيسي بقيمة <code>35</code>
|
||||
testString: 'assert(foods.grapes === 35, "The <code>foods</code> object has a key <code>"grapes"</code> with a value of <code>35</code>");'
|
||||
- text: يحتوي جسم <code>foods</code> على <code>"strawberries"</code> الرئيسية بقيمة <code>27</code>
|
||||
testString: 'assert(foods.strawberries === 27, "The <code>foods</code> object has a key <code>"strawberries"</code> with a value of <code>27</code>");'
|
||||
- text: يجب تعيين أزواج القيم الأساسية باستخدام تدوين النقطة أو القوس
|
||||
testString: 'assert(code.search(/bananas:/) === -1 && code.search(/grapes:/) === -1 && code.search(/strawberries:/) === -1, "The key-value pairs should be set using dot or bracket notation");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
let foods = {
|
||||
apples: 25,
|
||||
oranges: 32,
|
||||
plums: 28
|
||||
};
|
||||
|
||||
// change code below this line
|
||||
|
||||
// change code above this line
|
||||
|
||||
console.log(foods);
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,64 @@
|
||||
---
|
||||
id: 587d7b7b367417b2b2512b14
|
||||
title: Check For The Presence of an Element With indexOf()
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: التحقق من وجود عنصر مع indexOf ()
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> بما أن الصفائف يمكن تغييرها أو <em>تحورها</em> في أي وقت ، فلا يوجد ضمان حول مكان وجود بيانات معينة في صفيف معين ، أو حتى إذا كان هذا العنصر موجودًا حتى. لحسن الحظ ، توفر لنا جافا سكريبت طريقة أخرى مضمنة ، <code>indexOf()</code> ، تسمح لنا بالتحقق بسرعة وسهولة من وجود عنصر في صفيف. تأخذ <code>indexOf()</code> عنصرًا كمعلمة ، وعندما يتم استدعاؤها ، فإنها ترجع الموضع ، أو الفهرس ، لهذا العنصر ، أو <code>-1</code> إذا كان العنصر غير موجود في الصفيف. فمثلا: <blockquote style=";text-align:right;direction:rtl"> السماح للفواكه = [التفاح ، 'الكمثرى' ، 'البرتقال' ، 'الخوخ' ، 'الكمثرى'] ؛ <br><br> fruits.indexOf ("التواريخ") // returns -1 <br> fruit.indexOf ('oranges') // تُرجع 2 <br> fruits.indexOf ('pears') // تُرجع 1 ، أول مؤشر موجود فيه العنصر </blockquote></section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> يمكن أن يكون <code>indexOf()</code> مفيدا بشكل لا يصدق للتحقق بسرعة من وجود عنصر في صفيف. لقد حددنا وظيفة ، <code>quickCheck</code> ، والتي تأخذ مصفوفة وعنصر <code>quickCheck</code> . تعديل الدالة باستخدام <code>indexOf()</code> بحيث تقوم بإرجاع <code>true</code> إذا كان العنصر الذي تم تمريره موجودًا على الصفيف ، و <code>false</code> إذا لم يكن موجودًا. </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: '<code>quickCheck(["squash", "onions", "shallots"], "mushrooms")</code> يجب أن تعود <code>false</code>'
|
||||
testString: 'assert.strictEqual(quickCheck(["squash", "onions", "shallots"], "mushrooms"), false, "<code>quickCheck(["squash", "onions", "shallots"], "mushrooms")</code> should return <code>false</code>");'
|
||||
- text: '<code>quickCheck(["squash", "onions", "shallots"], "onions")</code> يجب أن تعود <code>true</code>'
|
||||
testString: 'assert.strictEqual(quickCheck(["squash", "onions", "shallots"], "onions"), true, "<code>quickCheck(["squash", "onions", "shallots"], "onions")</code> should return <code>true</code>");'
|
||||
- text: '<code>quickCheck([3, 5, 9, 125, 45, 2], 125)</code> يجب أن <code>quickCheck([3, 5, 9, 125, 45, 2], 125)</code> <code>true</code>'
|
||||
testString: 'assert.strictEqual(quickCheck([3, 5, 9, 125, 45, 2], 125), true, "<code>quickCheck([3, 5, 9, 125, 45, 2], 125)</code> should return <code>true</code>");'
|
||||
- text: '<code>quickCheck([true, false, false], undefined)</code> <code>false</code>'
|
||||
testString: 'assert.strictEqual(quickCheck([true, false, false], undefined), false, "<code>quickCheck([true, false, false], undefined)</code> should return <code>false</code>");'
|
||||
- text: يجب أن تستخدم الدالة <code>quickCheck</code> الأسلوب <code>indexOf()</code>
|
||||
testString: 'assert.notStrictEqual(quickCheck.toString().search(/\.indexOf\(/), -1, "The <code>quickCheck</code> function should utilize the <code>indexOf()</code> method");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
function quickCheck(arr, elem) {
|
||||
// change code below this line
|
||||
|
||||
// change code above this line
|
||||
}
|
||||
|
||||
// change code here to test different cases:
|
||||
console.log(quickCheck(['squash', 'onions', 'shallots'], 'mushrooms'));
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,78 @@
|
||||
---
|
||||
id: 587d7b7d367417b2b2512b1c
|
||||
title: Check if an Object has a Property
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: تحقق مما إذا كان الكائن يحتوي على خاصية
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> الآن يمكننا إضافة وتعديل وإزالة المفاتيح من الكائنات. ولكن ماذا لو أردنا فقط معرفة ما إذا كان الكائن له خاصية معينة؟ تقدم لنا JavaScript طريقتين مختلفتين للقيام بذلك. واحد يستخدم <code>hasOwnProperty()</code> طريقة والآخر يستخدم <code>in</code> الكلمة. إذا كان لدينا <code>users</code> كائنات <code>users</code> خاصية <code>Alan</code> ، فيمكننا التحقق من وجودها بأي من الطرق التالية: <blockquote style=";text-align:right;direction:rtl"> users.hasOwnProperty (علان ')؛ <br> "آلان" في المستخدمين ؛ <br> // كلاهما يعود صحيح </blockquote></section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> لقد أنشأنا كائنًا ، <code>users</code> ، ومع بعض المستخدمين فيه ، ووظيفة هي <code>isEveryoneHere</code> ، والتي <code>isEveryoneHere</code> <code>users</code> ككائن. الانتهاء من كتابة هذه الوظيفة بحيث تقوم بإرجاع <code>true</code> إلا إذا كان <code>users</code> يعترض يحتوي على جميع الأسماء الأربعة، <code>Alan</code> ، <code>Jeff</code> ، <code>Sarah</code> ، و <code>Ryan</code> ، ومفاتيح، و <code>false</code> خلاف ذلك. </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: يحتوي كائن <code>users</code> فقط على مفاتيح <code>Alan</code> و <code>Jeff</code> و <code>Sarah</code> و <code>Ryan</code>
|
||||
testString: 'assert("Alan" in users && "Jeff" in users && "Sarah" in users && "Ryan" in users && Object.keys(users).length === 4, "The <code>users</code> object only contains the keys <code>Alan</code>, <code>Jeff</code>, <code>Sarah</code>, and <code>Ryan</code>");'
|
||||
- text: الدالة <code>isEveryoneHere</code> بإرجاع <code>true</code> إذا كان <code>Alan</code> و <code>Jeff</code> و <code>Sarah</code> و <code>Ryan</code> هي خصائص على كائن <code>users</code>
|
||||
testString: 'assert(isEveryoneHere(users) === true, "The function <code>isEveryoneHere</code> returns <code>true</code> if <code>Alan</code>, <code>Jeff</code>, <code>Sarah</code>, and <code>Ryan</code> are properties on the <code>users</code> object");'
|
||||
- text: الدالة <code>isEveryoneHere</code> بإرجاع <code>false</code> إذا كان <code>Alan</code> و <code>Jeff</code> و <code>Sarah</code> و <code>Ryan</code> ليست خصائص على كائن <code>users</code>
|
||||
testString: 'assert((function() { delete users.Alan; delete users.Jeff; delete users.Sarah; delete users.Ryan; return isEveryoneHere(users) })() === false, "The function <code>isEveryoneHere</code> returns <code>false</code> if <code>Alan</code>, <code>Jeff</code>, <code>Sarah</code>, and <code>Ryan</code> are not properties on the <code>users</code> object");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
let users = {
|
||||
Alan: {
|
||||
age: 27,
|
||||
online: true
|
||||
},
|
||||
Jeff: {
|
||||
age: 32,
|
||||
online: true
|
||||
},
|
||||
Sarah: {
|
||||
age: 48,
|
||||
online: true
|
||||
},
|
||||
Ryan: {
|
||||
age: 19,
|
||||
online: true
|
||||
}
|
||||
};
|
||||
|
||||
function isEveryoneHere(obj) {
|
||||
// change code below this line
|
||||
|
||||
// change code above this line
|
||||
}
|
||||
|
||||
console.log(isEveryoneHere(users));
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,58 @@
|
||||
---
|
||||
id: 587d7b7b367417b2b2512b17
|
||||
title: Combine Arrays with the Spread Operator
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: الجمع بين المصفوفات مع المشغل انتشار
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> ميزة أخرى ضخمة لمشغل <dfn>الانتشار</dfn> ، هي القدرة على الجمع بين المصفوفات ، أو لإدراج جميع عناصر صفيف في آخر ، في أي مؤشر. باستخدام صيغ تركيبية أكثر تقليدية ، يمكننا تجميع صفائف ، لكن هذا يسمح لنا فقط بدمج المصفوفات في نهاية واحد ، وفي بداية أخرى. بناء الجملة Spread يجعل العملية التالية بسيطة للغاية: <blockquote style=";text-align:right;direction:rtl"> دع هذا aarray = ['sage'، 'rosemary'، 'parsley'، 'thyme']؛ <br><br> اترك ذلكالرائحة = ['basil' ، 'cilantro' ، ... thisArray ، 'الكزبرة'] ؛ <br> / / أن الآن يساوي [basil] ، 'cilantro' ، 'sage' ، 'rosemary' ، 'parsley' ، 'thyme' ، 'coriander'] </blockquote> باستخدام صيغة الانتشار ، حققنا للتو عملية من شأنها أن تكون أكثر تعقيدا وأكثر استعراضا لو استخدمنا الطرق التقليدية. </section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> لقد قمنا بتعريف دالة <code>spreadOut</code> التي تقوم بارجاع <code>sentence</code> المتغيرة ، قم بتعديل الوظيفة باستخدام معامل <dfn>الانتشار</dfn> بحيث يقوم بإرجاع الصفيف <code>['learning', 'to', 'code', 'is', 'fun']</code> . </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: '<code>spreadOut</code> يجب أن تعود <code>["learning", "to", "code", "is", "fun"]</code>'
|
||||
testString: 'assert.deepEqual(spreadOut(), ["learning", "to", "code", "is", "fun"], "<code>spreadOut</code> should return <code>["learning", "to", "code", "is", "fun"]</code>");'
|
||||
- text: يجب أن تستخدم دالة <code>spreadOut</code> بنية الانتشار
|
||||
testString: 'assert.notStrictEqual(spreadOut.toString().search(/[...]/), -1, "The <code>spreadOut</code> function should utilize spread syntax");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
function spreadOut() {
|
||||
let fragment = ['to', 'code'];
|
||||
let sentence; // change this line
|
||||
return sentence;
|
||||
}
|
||||
|
||||
// do not change code below this line
|
||||
console.log(spreadOut());
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,69 @@
|
||||
---
|
||||
id: 587d7b7b367417b2b2512b13
|
||||
title: Copy an Array with the Spread Operator
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: نسخ صفيف مع المشغل انتشار
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> بينما تسمح لنا <code>slice()</code> بأن نكون انتقائيين حول عناصر المصفوفة المراد نسخها ، من بين العديد من المهام المفيدة الأخرى ، يتيح لنا <dfn>مشغل</dfn> التوزيع الجديد لـ ES6 نسخ <em>جميع</em> عناصر الصفيف بسهولة ، بالترتيب ، مع بناء بسيط وقابل للقراءة للغاية. تبدو صيغة الانتشار بهذا الشكل: <code>...</code> الناحية العملية ، يمكننا استخدام عامل الانتشار لنسخ مصفوفة مثل: <blockquote style=";text-align:right;direction:rtl"> السماح لهذاالصورة = [true، true، undefined، false، null]؛ <br> السماح أن AArray = [... thisArray]؛ <br> // thatArray يساوي [true ، true ، غير محدد ، false ، فارغ] <br> / / هذا لا يزال يظل بدون تغيير ، وهو مطابق لذلك </blockquote></section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> قمنا بتعريف وظيفة ، <code>copyMachine</code> والتي تأخذ <code>arr</code> (صفيف) و <code>num</code> (a number) كوسيطة. من المفترض أن تقوم الدالة بإرجاع صفيف جديد يتكون من نسخ <code>num</code> من <code>arr</code> . لقد قمنا بمعظم العمل لك ، لكنه لا يعمل بشكل صحيح بعد. قم بتعديل الوظيفة باستخدام صيغة الانتشار بحيث تعمل بشكل صحيح (تلميح: قد تكون طريقة أخرى قمنا بتغطيتها بالفعل مفيدة هنا!). </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: '<code>copyMachine([true, false, true], 2)</code> <code>[[true, false, true], [true, false, true]]</code>'
|
||||
testString: 'assert.deepEqual(copyMachine([true, false, true], 2), [[true, false, true], [true, false, true]], "<code>copyMachine([true, false, true], 2)</code> should return <code>[[true, false, true], [true, false, true]]</code>");'
|
||||
- text: '<code>copyMachine([1, 2, 3], 5)</code> <code>[[1, 2, 3], [1, 2, 3], [1, 2, 3], [1, 2, 3], [1, 2, 3]]</code>'
|
||||
testString: 'assert.deepEqual(copyMachine([1, 2, 3], 5), [[1, 2, 3], [1, 2, 3], [1, 2, 3], [1, 2, 3], [1, 2, 3]], "<code>copyMachine([1, 2, 3], 5)</code> should return <code>[[1, 2, 3], [1, 2, 3], [1, 2, 3], [1, 2, 3], [1, 2, 3]]</code>");'
|
||||
- text: '<code>copyMachine([true, true, null], 1)</code> يجب أن يعيد <code>[[true, true, null]]</code>'
|
||||
testString: 'assert.deepEqual(copyMachine([true, true, null], 1), [[true, true, null]], "<code>copyMachine([true, true, null], 1)</code> should return <code>[[true, true, null]]</code>");'
|
||||
- text: '<code>copyMachine(["it works"], 3)</code> <code>[["it works"], ["it works"], ["it works"]]</code>'
|
||||
testString: 'assert.deepEqual(copyMachine(["it works"], 3), [["it works"], ["it works"], ["it works"]], "<code>copyMachine(["it works"], 3)</code> should return <code>[["it works"], ["it works"], ["it works"]]</code>");'
|
||||
- text: و <code>copyMachine</code> وظيفة يجب الاستفادة من <code>spread operator</code> مع مجموعة <code>arr</code>
|
||||
testString: 'assert.notStrictEqual(copyMachine.toString().indexOf(".concat(_toConsumableArray(arr))"), -1, "The <code>copyMachine</code> function should utilize the <code>spread operator</code> with array <code>arr</code>");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
function copyMachine(arr, num) {
|
||||
let newArr = [];
|
||||
while (num >= 1) {
|
||||
// change code below this line
|
||||
|
||||
// change code above this line
|
||||
num--;
|
||||
}
|
||||
return newArr;
|
||||
}
|
||||
|
||||
// change code here to test different cases:
|
||||
console.log(copyMachine([true, false, true], 2));
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,58 @@
|
||||
---
|
||||
id: 587d7b7a367417b2b2512b12
|
||||
title: Copy Array Items Using slice()
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: نسخ صفيف العناصر باستخدام شريحة ()
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> الطريقة التالية التي سنقوم بتغطيتها هي <code>slice()</code> . <code>slice()</code> ، بدلاً من تعديل صفيف أو نسخ أو <em>مقتطفات</em> ، عدد معين من العناصر إلى صفيف جديد ، تاركاً المصفوفة يتم استدعاؤها دون مساس. تأخذ <code>slice()</code> معلمتين فقط - الأولى هي المؤشر الذي يبدأ عنده الاستخراج ، والثاني هو المؤشر الذي يتم عنده إيقاف الاستخراج (يحدث الاستخراج حتى ، ولكن ليس بما في ذلك العنصر في هذا المؤشر). النظر في هذا: <blockquote style=";text-align:right;direction:rtl"> السماح للظروف الجوية = ['المطر' ، 'الثلج' ، 'المتجمدة' ، 'البرد' ، 'واضح'] ؛ <br><br> السماح todaysWeather = weatherConditions.slice (1 ، 3) ؛ <br> // todaysWeather يساوي ['snow'، 'sleet']؛ <br> // weatherConditions لا يزال يساوي ['المطر' ، 'الثلج' ، 'المتجمدة' ، 'البرد' ، 'واضح'] <br></blockquote> في الواقع ، قمنا بإنشاء مصفوفة جديدة عن طريق استخراج عناصر من صفيف موجود. </section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> لقد حددنا دالة ، <code>forecast</code> ، تأخذ صفيفًا كحجة. قم بتعديل الوظيفة باستخدام <code>slice()</code> لاستخراج المعلومات من صفيف الوسيطة وإرجاع صفيف جديد يحتوي على عناصر <code>'warm'</code> و <code>'sunny'</code> . </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: 'يجب أن تعود <code>forecast</code> <code>["warm", "sunny"]</code>'
|
||||
testString: 'assert.deepEqual(forecast(["cold", "rainy", "warm", "sunny", "cool", "thunderstorms"]), ["warm", "sunny"], "<code>forecast</code> should return <code>["warm", "sunny"]");'
|
||||
- text: يجب أن تستخدم وظيفة <code>forecast</code> طريقة <code>slice()</code>
|
||||
testString: 'assert(/\.slice\(/.test(code), "The <code>forecast</code> function should utilize the <code>slice()</code> method");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
function forecast(arr) {
|
||||
// change code below this line
|
||||
|
||||
return arr;
|
||||
}
|
||||
|
||||
// do not change code below this line
|
||||
console.log(forecast(['cold', 'rainy', 'warm', 'sunny', 'cool', 'thunderstorms']));
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,65 @@
|
||||
---
|
||||
id: 587d7b7b367417b2b2512b16
|
||||
title: Create complex multi-dimensional arrays
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: إنشاء صفائف معقدة متعددة الأبعاد
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> رائع! لقد تعلمت للتو عن طن عن المصفوفات! كانت هذه نظرة عامة على مستوى عالٍ إلى حدٍ ما ، وهناك الكثير الذي يجب معرفته حول العمل مع المصفوفات ، والتي سترى الكثير منها في الأقسام التالية. ولكن قبل الانتقال إلى النظر إلى <dfn>الكائنات</dfn> ، دعنا نلقي نظرة أخرى ، ونرى كيف يمكن أن تصبح المصفوفات أكثر تعقيدًا من ما رأيناه في التحديات السابقة. واحدة من أقوى الميزات عند التفكير في المصفوفات كهيكل البيانات ، هي أن المصفوفات يمكن أن تحتوي ، أو حتى تتكون بالكامل من صفائف أخرى. لقد رأينا صفائف تحتوي على مصفوفات في تحديات سابقة ، ولكنها بسيطة نوعًا ما. ومع ذلك ، يمكن أن تحتوي المصفوفات على عمق لا نهائي من المصفوفات التي يمكن أن تحتوي على صفائف أخرى ، كل منها بمستوياتها الاعتباطية الخاصة بها ، وهكذا. وبهذه الطريقة ، يمكن أن تصبح المصفوفة بسرعة كبيرة جدًا بنية بيانات معقدة ، تُعرف باسم مصفوفة <dfn>متعددة الأبعاد</dfn> أو متداخلة. خذ بعين الاعتبار المثال التالي: <blockquote style=";text-align:right;direction:rtl"> اترك nestedArray = [// top، or first level - the external most array] <br> ['عميق'] ، // مصفوفة داخل صفيف ، مستويين من العمق <br> [ <br> ['أعمق'] ، ['أعمق'] // / 2 صفيف متداخلة 3 مستويات عميقة <br> ]، <br> [ <br> [ <br> ['أعمق'] ، [أعمق]] / / 2 صفيف متداخلة 4 مستويات عميقة <br> ]، <br> [ <br> [ <br> ['deepest-est؟'] // مجموعة متداخلة 5 مستويات عميقة <br> ] <br> ] <br> ] <br> ]. </blockquote> على الرغم من أن هذا المثال قد يبدو معقدًا ، إلا أن هذا المستوى من التعقيد لم يسمع به ، أو حتى غير معتاد ، عند التعامل مع كميات كبيرة من البيانات. ومع ذلك ، لا يزال بإمكاننا الوصول بسهولة إلى أعمق مستويات صفيف هذا المركب مع تدوين قوس: <blockquote style=";text-align:right;direction:rtl"> console.log (nestedArray [2] [1] [0] [0] [0])؛ <br> // logs: deepest-est؟ </blockquote> والآن بعد أن علمنا بمكان هذه البيانات ، يمكننا إعادة تعيينها إذا كنا بحاجة إلى: <blockquote style=";text-align:right;direction:rtl"> nestedArray [2] [1] [0] [0] [0] = 'deep still'؛ <br><br> console.log (nestedArray [2] [1] [0] [0] [0])؛ <br> // الآن سجلات: أعمق لا يزال </blockquote></section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> لقد حددنا متغيرًا ، <code>myNestedArray</code> ، متساوياً مع صفيف. تعديل <code>myNestedArray</code> ، وذلك باستخدام أي مجموعة من <dfn>السلاسل</dfn> <dfn>والأرقام</dfn> <dfn>والقيم المنطقية</dfn> لعناصر البيانات، بحيث انها بالضبط خمسة مستويات من العمق (تذكر، ومجموعة الخارجي، أكثر من غيره هو مستوى 1). في مكان ما في المستوى الثالث ، تتضمن السلسلة <code>'deep'</code> ، في المستوى الرابع ، وتشمل السلسلة <code>'deeper'</code> ، وعلى المستوى الخامس ، تتضمن السلسلة <code>'deepest'</code> . </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: يجب أن تحتوي <code>myNestedArray</code> على أرقام فقط ، وحدات منطقية ، وسلاسل مثل عناصر البيانات
|
||||
testString: 'assert.strictEqual((function(arr) { let flattened = (function flatten(arr) { const flat = [].concat(...arr); return flat.some (Array.isArray) ? flatten(flat) : flat; })(arr); for (let i = 0; i < flattened.length; i++) { if ( typeof flattened[i] !== "number" && typeof flattened[i] !== "string" && typeof flattened[i] !== "boolean") { return false } } return true })(myNestedArray), true, "<code>myNestedArray</code> should contain only numbers, booleans, and strings as data elements");'
|
||||
- text: يجب أن يكون <code>myNestedArray</code> 5 مستويات عمق
|
||||
testString: 'assert.strictEqual((function(arr) {let depth = 0;function arrayDepth(array, i, d) { if (Array.isArray(array[i])) { arrayDepth(array[i], 0, d + 1);} else { depth = (d > depth) ? d : depth;}if (i < array.length) { arrayDepth(array, i + 1, d);} }arrayDepth(arr, 0, 0);return depth;})(myNestedArray), 4, "<code>myNestedArray</code> should have exactly 5 levels of depth");'
|
||||
- text: يجب أن يحتوي <code>myNestedArray</code> على تكرار واحد لسلسلة <code>"deep"</code> على صفيف متداخلة من 3 مستويات
|
||||
testString: 'assert((function howDeep(array, target, depth = 0) {return array.reduce((combined, current) => {if (Array.isArray(current)) { return combined.concat(howDeep(current, target, depth + 1));} else if (current === target) { return combined.concat(depth);} else { return combined;}}, []);})(myNestedArray, "deep").length === 1 && (function howDeep(array, target, depth = 0) {return array.reduce((combined, current) => {if (Array.isArray(current)) { return combined.concat(howDeep(current, target, depth + 1));} else if (current === target) { return combined.concat(depth);} else { return combined;}}, []);})(myNestedArray, "deep")[0] === 2, "<code>myNestedArray</code> should contain exactly one occurrence of the string <code>"deep"</code> on an array nested 3 levels deep");'
|
||||
- text: يجب أن يحتوي <code>myNestedArray</code> على تكرار واحد فقط للسلسلة <code>"deeper"</code> على صفيف متداخلة 4 مستويات متداخلة
|
||||
testString: 'assert((function howDeep(array, target, depth = 0) {return array.reduce((combined, current) => {if (Array.isArray(current)) { return combined.concat(howDeep(current, target, depth + 1));} else if (current === target) { return combined.concat(depth);} else { return combined;}}, []);})(myNestedArray, "deeper").length === 1 && (function howDeep(array, target, depth = 0) {return array.reduce((combined, current) => {if (Array.isArray(current)) { return combined.concat(howDeep(current, target, depth + 1));} else if (current === target) { return combined.concat(depth);} else { return combined;}}, []);})(myNestedArray, "deeper")[0] === 3, "<code>myNestedArray</code> should contain exactly one occurrence of the string <code>"deeper"</code> on an array nested 4 levels deep");'
|
||||
- text: يجب أن يحتوي <code>myNestedArray</code> على تكرار واحد لسلسلة <code>"deepest"</code> على مجموعة متداخلة من 5 مستويات متداخلة
|
||||
testString: 'assert((function howDeep(array, target, depth = 0) {return array.reduce((combined, current) => {if (Array.isArray(current)) { return combined.concat(howDeep(current, target, depth + 1));} else if (current === target) { return combined.concat(depth);} else { return combined;}}, []);})(myNestedArray, "deepest").length === 1 && (function howDeep(array, target, depth = 0) {return array.reduce((combined, current) => {if (Array.isArray(current)) { return combined.concat(howDeep(current, target, depth + 1));} else if (current === target) { return combined.concat(depth);} else { return combined;}}, []);})(myNestedArray, "deepest")[0] === 4, "<code>myNestedArray</code> should contain exactly one occurrence of the string <code>"deepest"</code> on an array nested 5 levels deep");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
let myNestedArray = [
|
||||
// change code below this line
|
||||
['unshift', false, 1, 2, 3, 'complex', 'nested'],
|
||||
['loop', 'shift', 6, 7, 1000, 'method'],
|
||||
['concat', false, true, 'spread', 'array'],
|
||||
['mutate', 1327.98, 'splice', 'slice', 'push'],
|
||||
['iterate', 1.3849, 7, '8.4876', 'arbitrary', 'depth']
|
||||
// change code above this line
|
||||
];
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,76 @@
|
||||
---
|
||||
id: 587d7b7d367417b2b2512b1e
|
||||
title: Generate an Array of All Object Keys with Object.keys()
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: إنشاء صفيف من كافة مفاتيح الكائنات مع Object.keys ()
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> يمكننا أيضًا إنشاء مصفوفة تحتوي على جميع المفاتيح المخزنة في كائن باستخدام طريقة <code>Object.keys()</code> وتمريرها في كائن كوسيطة. سيؤدي هذا إلى إرجاع صفيف يحتوي على سلاسل تمثل كل خاصية في الكائن. مرة أخرى ، لن يكون هناك طلب محدد للإدخالات في الصفيف. </section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> قم <code>getArrayOfUsers</code> كتابة الدالة <code>getArrayOfUsers</code> بحيث تقوم بإرجاع صفيف يحتوي على كافة الخصائص في الكائن يتلقاها كوسيطة. </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: يحتوي كائن <code>users</code> فقط على مفاتيح <code>Alan</code> و <code>Jeff</code> و <code>Sarah</code> و <code>Ryan</code>
|
||||
testString: 'assert("Alan" in users && "Jeff" in users && "Sarah" in users && "Ryan" in users && Object.keys(users).length === 4, "The <code>users</code> object only contains the keys <code>Alan</code>, <code>Jeff</code>, <code>Sarah</code>, and <code>Ryan</code>");'
|
||||
- text: ترجع الدالة <code>getArrayOfUsers</code> صفيف يحتوي على كافة المفاتيح الموجودة في كائن <code>users</code>
|
||||
testString: 'assert((function() { users.Sam = {}; users.Lewis = {}; let R = getArrayOfUsers(users); return (R.indexOf("Alan") !== -1 && R.indexOf("Jeff") !== -1 && R.indexOf("Sarah") !== -1 && R.indexOf("Ryan") !== -1 && R.indexOf("Sam") !== -1 && R.indexOf("Lewis") !== -1); })() === true, "The <code>getArrayOfUsers</code> function returns an array which contains all the keys in the <code>users</code> object");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
let users = {
|
||||
Alan: {
|
||||
age: 27,
|
||||
online: false
|
||||
},
|
||||
Jeff: {
|
||||
age: 32,
|
||||
online: true
|
||||
},
|
||||
Sarah: {
|
||||
age: 48,
|
||||
online: false
|
||||
},
|
||||
Ryan: {
|
||||
age: 19,
|
||||
online: true
|
||||
}
|
||||
};
|
||||
|
||||
function getArrayOfUsers(obj) {
|
||||
// change code below this line
|
||||
|
||||
// change code above this line
|
||||
}
|
||||
|
||||
console.log(getArrayOfUsers(users));
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,66 @@
|
||||
---
|
||||
id: 587d7b7b367417b2b2512b15
|
||||
title: Iterate Through All an Array's Items Using For Loops
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: يتكرر من خلال جميع عناصر المصفوفة عن طريق استخدام الحلقات
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> في بعض الأحيان عند العمل مع المصفوفات ، يكون من السهل جدًا التكرار من خلال كل عنصر للعثور على عنصر واحد أو أكثر قد نحتاجه ، أو التعامل مع صفيف استنادًا إلى عناصر البيانات التي تلبي مجموعة معينة من المعايير. تقدم JavaScript العديد من الطرق المضمنة التي يتم تكرار كل منها على المصفوفات بطرق مختلفة قليلاً لتحقيق نتائج مختلفة (مثل <code>every()</code> ، <code>forEach()</code> ، <code>map()</code> ، إلخ. ، ولكن التقنية الأكثر مرونة وتوفر لنا الأعظم مقدار التحكم هو بسيط <code>for</code> حلقة. خذ بعين الاعتبار ما يلي: <blockquote style=";text-align:right;direction:rtl"> وظيفة greaterThanTen (arr) { <br> let newArr = []؛ <br> لـ (let i = 0؛ i <arr.length؛ i ++) { <br> إذا (arr [i]> 10) { <br> newArr.push (آر [أنا])؛ <br> } <br> } <br> عودة newArr ؛ <br> } <br><br> greaterThanTen ([2، 12، 8، 14، 80، 0، 1])؛ <br> // تُرجع [12 ، 14 ، 80] </blockquote> باستخدام حلقة <code>for</code> ، تتكرر هذه الوظيفة خلال كل عنصر في الصفيف وتصل إليه ، وتضعه في اختبار بسيط قمنا بإنشائه. بهذه الطريقة ، حددنا بسهولة وببرمجية أي من عناصر البيانات أكبر من <code>10</code> ، وأعدنا مصفوفة جديدة تحتوي على تلك العناصر. </section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> لقد حددنا دالة ، <code>filteredArray</code> ، والتي تأخذ <code>arr</code> ، ومصفوفة متداخلة ، و <code>elem</code> ، وتقوم بإرجاع صفيف جديد. يمثل <code>elem</code> عنصرًا قد يكون أو لا يكون موجودًا على واحد أو أكثر من الصفائف المتداخلة ضمن <code>arr</code> . قم بتعديل الوظيفة ، باستخدام حلقة <code>for</code> ، لإرجاع نسخة مفلترة من المصفوفة التي تم تمريرها بحيث يتم إزالة أي صفيف متداخل داخل <code>arr</code> يحتوي على <code>elem</code> . </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: '<code>filteredArray([[10, 8, 3], [14, 6, 23], [3, 18, 6]], 18)</code> يجب أن يعود <code>[ [10, 8, 3], [14, 6, 23] ]</code>'
|
||||
testString: 'assert.deepEqual(filteredArray([ [10, 8, 3], [14, 6, 23], [3, 18, 6] ], 18), [[10, 8, 3], [14, 6, 23]], "<code>filteredArray([[10, 8, 3], [14, 6, 23], [3, 18, 6]], 18)</code> should return <code>[ [10, 8, 3], [14, 6, 23] ]</code>");'
|
||||
- text: '<code>filteredArray([ ["trumpets", 2], ["flutes", 4], ["saxophones", 2] ], 2)</code> يجب أن تعود <code>[ ["flutes", 4] ]</code>'
|
||||
testString: 'assert.deepEqual(filteredArray([ ["trumpets", 2], ["flutes", 4], ["saxophones", 2] ], 2), [["flutes", 4]], "<code>filteredArray([ ["trumpets", 2], ["flutes", 4], ["saxophones", 2] ], 2)</code> should return <code>[ ["flutes", 4] ]</code>");'
|
||||
- text: 'يجب أن تعود <code>filteredArray([ ["amy", "beth", "sam"], ["dave", "sean", "peter"] ], "peter")</code> <code>[ ["amy", "beth", "sam"] ]</code>'
|
||||
testString: 'assert.deepEqual(filteredArray([["amy", "beth", "sam"], ["dave", "sean", "peter"]], "peter"), [["amy", "beth", "sam"]], "<code>filteredArray([ ["amy", "beth", "sam"], ["dave", "sean", "peter"] ], "peter")</code> should return <code>[ ["amy", "beth", "sam"] ]</code>");'
|
||||
- text: '<code>filteredArray([[3, 2, 3], [1, 6, 3], [3, 13, 26], [19, 3, 9]], 3)</code> يجب أن تعود <code>[ ]</code>'
|
||||
testString: 'assert.deepEqual(filteredArray([[3, 2, 3], [1, 6, 3], [3, 13, 26], [19, 3, 9]], 3), [], "<code>filteredArray([[3, 2, 3], [1, 6, 3], [3, 13, 26], [19, 3, 9]], 3)</code> should return <code>[ ]</code>");'
|
||||
- text: و <code>filteredArray</code> وظيفة يجب أن تستخدم ل <code>for</code> حلقة
|
||||
testString: 'assert.notStrictEqual(filteredArray.toString().search(/for/), -1, "The <code>filteredArray</code> function should utilize a <code>for</code> loop");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
function filteredArray(arr, elem) {
|
||||
let newArr = [];
|
||||
// change code below this line
|
||||
|
||||
// change code above this line
|
||||
return newArr;
|
||||
}
|
||||
|
||||
// change code here to test different cases:
|
||||
console.log(filteredArray([[3, 2, 3], [1, 6, 3], [3, 13, 26], [19, 3, 9]], 3));
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,79 @@
|
||||
---
|
||||
id: 587d7b7d367417b2b2512b1f
|
||||
title: Modify an Array Stored in an Object
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: تعديل صفيف مخزنة في كائن
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> لقد شاهدت الآن جميع العمليات الأساسية لكائنات جافا سكريبت. يمكنك إضافة أو تعديل أو إزالة أزواج قيمة المفتاح ، والتحقق من وجود المفاتيح ، وتكرارها على كافة المفاتيح الموجودة في كائن ما. أثناء متابعة تعلم لغة JavaScript ، سترى تطبيقات أكثر تنوعًا للكائنات. بالإضافة إلى ذلك ، فإن دروس "هياكل البيانات المتقدمة" الاختيارية في وقت لاحق في المنهج تغطي أيضًا كائنات ES6 <dfn>Map</dfn> و <dfn>Set</dfn> ، وكلاهما مشابهان للكائنات العادية ولكن مع توفير بعض الميزات الإضافية. الآن بعد أن تعلمت أساسيات المصفوفات والأشياء ، فأنت مستعد تمامًا للبدء في معالجة مشكلات أكثر تعقيدًا باستخدام JavaScript! </section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> ألق نظرة على الكائن الذي قدمناه في محرر الشفرات. يحتوي كائن <code>user</code> على ثلاثة مفاتيح. يحتوي مفتاح <code>data</code> على خمسة مفاتيح ، يحتوي أحدها على مجموعة من <code>friends</code> . من هذا ، يمكنك أن ترى كيف الأجسام المرنة هي هياكل البيانات. لقد بدأنا في كتابة وظيفة <code>addFriend</code> . قم بإنهاء الكتابة بحيث تأخذ كائن <code>user</code> وتضيف اسم وسيطة <code>friend</code> إلى الصفيف المخزن في <code>user.data.friends</code> وتقوم بإرجاع هذا الصفيف. </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: يحتوي كائن <code>user</code> على <code>name</code> <code>age</code> ومفاتيح <code>data</code>
|
||||
testString: 'assert("name" in user && "age" in user && "data" in user, "The <code>user</code> object has <code>name</code>, <code>age</code>, and <code>data</code> keys");'
|
||||
- text: تقبل وظيفة <code>addFriend</code> كائن <code>user</code> وسلسلة <code>friend</code> كوسيطة وتضيف الصديق إلى مصفوفة <code>friends</code> في كائن <code>user</code>
|
||||
testString: 'assert((function() { let L1 = user.data.friends.length; addFriend(user, "Sean"); let L2 = user.data.friends.length; return (L2 === L1 + 1); })(), "The <code>addFriend</code> function accepts a <code>user</code> object and a <code>friend</code> string as arguments and adds the friend to the array of <code>friends</code> in the <code>user</code> object");'
|
||||
- text: '<code>addFriend(user, "Pete")</code> <code>["Sam", "Kira", "Tomo", "Pete"]</code>'
|
||||
testString: 'assert.deepEqual((function() { delete user.data.friends; user.data.friends = ["Sam", "Kira", "Tomo"]; return addFriend(user, "Pete") })(), ["Sam", "Kira", "Tomo", "Pete"], "<code>addFriend(user, "Pete")</code> should return <code>["Sam", "Kira", "Tomo", "Pete"]</code>");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
let user = {
|
||||
name: 'Kenneth',
|
||||
age: 28,
|
||||
data: {
|
||||
username: 'kennethCodesAllDay',
|
||||
joinDate: 'March 26, 2016',
|
||||
organization: 'freeCodeCamp',
|
||||
friends: [
|
||||
'Sam',
|
||||
'Kira',
|
||||
'Tomo'
|
||||
],
|
||||
location: {
|
||||
city: 'San Francisco',
|
||||
state: 'CA',
|
||||
country: 'USA'
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
function addFriend(userObj, friend) {
|
||||
// change code below this line
|
||||
|
||||
// change code above this line
|
||||
}
|
||||
|
||||
console.log(addFriend(user, 'Pete'));
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,68 @@
|
||||
---
|
||||
id: 587d7b7c367417b2b2512b19
|
||||
title: Modify an Object Nested Within an Object
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: تعديل كائن متداخل داخل كائن
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> الآن دعونا نلقي نظرة على كائن أكثر تعقيدا قليلا. يمكن أن تتداخل خصائص الكائن مع عمق اعتباطي ، ويمكن أن تكون قيمها أي نوع من البيانات التي تدعمها JavaScript ، بما في ذلك المصفوفات وحتى الكائنات الأخرى. خذ بعين الاعتبار ما يلي: <blockquote style=";text-align:right;direction:rtl"> let nestedObject = { <br> id: 28802695164 ، <br> التاريخ: "31 ديسمبر 2016" ، <br> البيانات: { <br> totalUsers: 99 ، <br> على الانترنت: 80 ، <br> الموجودين: { <br> نشط: 67 ، <br> بعيدا: 13 <br> } <br> } <br> }؛ </blockquote> يحتوي <code>nestedObject</code> على ثلاثة مفاتيح فريدة: <code>id</code> ، قيمته عبارة عن رقم <code>date</code> قيمته عبارة عن سلسلة <code>data</code> ، تكون قيمتها عبارة عن كائن يحتوي على كائن آخر متداخل داخله. في حين أن الهياكل يمكن أن تصبح معقدة بسرعة ، إلا أنه لا يزال بإمكاننا استخدام نفس الرموز للوصول إلى المعلومات التي نحتاج إليها. </section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> هنا قمنا بتعريف كائن ، <code>userActivity</code> ، والذي يتضمن كائنًا آخرًا متداخلاً فيه. يمكنك تعديل الخصائص على هذا الكائن المتداخل بنفس الطريقة التي قمت بتعديل الخصائص في التحدي الأخير. قم بتعيين قيمة المفتاح <code>online</code> على <code>45</code> . </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: لدى <code>userActivity</code> <code>id</code> <code>date</code> <code>data</code>
|
||||
testString: 'assert("id" in userActivity && "date" in userActivity && "data" in userActivity, "<code>userActivity</code> has <code>id</code>, <code>date</code> and <code>data</code> properties");'
|
||||
- text: لدى <code>userActivity</code> مفتاح <code>data</code> ضبطه على كائن به مفاتيح <code>totalUsers</code> وعبر <code>online</code>
|
||||
testString: 'assert("totalUsers" in userActivity.data && "online" in userActivity.data, "<code>userActivity</code> has a <code>data</code> key set to an object with keys <code>totalUsers</code> and <code>online</code>");'
|
||||
- text: يجب تعيين الخاصية <code>online</code> المتداخلة في مفتاح <code>data</code> <code>userActivity</code> على <code>45</code>
|
||||
testString: 'assert(userActivity.data.online === 45, "The <code>online</code> property nested in the <code>data</code> key of <code>userActivity</code> should be set to <code>45</code>");'
|
||||
- text: يتم تعيين الخاصية <code>online</code> باستخدام تدوين النقطة أو القوس
|
||||
testString: 'assert.strictEqual(code.search(/online: 45/), -1, "The <code>online</code> property is set using dot or bracket notation");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
let userActivity = {
|
||||
id: 23894201352,
|
||||
date: 'January 1, 2017',
|
||||
data: {
|
||||
totalUsers: 51,
|
||||
online: 42
|
||||
}
|
||||
};
|
||||
|
||||
// change code below this line
|
||||
|
||||
// change code above this line
|
||||
|
||||
console.log(userActivity);
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,60 @@
|
||||
---
|
||||
id: 587d78b2367417b2b2512b0f
|
||||
title: Remove Items from an Array with pop() and shift()
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: إزالة العناصر من صفيف مع pop () و shift ()
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> كل من <code>push()</code> و <code>unshift()</code> لهما <code>unshift()</code> : <code>pop()</code> و <code>shift()</code> . كما قد تكون قد خمنت الآن ، بدلاً من إضافة ، <em>يزيل</em> <code>pop()</code> عنصرًا من نهاية صفيف ، بينما يزيل <code>shift()</code> عنصرًا من البداية. الاختلاف الرئيسي بين <code>pop()</code> و <code>shift()</code> وأبناء عمومتهم <code>push()</code> و <code>unshift()</code> ، هو أن كلا الأسلوبين لا <code>unshift()</code> معلمات ، وكل منهما يسمح فقط بتعديل مصفوفة بواسطة عنصر واحد في كل مرة. لنلقي نظرة: <blockquote style=";text-align:right;direction:rtl"> اسمحوا تحيات = [ماذا يكون ما يصل؟ ، 'مرحبا' ، 'انظر يا!'] ؛ <br><br> greetings.pop ()؛ <br> // الآن تساوي ['ما الأمر؟' ، 'مرحبا'] <br><br> greetings.shift ()؛ <br> // الآن تساوي ['مرحبا'] </blockquote> يمكننا أيضًا إرجاع قيمة العنصر الذي تمت إزالته باستخدام أي من الطريقتين التاليتين: <blockquote style=";text-align:right;direction:rtl"> دعونا برزت = تحيات. pop () ؛ <br> // إرجاع "مرحبًا" <br> // تحيات الآن تساوي [] </blockquote></section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> لقد حددنا وظيفة ، <code>popShift</code> ، والتي تأخذ مصفوفة كوسيطة وترجع مصفوفة جديدة. قم بتعديل الوظيفة ، باستخدام <code>pop()</code> و <code>shift()</code> ، لإزالة العناصر الأولى والأخيرة لصفيف الوسيطة ، وتعيين العناصر التي تم إزالتها للمتغيرات الخاصة بها ، بحيث يحتوي الصفيف الذي تم إرجاعه على قيمها. </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: '<code>popShift(["challenge", "is", "not", "complete"])</code> يجب أن يعيد <code>["challenge", "complete"]</code>'
|
||||
testString: 'assert.deepEqual(popShift(["challenge", "is", "not", "complete"]), ["challenge", "complete"], "<code>popShift(["challenge", "is", "not", "complete"])</code> should return <code>["challenge", "complete"]</code>");'
|
||||
- text: يجب أن تستخدم وظيفة <code>popShift</code> الأسلوب <code>pop()</code>
|
||||
testString: 'assert.notStrictEqual(popShift.toString().search(/\.pop\(/), -1, "The <code>popShift</code> function should utilize the <code>pop()</code> method");'
|
||||
- text: يجب أن تستخدم وظيفة <code>popShift</code> طريقة <code>shift()</code>
|
||||
testString: 'assert.notStrictEqual(popShift.toString().search(/\.shift\(/), -1, "The <code>popShift</code> function should utilize the <code>shift()</code> method");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
function popShift(arr) {
|
||||
let popped; // change this line
|
||||
let shifted; // change this line
|
||||
return [shifted, popped];
|
||||
}
|
||||
|
||||
// do not change code below this line
|
||||
console.log(popShift(['challenge', 'is', 'not', 'complete']));
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,59 @@
|
||||
---
|
||||
id: 587d78b2367417b2b2512b10
|
||||
title: Remove Items Using splice()
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: إزالة العناصر باستخدام لصق ()
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> حسنًا ، لقد تعلمنا كيفية إزالة عناصر من بداية ونهاية المصفوفات باستخدام <code>shift()</code> و <code>pop()</code> ، ولكن ماذا لو أردنا إزالة عنصر من مكان ما في المنتصف؟ أو إزالة أكثر من عنصر واحد في وقت واحد؟ حسنا ، هذا هو المكان الذي تأتي فيه <code>splice()</code> . يسمح لنا <code>splice()</code> بالقيام بذلك: <strong>إزالة أي عدد من العناصر المتتالية</strong> من أي مكان في صفيف. يمكن أن تأخذ <code>splice()</code> 3 معلمات ، ولكن في الوقت الحالي ، سنركز على أول 2 فقط. <code>splice()</code> من <code>splice()</code> هي أعداد صحيحة تمثل الفهارس ، أو المواضع ، للصفيف الذي يكون <code>splice()</code> دعا. وتذكر أن المصفوفات <em>صفرية المفهرسة</em> ، لذلك للإشارة إلى العنصر الأول من المصفوفة ، سنستخدم <code>0</code> . تمثل المعلمة الأولى <code>splice()</code> الفهرس الموجود في الصفيف الذي تبدأ منه إزالة العناصر ، بينما تشير المعلمة الثانية إلى عدد العناصر المطلوب حذفها. فمثلا: <blockquote style=";text-align:right;direction:rtl"> دعونا صفيف = ['اليوم' ، 'كان' ، 'لا' ، 'هكذا' ، 'عظيم'] ؛ <br><br> array.splice (2، 2)؛ <br> // remove 2 elements starting with the 3rd element <br> // array الآن يساوي ['today'، 'was'، 'great'] </blockquote> <code>splice()</code> بتعديل المصفوفة التي يتم استدعاؤها فقط ، بل يقوم أيضًا بإرجاع صفيف جديد يحتوي على قيمة العناصر التي تمت إزالتها: <blockquote style=";text-align:right;direction:rtl"> دعونا صفيف = ['أنا' ، 'أنا' ، 'شعور' ، 'حقا' ، 'سعيد'] ؛ <br><br> السماح newArray = array.splice (3 ، 2) ؛ <br> // newArray يساوي ['حقا' ، 'سعيد'] </blockquote></section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> لقد قمنا بتعريف دالة ، <code>sumOfTen</code> ، والتي تأخذ مصفوفة كوسيطة وتقوم بإرجاع مجموع عناصر الصفيف. قم بتعديل الوظيفة ، باستخدام <code>splice()</code> ، بحيث تقوم بإرجاع قيمة <code>10</code> . </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: <code>sumOfTen</code> 10
|
||||
testString: 'assert.strictEqual(sumOfTen([2, 5, 1, 5, 2, 1]), 10, "<code>sumOfTen</code> should return 10");'
|
||||
- text: يجب أن تستخدم الدالة <code>sumOfTen</code> الأسلوب <code>splice()</code>
|
||||
testString: 'assert.notStrictEqual(sumOfTen.toString().search(/\.splice\(/), -1, "The <code>sumOfTen</code> function should utilize the <code>splice()</code> method");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
function sumOfTen(arr) {
|
||||
// change code below this line
|
||||
|
||||
// change code above this line
|
||||
return arr.reduce((a, b) => a + b);
|
||||
}
|
||||
|
||||
// do not change code below this line
|
||||
console.log(sumOfTen([2, 5, 1, 5, 2, 1]));
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,57 @@
|
||||
---
|
||||
id: 587d7b7e367417b2b2512b20
|
||||
title: Use an Array to Store a Collection of Data
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: استخدم صفيف لتخزين مجموعة من البيانات
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> أدناه هو مثال عن أبسط تنفيذ بنية بيانات صفيف. وهذا ما يُعرف باسم <dfn>مصفوفة أحادية البُعد</dfn> ، بمعنى أنه يحتوي على مستوى واحد فقط ، أو أنه لا يحتوي على أي صفيفات أخرى متداخلة فيه. لاحظ أنه يحتوي على وحدات <dfn>منطقية</dfn> ، <dfn>وسلاسل</dfn> ، <dfn>وأرقام</dfn> ، من بين أنواع بيانات جافا سكريبت صالحة أخرى: <blockquote style=";text-align:right;direction:rtl"> let simpleArray = ['one'، 2، 'three'، true، false، undefined، null]؛ <br> console.log (simpleArray.length)؛ <br> // سجلات 7 </blockquote> جميع الصفيف لها خاصية طول ، والتي كما هو موضح أعلاه ، يمكن الوصول إليها بسهولة بالغة مع <code>Array.length</code> . يمكن رؤية تنفيذ أكثر تعقيدًا لمصفوفة أدناه. هذا هو المعروف باسم مجموعة <dfn>متعددة الأبعاد</dfn> ، أو صفيف يحتوي على صفائف أخرى. لاحظ أن هذه المصفوفة تحتوي أيضًا على <dfn>كائنات</dfn> JavaScript ، والتي سنبحثها عن كثب في قسمنا التالي ، ولكن في الوقت الحالي ، كل ما تحتاج إلى معرفته هو أن المصفوفات قادرة أيضًا على تخزين الكائنات المعقدة. <blockquote style=";text-align:right;direction:rtl"> اترك complexArray = [ <br> [ <br> { <br> واحد 1، <br> اثنان: 2 <br> }، <br> { <br> 3: 3 ، <br> أربعة: 4 <br> } <br> ]، <br> [ <br> { <br> a: "a" ، <br> ب: "ب" <br> }، <br> { <br> ج: "ج" ، <br> د: "د" <br> } <br> ] <br> ]. </blockquote></section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> لقد حددنا متغيرًا يسمى <code>yourArray</code> . أكمل العبارة عن طريق تعيين صفيف مكون من خمسة عناصر على <code>yourArray</code> للمتغير <code>yourArray</code> . يجب أن يحتوي الصفيف الخاص بك على <dfn>سلسلة</dfn> واحدة على الأقل <dfn>ورقم</dfn> واحد <dfn>وقيمة منطقية</dfn> واحدة. </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: yourArray هو مجموعة
|
||||
testString: 'assert.strictEqual(Array.isArray(yourArray), true, "yourArray is an array");'
|
||||
- text: <code>yourArray</code> ما لا يقل عن 5 عناصر طويلة
|
||||
testString: 'assert.isAtLeast(yourArray.length, 5, "<code>yourArray</code> is at least 5 elements long");'
|
||||
- text: <code>yourArray</code> يحتوي على <code>boolean</code> واحد على الأقل
|
||||
testString: 'assert(yourArray.filter( el => typeof el === "boolean").length >= 1, "<code>yourArray</code> contains at least one <code>boolean</code>");'
|
||||
- text: يحتوي <code>yourArray</code> على <code>number</code> واحد على الأقل
|
||||
testString: 'assert(yourArray.filter( el => typeof el === "number").length >= 1, "<code>yourArray</code> contains at least one <code>number</code>");'
|
||||
- text: يحتوي <code>yourArray</code> على <code>string</code> واحدة على الأقل
|
||||
testString: 'assert(yourArray.filter( el => typeof el === "string").length >= 1, "<code>yourArray</code> contains at least one <code>string</code>");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
let yourArray; // change this line
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
@ -0,0 +1,64 @@
|
||||
---
|
||||
id: 587d7b7c367417b2b2512b1b
|
||||
title: Use the delete Keyword to Remove Object Properties
|
||||
challengeType: 1
|
||||
videoUrl: ''
|
||||
localeTitle: استخدم Delete keyword to Remove Object Properties
|
||||
---
|
||||
|
||||
## Description
|
||||
<section id="description"> الآن أنت تعرف ما هي الأشياء وخصائصها ومزاياها الأساسية. باختصار، فهي مخازن المفاتيح ذات قيمة والتي توفر طريقة بديهية مرنة لتنظيم البيانات، <strong><em>و،</em></strong> لأنها توفر الوقت بحث سريع جدا. خلال بقية هذه التحديات ، سنقوم بوصف العديد من العمليات الشائعة التي يمكنك القيام بها على الكائنات بحيث يمكنك أن تصبح مريحًا في تطبيق هذه الهياكل المفيدة للبيانات في برامجك. في التحديات السابقة ، قمنا بإضافة وتعديل أزواج قيمة المفتاح للكائن. سنرى هنا كيف يمكننا <em>إزالة</em> زوج قيمة مفتاح من كائن. دعونا نعيد النظر في مثال كائن <code>foods</code> لدينا للمرة الأخيرة. إذا أردنا إزالة مفتاح <code>apples</code> ، فيمكننا إزالته باستخدام الكلمة الرئيسية التي <code>delete</code> مثل هذا: <blockquote style=";text-align:right;direction:rtl"> حذف foods.apples ؛ </blockquote></section>
|
||||
|
||||
## Instructions
|
||||
<section id="instructions"> استخدم الكلمة الرئيسية حذف لإزالة <code>oranges</code> <code>plums</code> ومفاتيح <code>strawberries</code> من كائن <code>foods</code> . </section>
|
||||
|
||||
## Tests
|
||||
<section id='tests'>
|
||||
|
||||
```yml
|
||||
tests:
|
||||
- text: 'يحتوي جسم <code>foods</code> على ثلاثة مفاتيح فقط: <code>apples</code> <code>grapes</code> <code>bananas</code>'
|
||||
testString: 'assert(!foods.hasOwnProperty("oranges") && !foods.hasOwnProperty("plums") && !foods.hasOwnProperty("strawberries") && Object.keys(foods).length === 3, "The <code>foods</code> object only has three keys: <code>apples</code>, <code>grapes</code>, and <code>bananas</code>");'
|
||||
- text: تتم إزالة مفاتيح <code>oranges</code> <code>plums</code> <code>strawberries</code> باستخدام <code>delete</code>
|
||||
testString: 'assert(code.search(/oranges:/) !== -1 && code.search(/plums:/) !== -1 && code.search(/strawberries:/) !== -1, "The <code>oranges</code>, <code>plums</code>, and <code>strawberries</code> keys are removed using <code>delete</code>");'
|
||||
|
||||
```
|
||||
|
||||
</section>
|
||||
|
||||
## Challenge Seed
|
||||
<section id='challengeSeed'>
|
||||
|
||||
<div id='js-seed'>
|
||||
|
||||
```js
|
||||
let foods = {
|
||||
apples: 25,
|
||||
oranges: 32,
|
||||
plums: 28,
|
||||
bananas: 13,
|
||||
grapes: 35,
|
||||
strawberries: 27
|
||||
};
|
||||
|
||||
// change code below this line
|
||||
|
||||
// change code above this line
|
||||
|
||||
console.log(foods);
|
||||
|
||||
```
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
## Solution
|
||||
<section id='solution'>
|
||||
|
||||
```js
|
||||
// solution required
|
||||
```
|
||||
</section>
|
||||
Reference in New Issue
Block a user