freeCodeCamp

4.3 KiB

Raw Blame History

id	title	challengeType	videoUrl	localeTitle
587d78b3367417b2b2512b11	Add Items Using splice()	1		إضافة عناصر باستخدام لصق ()

Description

تذكر في التحدي الأخير ذكرنا أن splice() يمكن أن يستغرق ما يصل إلى ثلاثة معلمات؟ حسنا ، يمكننا أن نذهب خطوة أخرى مع splice() - بالإضافة إلى إزالة العناصر ، يمكننا استخدام هذه المعلمة الثالثة ، والتي تمثل واحد أو أكثر من العناصر ، لإضافتها كذلك. يمكن أن يكون هذا مفيدًا بشكل لا يصدق للتبديل السريع لعنصر أو مجموعة من العناصر ، لعنصر آخر. على سبيل المثال ، لنفترض أنك تخزن نظام ألوان لمجموعة من عناصر DOM في مصفوفة ، وتريد تغيير لون بشكل ديناميكي بناءً على إجراء ما:

function colorChange (arr، index، newColor) {
arr.splice (index، 1، newColor)؛
عودة arr؛
}

let colorScheme = ['# 878787'، '# a08794'، '# bb7e8c'، '# c9b6be'، '# d1becf']؛

colorScheme = colorChange (colorScheme، 2، '# 332327')؛
// أزلنا '# bb7e8c' وأضفنا '# 332327' في مكانها
// colorScheme now equalals '' # 878787 '،' # a08794 '،' # 332327 '،' # c9b6be '،' # d1becf ']

تأخذ هذه الدالة صفيفًا من القيم السداسية ، وهو فهرس يتم عنده إزالة عنصر ، واللون الجديد لاستبدال العنصر المُزال به. قيمة الإرجاع هي صفيف يحتوي على نظام ألوان تم تعديله حديثًا! في حين أن هذا المثال مفرط في التبسيط ، يمكننا أن نرى القيمة التي يمكن أن تستخدم بها splice() إلى أقصى إمكاناتها.

Instructions

لقد حددنا وظيفة ، htmlColorNames ، والتي تأخذ مصفوفة من ألوان HTML كوسيطة. قم بتعديل الوظيفة باستخدام splice() لإزالة العنصرين الأولين من الصفيف وأضف 'DarkSalmon' و 'BlanchedAlmond' في 'DarkSalmon' الخاصة.

Tests

tests:
  - text: 'يجب أن <code>htmlColorNames</code> <code>[&quot;DarkSalmon&quot;, &quot;BlanchedAlmond&quot;, &quot;LavenderBlush&quot;, &quot;PaleTurqoise&quot;, &quot;FireBrick&quot;]</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.");'

Challenge Seed

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']));

Solution

// solution required

4.3 KiB Raw Blame History