الفرق بين المراجعتين لصفحة: «jQuery/deferred/promise»
Khaled-yassin (نقاش | مساهمات) ط ←أمثلة |
ط ←target |
||
(مراجعتان متوسطتان بواسطة مستخدمين اثنين آخرين غير معروضتين) | |||
سطر 14: | سطر 14: | ||
الكائن الذي يجب إرفاق تابع promise به وهو من النوع [[JavaScript/Object|Object]]. | الكائن الذي يجب إرفاق تابع promise به وهو من النوع [[JavaScript/Object|Object]]. | ||
يسمح التابع <code>deferred.promise()</code> لدالة غير متزامنة بمنع الشيفرات البرمجية الأخرى من التدخل في تقدم أو حالة الطلب الداخلي الخاص به. ويعرض التابع <code>promise</code> فقط التوابع المؤجلة اللازمة لإرفاق معالجات إضافية أو تحديد الحالة (<code>then</code> و <code>done</code> و <code>fail</code> و <code>always</code> و <code>pipe</code> و <code>progress</code> و <code>state</code> و <code>promise</code>)، ولكن ليس التوابع التي تغير الحالة (<code>resolve</code> و <code>reject</code> و <code>notify</code> و <code>resolveWith</code> و <code>rejectWith</code> و <code>notifyWith</code>). | يسمح التابع <code>deferred.promise()</code> [[JavaScript/async function|لدالة غير متزامنة]] بمنع الشيفرات البرمجية الأخرى من التدخل في تقدم أو حالة الطلب الداخلي الخاص به. ويعرض التابع <code>promise</code> فقط التوابع المؤجلة اللازمة لإرفاق معالجات إضافية أو تحديد الحالة (<code>[[jQuery/deferred/then|then]]</code> و <code>[[jQuery/deferred/done|done]]</code> و <code>[[jQuery/deferred/fail|fail]]</code> و <code>[[jQuery/deferred/always|always]]</code> و <code>[[jQuery/deferred/pipe|pipe]]</code> و <code>[[jQuery/deferred/progress|progress]]</code> و <code>[[jQuery/deferred/state|state]]</code> و <code>promise</code>)، ولكن ليس التوابع التي تغير الحالة (<code>[[jQuery/deferred/resolve|resolve]]</code> و <code>[[jQuery/deferred/reject|reject]]</code> و <code>[[jQuery/deferred/notify|notify]]</code> و <code>[[jQuery/deferred/resolveWith|resolveWith]]</code> و <code>[[jQuery/deferred/resolveWith|rejectWith]]</code> و <code>[[jQuery/deferred/notifyWith|notifyWith]]</code>). | ||
إذا توفَّر الكائن <code>target</code>، فسوف يرفق التابعُ <code>deferred.promise()</code> التوابع به ثم يعيد هذا الكائن بدلاً من إنشاء كائن جديد. قد يكون ذلك مفيدًا لإرفاق سلوك الكائن Promise بكائن موجود بالفعل. | إذا توفَّر الكائن <code>target</code>، فسوف يرفق التابعُ <code>deferred.promise()</code> التوابع به ثم يعيد هذا الكائن بدلاً من إنشاء كائن جديد. قد يكون ذلك مفيدًا لإرفاق سلوك الكائن Promise بكائن موجود بالفعل. | ||
إذا كنت تنشئ كائن مؤجل Deferred، فاحتفظ بمرجع إليه بحيث يمكن قبوله أو رفضه في مرحلة ما. إعادة الكائن Promise | إذا كنت تنشئ كائن مؤجل Deferred، فاحتفظ بمرجع إليه بحيث يمكن قبوله أو رفضه في مرحلة ما. حاول إعادة الكائن Promise عبر التابع <code>deferred.promise()</code> فقط، بحيث يمكن للشيفرات الأخرى تسجيل دوال رد النداء (callbacks) أو تفقد الحالة الحالية. | ||
لمزيد من المعلومات، راجع توثيق الكائن [[jQuery/deferred | لمزيد من المعلومات، راجع توثيق الكائن [[jQuery/deferred|Deferred]]. | ||
=== أمثلة === | === أمثلة === | ||
إنشاء كائن مؤجل Deferred وضبط دالتين تستندان إلى مؤقِّت لقبول أو رفض الكائن المؤجل بعد فاصل عشوائي. أيهما يُطلق أولًا "يربح" ويستدعي أحد دوال رد النداء. المهلة الثانية ليس لها أي تأثير نظرًا لأن الكائن المؤجل Deferred قد اكتمل بالفعل (في حالة قبول أو رفض) أثناء إجراء المهلة الأولى. ويضبط أيضًا دالة | إنشاء كائن مؤجل Deferred وضبط دالتين تستندان إلى مؤقِّت لقبول أو رفض الكائن المؤجل بعد فاصل عشوائي. أيهما يُطلق أولًا "يربح" ويستدعي أحد دوال رد النداء. المهلة الثانية ليس لها أي تأثير نظرًا لأن الكائن المؤجل Deferred قد اكتمل بالفعل (في حالة قبول أو رفض) أثناء إجراء المهلة الأولى. ويضبط أيضًا دالة إشعار تَقدُّم مستندة إلى مُؤقِّت، ويستدعي معالج تَقدُّم يضيف "working..." إلى نص المستند.<syntaxhighlight lang="jquery"> | ||
function asyncEvent() { | function asyncEvent() { | ||
var dfd = jQuery.Deferred(); | var dfd = jQuery.Deferred(); | ||
// | // القبول بعد فترة زمنية عشوائية | ||
setTimeout(function() { | setTimeout(function() { | ||
dfd.resolve( "hurray" ); | dfd.resolve( "hurray" ); | ||
}, Math.floor( 400 + Math.random() * 2000 ) ); | }, Math.floor( 400 + Math.random() * 2000 ) ); | ||
// الرفض بعد فترة زمنية عشوائية | |||
setTimeout(function() { | setTimeout(function() { | ||
dfd.reject( "sorry" ); | dfd.reject( "sorry" ); | ||
}, Math.floor( 400 + Math.random() * 2000 ) ); | }, Math.floor( 400 + Math.random() * 2000 ) ); | ||
// | // عرض رسالة "قيد التنفيذ..." كل نصف ثانية | ||
setTimeout(function working() { | setTimeout(function working() { | ||
if ( dfd.state() === "pending" ) { | if ( dfd.state() === "pending" ) { | ||
dfd.notify( " | dfd.notify( "قيد التنفيذ... " ); | ||
setTimeout( working, 500 ); | setTimeout( working, 500 ); | ||
} | } | ||
}, 1 ); | }, 1 ); | ||
// | // إعادة Promise حتى لا يستطيع المتصل تغيير المؤجل | ||
return dfd.promise(); | return dfd.promise(); | ||
} | } | ||
// | // إرفاق معالج الانتهاء والفشل والتقدم لـ asyncEvent | ||
$.when( asyncEvent() ).then( | $.when( asyncEvent() ).then( | ||
function( status ) { | function( status ) { | ||
alert( status + ", | alert( status + ", الأمور تسير بشكل جيد" ); | ||
}, | }, | ||
function( status ) { | function( status ) { | ||
alert( status + ", | alert( status + ", لم تنجح هذه المرة" ); | ||
}, | }, | ||
function( status ) { | function( status ) { | ||
سطر 61: | سطر 61: | ||
} | } | ||
); | ); | ||
</syntaxhighlight>استخدام | </syntaxhighlight>استخدام الوسيط <code>target</code> لترقية كائن موجود إلى كائن Promise:<syntaxhighlight lang="jquery"> | ||
// | // كائن موجود | ||
var obj = { | var obj = { | ||
hello: function( name ) { | hello: function( name ) { | ||
سطر 68: | سطر 68: | ||
} | } | ||
}, | }, | ||
// | // إنشاء كائن مؤجل | ||
defer = $.Deferred(); | defer = $.Deferred(); | ||
// | // ضبط كائن كـ promise | ||
defer.promise( obj ); | defer.promise( obj ); | ||
// | // قبول كائن مؤجل | ||
defer.resolve( "John" ); | defer.resolve( "John" ); | ||
// | // استخدم الكائن كـ Promise | ||
obj.done(function( name ) { | obj.done(function( name ) { | ||
obj.hello( name ); // | obj.hello( name ); // سوف يخرج تنبيه "Hello John" | ||
}).hello( "Karl" ); // | }).hello( "Karl" ); // سوف يخرج تنبيه "Hello Karl" | ||
</syntaxhighlight> | </syntaxhighlight> | ||
سطر 87: | سطر 87: | ||
[[تصنيف:jQuery]] | [[تصنيف:jQuery]] | ||
[[تصنيف:jQuery Method]] | [[تصنيف:jQuery Method]] | ||
[[تصنيف:jQuery Deferred]] | [[تصنيف:jQuery Deferred Object]] |
المراجعة الحالية بتاريخ 13:22، 1 يوليو 2018
deferred.promise( [target ] )
القيمة المعادة
يُعيد كائنًا من النوع Promise.
الوصف
يُعيد هذا التابع كائن Promise للكائن المؤجل Deferred.
deferred.promise( [target ] )
أُضيف مع الإصدار: 1.5.
target
الكائن الذي يجب إرفاق تابع promise به وهو من النوع Object.
يسمح التابع deferred.promise()
لدالة غير متزامنة بمنع الشيفرات البرمجية الأخرى من التدخل في تقدم أو حالة الطلب الداخلي الخاص به. ويعرض التابع promise
فقط التوابع المؤجلة اللازمة لإرفاق معالجات إضافية أو تحديد الحالة (then
و done
و fail
و always
و pipe
و progress
و state
و promise
)، ولكن ليس التوابع التي تغير الحالة (resolve
و reject
و notify
و resolveWith
و rejectWith
و notifyWith
).
إذا توفَّر الكائن target
، فسوف يرفق التابعُ deferred.promise()
التوابع به ثم يعيد هذا الكائن بدلاً من إنشاء كائن جديد. قد يكون ذلك مفيدًا لإرفاق سلوك الكائن Promise بكائن موجود بالفعل.
إذا كنت تنشئ كائن مؤجل Deferred، فاحتفظ بمرجع إليه بحيث يمكن قبوله أو رفضه في مرحلة ما. حاول إعادة الكائن Promise عبر التابع deferred.promise()
فقط، بحيث يمكن للشيفرات الأخرى تسجيل دوال رد النداء (callbacks) أو تفقد الحالة الحالية.
لمزيد من المعلومات، راجع توثيق الكائن Deferred.
أمثلة
إنشاء كائن مؤجل Deferred وضبط دالتين تستندان إلى مؤقِّت لقبول أو رفض الكائن المؤجل بعد فاصل عشوائي. أيهما يُطلق أولًا "يربح" ويستدعي أحد دوال رد النداء. المهلة الثانية ليس لها أي تأثير نظرًا لأن الكائن المؤجل Deferred قد اكتمل بالفعل (في حالة قبول أو رفض) أثناء إجراء المهلة الأولى. ويضبط أيضًا دالة إشعار تَقدُّم مستندة إلى مُؤقِّت، ويستدعي معالج تَقدُّم يضيف "working..." إلى نص المستند.
function asyncEvent() {
var dfd = jQuery.Deferred();
// القبول بعد فترة زمنية عشوائية
setTimeout(function() {
dfd.resolve( "hurray" );
}, Math.floor( 400 + Math.random() * 2000 ) );
// الرفض بعد فترة زمنية عشوائية
setTimeout(function() {
dfd.reject( "sorry" );
}, Math.floor( 400 + Math.random() * 2000 ) );
// عرض رسالة "قيد التنفيذ..." كل نصف ثانية
setTimeout(function working() {
if ( dfd.state() === "pending" ) {
dfd.notify( "قيد التنفيذ... " );
setTimeout( working, 500 );
}
}, 1 );
// إعادة Promise حتى لا يستطيع المتصل تغيير المؤجل
return dfd.promise();
}
// إرفاق معالج الانتهاء والفشل والتقدم لـ asyncEvent
$.when( asyncEvent() ).then(
function( status ) {
alert( status + ", الأمور تسير بشكل جيد" );
},
function( status ) {
alert( status + ", لم تنجح هذه المرة" );
},
function( status ) {
$( "body" ).append( status );
}
);
استخدام الوسيط target
لترقية كائن موجود إلى كائن Promise:
// كائن موجود
var obj = {
hello: function( name ) {
alert( "Hello " + name );
}
},
// إنشاء كائن مؤجل
defer = $.Deferred();
// ضبط كائن كـ promise
defer.promise( obj );
// قبول كائن مؤجل
defer.resolve( "John" );
// استخدم الكائن كـ Promise
obj.done(function( name ) {
obj.hello( name ); // سوف يخرج تنبيه "Hello John"
}).hello( "Karl" ); // سوف يخرج تنبيه "Hello Karl"