الفرق بين المراجعتين ل"JavaScript/Array/reduce"
ط (استبدال النص - '\[\[تصنيف:(.*)\]\]' ب'{{SUBPAGENAME}}') |
|||
سطر 304: | سطر 304: | ||
* معيار [https://www.ecma-international.org/ecma-262/6.0/#sec-array.prototype.reduce ECMAScript 2015 (6th Edition)]. | * معيار [https://www.ecma-international.org/ecma-262/6.0/#sec-array.prototype.reduce ECMAScript 2015 (6th Edition)]. | ||
* معيار [https://www.ecma-international.org/ecma-262/5.1/#sec-15.4.4.21 ECMAScript 5.1]. | * معيار [https://www.ecma-international.org/ecma-262/5.1/#sec-15.4.4.21 ECMAScript 5.1]. | ||
− | [[تصنيف:JavaScript]] | + | [[تصنيف:JavaScript|{{SUBPAGENAME}}]] |
− | [[تصنيف:JavaScript Global Objects]] | + | [[تصنيف:JavaScript Global Objects|{{SUBPAGENAME}}]] |
− | [[تصنيف:JavaScript Array]] | + | [[تصنيف:JavaScript Array|{{SUBPAGENAME}}]] |
المراجعة الحالية بتاريخ 15:38، 28 يناير 2018
الدالة Array.prototype.reduce()
تؤدي إلى اختزال جميع قيم المصفوفة (بدءًا من اليسار إلى اليمين) إلى قيمة واحدة.
const array1 = [1, 2, 3, 4];
const reducer = (accumulator, currentValue) => accumulator + currentValue;
// 1 + 2 + 3 + 4
console.log(array1.reduce(reducer)); // 10
// 5 + 1 + 2 + 3 + 4
console.log(array1.reduce(reducer, 5)); // 15
البنية العامة
arr.reduce(callback[, initialValue])
callback
الدالة التي ستختبر كل عنصر من عناصر المصفوفة، وتقبل أربعة وسائط.
accumulator
القيمة التراكمية، انظر النقاش أدناه للتفاصيل.
currentValue
العنصر الحالي الذي يُعالِج في المصفوفة، وهذه القيمة مطلوبة.
currentIndex
فهرس العنصر الحالي في المصفوفة، وهذه القيمة اختيارية.
array
المصفوفة التي استدعيت الدالة reduce
عليها، وهذه القيمة اختيارية.
initialValue
القيمة التي ستُستخدم كوسيط لأوّل استدعاء للدالة callback
، وإن لم توفَّر هذه القيمة فسيستخدم أوّل عنصر في المصفوفة.
القيمة المعادة
القيمة الناتجة من عملية الاختزال.
الوصف
الدالة reduce
تستدعي الدالة callback
مرةً واحدةً لكل عنصر في المصفوفة، باستثناء الفجوات الموجودة في المصفوفة، وهذه الدالة تقبل أربعة وسائط:
accumulator
currentValue
currentIndex
array
في أوّل استدعاء للدالة callback
، تكون accumulator
و currentValue
قيمةً من قيمتين. فإذا وفّرنا قيمةً للوسيط initialValue
عند استدعاء reduce
فستكون accumulator
مساويةً إلى initialValue
، وستكون currentValue
مساويةً إلى أوّل عنصر في المصفوفة؛ أما إذا لم تكن قيمة الوسيط initialValue
موجودةً، فستكون accumulator
مساويةً لأوّل قيمة في المصفوفة، و currentValue
ستساوي القيمة الثانية.
ملاحظة: إذا لم توفَّر قيمة initialValue
فستُنفِّذ الدالةُ reduce
الدالةَ callback
بدءًا من الفهرس 1 وستتجاوز أوّل فهرس، أما إذا كانت القيمة initialValue
موجودةً فستبدأ من الفهرس 0.
إذا كانت المصفوفة فارغة ولم توفَّر قيمة initialValue
، فسيرمى الاستثناء TypeError
، وإذا احتوت المصفوفة على عنصرٍ وحيد (بغض النظر عن موضعه) ولم توفَّر قيمة initialValue
أو كانت القيمة initialValue
موجودةً لكن المصفوفة فارغة، فستُعاد القيمة الوحيدة دون استدعاء الدالة callback
.
من الأفضل توفير قيمة ابتدائية دومًا لأنَّ هنالك ثلاث حالات يمكن أن تحدث إن لم تكن قيمة initialValue
مضبوطةً، كما هو موضَّح في المثال الآتي:
var maxCallback = ( acc, cur ) => Math.max( acc.x, cur.x );
var maxCallback2 = ( max, cur ) => Math.max( max, cur );
// دون قيمة ابتدائية
[ { x: 22 }, { x: 42 } ].reduce( maxCallback ); // 42
[ { x: 22 } ].reduce( maxCallback ); // { x: 22 }
[ ].reduce( maxCallback ); // TypeError
// مع قيمة ابتدائية
[ { x: 22 }, { x: 42 } ].map( el => el.x )
.reduce( maxCallback2, -Infinity );
كيف تعمل الدالة reduce
لنفترض أنَّ لدينا المثال الآتي:
[0, 1, 2, 3, 4].reduce(
function (
accumulator,
currentValue,
currentIndex,
array
) {
return accumulator + currentValue;
}
);
ستُستدعى الدالة callback
أربع مرات، وسنستعرض الوسائط الممررة إليها والقيم التي تعيدها في الجدول الآتي:
callback | accumulator | currentValue | currentIndex | array | القيمة المعادة |
---|---|---|---|---|---|
أوّل استدعاء | 0
|
1
|
1
|
[0, 1, 2, 3, 4]
|
1
|
ثاني استدعاء | 1
|
2
|
2
|
[0, 1, 2, 3, 4]
|
3
|
ثالث استدعاء | 3
|
3
|
3
|
[0, 1, 2, 3, 4]
|
6
|
رابع استدعاء | 6
|
4
|
4
|
[0, 1, 2, 3, 4]
|
10
|
القيمة المعادة من الدالة reduce
هي آخر قيمة مُعادة من الدالة callback
(وهي 10
).
يمكنك أيضًا استخدام الدوال السهمية بدلًا من استخدام دالة كاملة، فالمثال السابق يُنتِج نفس النتيجة السابقة:
[0, 1, 2, 3, 4].reduce( (prev, curr) => prev + curr );
أما إذا وفّرتَ قيمةً ابتدائيةً كوسيطٍ ثانٍ للدالة reduce
، أي أنَّ الشيفرة كالآتية:
[0, 1, 2, 3, 4].reduce(
(accumulator, currentValue, currentIndex, array) => {
return accumulator + currentValue;
},
10
);
والجدول:
callback | accumulator | currentValue | currentIndex | array | القيمة المعادة |
---|---|---|---|---|---|
أوّل استدعاء | 10
|
0
|
0
|
[0, 1, 2, 3, 4]
|
10
|
ثاني استدعاء | 10
|
1
|
1
|
[0, 1, 2, 3, 4]
|
11
|
ثالث استدعاء | 11
|
2
|
2
|
[0, 1, 2, 3, 4]
|
13
|
رابع استدعاء | 16
|
4
|
4
|
[0, 1, 2, 3, 4]
|
20
|
القيمة المعادة من الدالة reduce
في هذه الحالة هي 20.
أمثلة
جمع كل القيم في المصفوفة
var sum = [0, 1, 2, 3].reduce(function (a, b) {
return a + b;
}, 0);
// 6
يمكن كتابة الشيفرة السابقة باستخدام دالة سهمية:
var total = [ 0, 1, 2, 3 ].reduce(
( acc, cur ) => acc + cur,
0
);
تسطيح مصفوفة من المصفوفات
var flattened = [[0, 1], [2, 3], [4, 5]].reduce(
function(a, b) {
return a.concat(b);
},
[]
);
// [0, 1, 2, 3, 4, 5]
يمكن كتابة الشيفرة السابقة باستخدام دالة سهمية:
var flattened = [[0, 1], [2, 3], [4, 5]].reduce(
( acc, cur ) => acc.concat(cur),
[]
);
إحصاء عدد تكرار عناصر المصفوفة
var names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];
var countedNames = names.reduce(function (allNames, name) {
if (name in allNames) {
allNames[name]++;
}
else {
allNames[name] = 1;
}
return allNames;
}, {});
// { 'Alice': 2, 'Bob': 1, 'Tiff': 1, 'Bruce': 1 }
تعويض نقص دعم المتصفحات
أضيفت هذه الدالة في الإصدار الخامس من معيار ECMAScript، لذا يمكنك استخدام الشيفرة الآتية لإضافتها للمتصفحات التي لا تدعمها:
// Production steps of ECMA-262, Edition 5, 15.4.4.21
// Reference: http://es5.github.io/#x15.4.4.21
// https://tc39.github.io/ecma262/#sec-array.prototype.reduce
if (!Array.prototype.reduce) {
Object.defineProperty(Array.prototype, 'reduce', {
value: function(callback /*, initialValue*/) {
if (this === null) {
throw new TypeError( 'Array.prototype.reduce ' +
'called on null or undefined' );
}
if (typeof callback !== 'function') {
throw new TypeError( callback +
' is not a function');
}
// 1. Let O be ? ToObject(this value).
var o = Object(this);
// 2. Let len be ? ToLength(? Get(O, "length")).
var len = o.length >>> 0;
// Steps 3, 4, 5, 6, 7
var k = 0;
var value;
if (arguments.length >= 2) {
value = arguments[1];
} else {
while (k < len && !(k in o)) {
k++;
}
// 3. If len is 0 and initialValue is not present,
// throw a TypeError exception.
if (k >= len) {
throw new TypeError( 'Reduce of empty array ' +
'with no initial value' );
}
value = o[k++];
}
// 8. Repeat, while k < len
while (k < len) {
// a. Let Pk be ! ToString(k).
// b. Let kPresent be ? HasProperty(O, Pk).
// c. If kPresent is true, then
// i. Let kValue be ? Get(O, Pk).
// ii. Let accumulator be ? Call(
// callbackfn, undefined,
// « accumulator, kValue, k, O »).
if (k in o) {
value = callback(value, o[k], k, o);
}
// d. Increase k by 1.
k++;
}
// 9. Return accumulator.
return value;
}
});
}
دعم المتصفحات
الميزة | Chrome | Firefox | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
الدعم الأساسي | نعم | نعم | 9 | نعم | 4 |
مصادر ومواصفات
- مسودة المعيار ECMAScript Latest Draft.
- معيار ECMAScript 2015 (6th Edition).
- معيار ECMAScript 5.1.