عرض مصدر JavaScript/block

<noinclude>{{DISPLAYTITLE:الأقسام الكتلية في JavaScript}}</noinclude>
الأقسام الكتلية (block statement) تُستخدَم لتجميع عدِّة تعابير برمجية معًا، ويُعرَّف القسم بزوجٍ من الأقواس المعقوفة <code>{}</code>، وقد يُضاف قبله لافتة (label).
==البنية العامة==
قسم كتلي دون لافتة:<syntaxhighlight lang="javascript">
{
  StatementList
}
</syntaxhighlight>قسم كتلي مع لافتة:<syntaxhighlight lang="javascript">
LabelIdentifier: {
  StatementList
}
</syntaxhighlight>

=== <code>StatementList</code> ===
التعابير البرمجية المجمَّعة ضمن القسم الكتلي.

=== <code>LabelIdentifier</code> ===
لافتة <code>[[JavaScript/label|label]]</code> اختيارية يمكن استخدامها لتسهيل التعرّف بصريًا على القسم، أو كوجهة للتعبير <code>[[JavaScript/break|break]]</code>.

== الوصف ==
تسمح الأقسام الكتلي لك باستخدام أكثر من تعبير برمجي في المواضع التي تتوقع JavaScript أن تتلقى تعبيرًا برمجيًا وحيدًا؛ لاحظ أنَّ تجميع أكثر من تعبير برمجي في أقسام هو أمرٌ شائعٌ في JavaScript، والسلوك المقابل لهذا السلوك هو استخدام التعبير البرمجي الفارغ ([[JavaScript/empty|empty statement]]) الذي يسمح لك بعدم توفير تعبير برمجي مع أنَّه مطلوب.

== أمثلة ==

=== استخدام الأقسام الكتلية مع <code>[[JavaScript/var|var]]</code> ===
المتغيرات التي يُصرَّح عنها باستخدام <code>[[JavaScript/var|var]]</code> ليس لها مجال كتلي (block scope)، فالمتغيرات المُعرَّفة ضمن قسم كتلي (block) سيكون مجالها ضمن الدالة أو السكربت، وسيبقى أثر ضبطها إلى ما بعد انتهاء القسم الكتلي. مثال:<syntaxhighlight lang="javascript">
var x = 1;
{
  var x = 2;
}
console.log(x); // الناتج 2
</syntaxhighlight>ناتج تنفيذ السكربت السابق هو <code>2</code>، لأن التعبير <code>var x</code> الموجود داخل القسم الكتلي له نفس مجال (scope) التعبير <code>var x</code> الموجود خارج القسم.

=== استخدام الأقسام الكتلية مع <code>[[JavaScript/let|let]]</code> و <code>[[JavaScript/const|const]]</code> ===
المُعرِّفات التي يُصرَّح عنها باستخدام <code>[[JavaScript/let|let]]</code> و <code>[[JavaScript/const|const]]</code> ستملك مجالًا كتليًا:<syntaxhighlight lang="javascript">
let x = 1;
{
  let x = 2;
}
console.log(x); // الناتج 1
</syntaxhighlight>لاحظ أنَّ التعبير <code>x = 2</code> هو خاص بالمجال الكتلي الذي عُرِّفَ فيه.

الأمر مشابهٌ للمُعرِّفات التي يُصرَّح عنها باستخدام <code>[[JavaScript/const|const]]</code>:<syntaxhighlight lang="javascript">
const c = 1;
{
  const c = 2;
}
console.log(c); // الناتج 1 ولن تظهر رسالة خطأ

</syntaxhighlight>لاحظ أنَّ الثابت <code>const c = 2</code> لن يُسبِّب برمي الخطأ <code>SyntaxError: Identifier 'c' has already been declared</code> لأنه مُعرَّفٌ في مجالٍ خاصٍ به.

==دعم المتصفحات==
{| class="wikitable"
!الميزة
!|Chrome
!Firefox
!Internet Explorer
!Opera
!Safari
|-
! الدعم الأساسي
|نعم
|نعم
|نعم
|نعم
|نعم
|}

== مصادر ومواصفات ==
* مسودة المعيار [https://tc39.github.io/ecma262/#sec-block ECMAScript Latest Draft].
* معيار [http://www.ecma-international.org/ecma-262/6.0/#sec-block ECMAScript 2015 (6th Edition)]‎.
* معيار [http://www.ecma-international.org/ecma-262/5.1/#sec-12.1 ECMAScript 5.1].
* معيار [http://www.ecma-international.org/publications/files/ECMA-ST-ARCH/ECMA-262,%203rd%20edition,%20December%201999.pdf#sec-12.1 ECMAScript 3rd Edition].
* معيار [http://www.ecma-international.org/publications/files/ECMA-ST-ARCH/ECMA-262,%201st%20edition,%20June%201997.pdf#sec-12.1 ECMAScript 1st Edition] . 
[[تصنيف:JavaScript|{{SUBPAGENAME}}]]
[[تصنيف:JavaScript Statement|{{SUBPAGENAME}}]]