JavaScript/Array/fill

الدالة Array.prototype.fill()‎ تملأ جميع عناصر المصفوفة من فهرس البداية حتى فهرس النهاية بقيمة ثابتة.

var numbers = [1, 2, 3]
numbers.fill(1);

// [1, 1, 1]

البنية العامة

arr.fill(value[, start[, end]])

value

القيمة التي نريد ملء المصفوفة بها.

start

فهرس البداية، وقيمته الافتراضية هي 0.

end

فهرس النهاية، وقيمته الافتراضية هي this.length.

القيمة المعادة

المصفوفة المُعدَّلة.

الوصف

الدالة fill تستطيع أن تقبل ثلاثة وسائط هي value و start و end، الوسيطان start و end هما وسيطان اختياريان يأخذان القيم الافتراضية 0 و length على التوالي وبالترتيب.

إذا كانت قيمة الوسيط start سالبةً فستُعامَل على أنَّها length+start، حيث length هو عدد عناصر المصفوفة، والمثل ينطبق على end إذا كانت سالبةً، إذ ستُعامَل على أنَّها length+end.

الدالة fill هي دالة تحويل، أي أنَّها تُغيّر قيمة الكائن this، وستُعيد القيمة النهاية، ولن تُعيد نسخةً محوّلةً من المصفوفة فحسب.

عند تمرير كائن إلى الدالة fill، فستنسخ الكائن المُمرَّر إليها وتملأ المصفوفة بإشارات مرجعية إلى ذاك الكائن (انظر المثال أدناه لتوضيح هذه الفكرة).

أمثلة

[1, 2, 3].fill(4);               // [4, 4, 4]
[1, 2, 3].fill(4, 1);            // [1, 4, 4]
[1, 2, 3].fill(4, 1, 2);         // [1, 4, 3]
[1, 2, 3].fill(4, 1, 1);         // [1, 2, 3]
[1, 2, 3].fill(4, 3, 3);         // [1, 2, 3]
[1, 2, 3].fill(4, -3, -2);       // [4, 2, 3]
[1, 2, 3].fill(4, NaN, NaN);     // [1, 2, 3]
[1, 2, 3].fill(4, 3, 5);         // [1, 2, 3]
Array(3).fill(4);                // [4, 4, 4]
[].fill.call({ length: 3 }, 4);  // {0: 4, 1: 4, 2: 4, length: 3}

// نسخ المرجعية إلى كائن
var arr = Array(3).fill({}) // [{}, {}, {}];
arr[0].hi = "hi"; // [{ hi: "hi" }, { hi: "hi" }, { hi: "hi" }]

تعويض نقص دعم المتصفحات

الشيفرة الآتية تُعيد تعريف هذه الدالة لكي نستطيع استخدامها في المتصفحات التي لا تدعم معيار ECMAScript 2015 (أي ES6):

if (!Array.prototype.fill) {
  Object.defineProperty(Array.prototype, 'fill', {
    value: function(value) {

      // Steps 1-2.
      if (this == null) {
        throw new TypeError('this is null or not defined');
      }

      var O = Object(this);

      // Steps 3-5.
      var len = O.length >>> 0;

      // Steps 6-7.
      var start = arguments[1];
      var relativeStart = start >> 0;

      // Step 8.
      var k = relativeStart < 0 ?
        Math.max(len + relativeStart, 0) :
        Math.min(relativeStart, len);

      // Steps 9-10.
      var end = arguments[2];
      var relativeEnd = end === undefined ?
        len : end >> 0;

      // Step 11.
      var final = relativeEnd < 0 ?
        Math.max(len + relativeEnd, 0) :
        Math.min(relativeEnd, len);

      // Step 12.
      while (k < final) {
        O[k] = value;
        k++;
      }

      // Step 13.
      return O;
    }
  });
}

دعم المتصفحات

الميزة	Chrome	Firefox	Internet Explorer	Opera	Safari
الدعم الأساسي	45	31	غير مدعومة	نعم	8

على النقيض من متصفح IE، يدعم Edge هذه الميزة.

مصادر ومواصفات

• مسودة المعيار ECMAScript Latest Draft.
• معيار ECMAScript 2015 (6th Edition)‎.