عرض مصدر JavaScript/Function/call

<noinclude>{{DISPLAYTITLE:<code>Function.prototype.call()‎</code>}}</noinclude>
الدالة <code>Function.prototype.call()‎</code> تستدعي دالةً وتضبط قيمة <code>[[JavaScript/this|this]]</code> فيها إلى القيمة المعطية، وستُوفَّر الوسائط التي ستُمرَّر إليها كقائمة.

ملاحظة: صحيحٌ أنَّ البنية العامة لهذه الدالة تكاد تماثل بينة الدالة <code>[[JavaScript/Function/apply|apply()‎]]</code>، لكن الفرق الرئيسي بينهما هو أنَّ الدالة <code>[[JavaScript/Function/apply|apply()‎]]</code> تقبل مصفوفةً واحدةً تحتوي على الوسائط، بينما <code>call()‎</code> تقبل قائمةً بالوسائط التي تُمرَّر إلى الدالة.

== البنية العامة ==
<syntaxhighlight lang="javascript">
function.call([thisArg, arg1, arg2, ...])

</syntaxhighlight>

=== <code>thisArg</code> ===
وسيطٌ اختياري، وهو يُمثِّل قيمة المعامل <code>[[JavaScript/this|this]]</code> التي ستُستعمل في الدالة <code>function</code>، لاحظ أنَّ قيمة <code>[[JavaScript/this|this]]</code> المُمرَّرة لا تعني بالضرورة أنَّها القيمة التي ستستخدمها الدالة؛ فلو لم يكن تنفيذ الدالة في [[JavaScript/Strict Mode|نمط strict]]، فسيُستعاض عن القيمتين <code>[[JavaScript/null|null]]</code> و <code>[[JavaScript/undefined|undefined]]</code> بالكائن العام (global object)، وستُغلَّف القيم الأوليّة بكائنات.

=== <code>arg1, arg2, ...‎</code> ===
الوسائط الاختيارية التي ستُمرَّر إلى المصفوفة.

=== القيمة المعادة ===
القيمة المعادة نتيجة استدعاء الدالة المُحدَّدة مع قيمة <code>[[JavaScript/this|this]]</code> والوسائط (إن وُجِدَت).

== الوصف ==
يمكنك إسناد قيمة <code>[[JavaScript/this|this]]</code> مختلفة عند استدعاء دالة موجودة مسبقًا؛ إذ يُشير المعامل <code>[[JavaScript/this|this]]</code> إلى الكائن الحالي؛ أما عند استخدام <code>call</code>، فيمكننا كتابة دالة مرةً واحدةً ثم استدعاؤها في كائنٍ آخر، دون الحاجة إلى إعادة كتابة تلك الدالة في الكائن الجديد. 

== أمثلة ==

=== اسم الدالة <code>call</code> مع الدوال البانية ===
يمكننا استخدام <code>call</code> لإنشاء سلسلة من الدوال البانية (chain of constructors) لأحد الكائنات بما يشبه لغة Java، ففي المثال الآتي سنُعرِّف دالةً بانيةً للكائن <code>Product</code> مع معاملين هما <code>name</code> و <code>price</code>، وسننشِئ دالتين باسم <code>Food</code> و <code>Type</code> اللتين تستدعيا الدالة <code>Product</code> مع تمرير <code>this</code> و <code>name</code> و <code>price</code>؛ وبالتالي ستُعرِّف الدالة <code>Product</code> الخاصيتين <code>name</code> و <code>price</code> التابعتين لكل كائن، لكن كل دالة تُعرِّف قيمة <code>category</code> خاصة بها:<syntaxhighlight lang="javascript">
function Product(name, price) {
  this.name = name;
  this.price = price;
}

function Food(name, price) {
  Product.call(this, name, price);
  this.category = 'food';
}

function Toy(name, price) {
  Product.call(this, name, price);
  this.category = 'toy';
}

var cheese = new Food('feta', 5);
var fun = new Toy('robot', 40);
</syntaxhighlight>

=== استخدام <code>call</code> لاستدعاء دالة مجهولة ===
سنُنشِئ في المثال الآتي دالةً مجهولةً وسنستخدم <code>call</code> لاستدعائها على كل كائن في مصفوفة، والغرض الرئيسي من الدالة المجهولة هو إضافة دالة طباعة (<code>print</code>) إلى كل كائن، والتي ستكون قادرةً على طباعة الفهرس الصحيح للكائن في المصفوفة؛ لاحظ أنَّ تمرير الكائن كقيمة <code>[[JavaScript/this|this]]</code> لم يكن ضروريًا، لكننا فعلناه لشرح هذه الفكرة:<syntaxhighlight lang="javascript">
var animals = [
  { species: 'Lion', name: 'King' },
  { species: 'Whale', name: 'Fail' }
];

for (var i = 0; i < animals.length; i++) {
  (function(i) {
    this.print = function() {
      console.log('#' + i + ' ' + this.species
                  + ': ' + this.name);
    }
    this.print();
  }).call(animals[i], i);
}

</syntaxhighlight>

=== استخدام <code>call</code> لاستدعاء دالة وتحديد قيمة <code>this</code> فيها ===
<syntaxhighlight lang="javascript">
function greet() {
  var reply = [this.person, 'Is An Awesome', this.role].join(' ');
  console.log(reply);
}

var i = {
  person: 'Douglas Crockford', role: 'Javascript Developer'
};

greet.call(i); // Douglas Crockford Is An Awesome Javascript Developer

</syntaxhighlight>

=== استخدام call لاستدعاء دالة دون تحديد قيمة لأوّل وسيط ===
استدعينا في المثال الآتي الدالة <code>display</code> لكن دون تمرير قيمة للوسيط الأول، فلو لم تُمرَّر قيمة لأوّل وسيط فستُشير <code>[[JavaScript/this|this]]</code> داخل الدالة إلى الكائن العام:<syntaxhighlight lang="javascript">
var sData = 'Wisen';
            
function display(){
    console.log('sData value is %s ', this.sData);
}

display.call(); //sData value is Wisen 
</syntaxhighlight>

== دعم المتصفحات ==
{| class="wikitable"
!الميزة
!|Chrome
!Firefox
!Internet Explorer
!Opera
!Safari
|-
! الدعم الأساسي
|نعم
|نعم
|نعم
|نعم
|نعم
|}
== مصادر ومواصفات ==
*مسودة المعيار [https://tc39.github.io/ecma262/#sec-function.prototype.call ECMAScript Latest Draft].
*معيار [http://www.ecma-international.org/ecma-262/6.0/#sec-function.prototype.call ECMAScript 2015 (6th Edition)]‎.
*معيار [http://www.ecma-international.org/ecma-262/5.1/#sec-15.3.4.4 ECMAScript 5.1].
*معيار [http://www.ecma-international.org/publications/files/ECMA-ST-ARCH/ECMA-262,%201st%20edition,%20June%201997.pdf ECMAScript 1st Edition].
[[تصنيف:JavaScript]]
[[تصنيف:JavaScript Global Objects]]
[[تصنيف:JavaScript Function]]