عرض مصدر JavaScript/class

<noinclude>{{DISPLAYTITLE:<code>class</code> في JavaScript}}</noinclude>
التصريح عن الصنف ('''class''' '''declaration''') يؤدي إلى إنشاء صنف جديد له اسمٌ معيّن يستخدم الوراثة عبر سلسلة prototype.

يمكنك أيضًا تعريف الأصناف عبر تعابير تعريف الأصناف (<code>[[JavaScript/Class Expression|class expression]]</code>)، لكن التصريح عن الصنف بهذه الطريقة يختلف عن استخدام تعابير تعريف الأصناف في أنَّه لا يسمح بإعادة التصريح عن الصنف مرةً أخرى، وسيرمي (<code>[[JavaScript/throw|throw]]</code>) خطأً إن حاولنا ذلك.
==البنية العامة==
<syntaxhighlight lang="javascript">
class name [extends] {
  // محتويات الصنف
}
</syntaxhighlight>
== الوصف ==
كما في تعابير تعريف الأصناف، ستُنفَّذ التعابر البرمجية الموجودة ضمن الصنف في [[JavaScript/Strict Mode|نمط strict]]، لاحظ أنَّ الخاصية (property) التي تُشير إلى الدالة البانية هي اختيارية.

لا يمكن استخدام الأصناف المُصرَّح عنها عبر تعابير التصريح عن الأصناف قبل تعريفها (على النقيض من [[JavaScript/function|تعابير التصريح عن الدوال]]).

== أمثلة ==

=== تصريح بسيط عن صنف ===
سنُعرِّف في المثال الآتي صنفًا باسم <code>Polygon</code> ثم أنشأنا صنفًا مشتقًا منه باسم <code>Square</code>، لاحظ أنَّ الدالة <code>[[JavaScript/super|super()‎]]</code> التي استعملناها في الصنف <code>Square</code> لا يمكن أن تُستخدَم إلا في الدوال البانية، ويجب استدعاؤها قبل استخدام الكلمة المحجوزة <code>[[JavaScript/this|this]]</code>.<syntaxhighlight lang="javascript">
class Polygon {
  constructor(height, width) {
    this.name = 'Polygon';
    this.height = height;
    this.width = width;
  }
}

class Square extends Polygon {
  constructor(length) {
    super(length, length);
    this.name = 'Square';
  }
}
</syntaxhighlight>
=== محاولة التصريح عن الصنف مرتين ===
محاولة إعادة التصريح عن الصنف ستؤدي إلى رمي <code>TypeError</code>:<syntaxhighlight lang="javascript">
class Foo {};
class Foo {}; // Uncaught TypeError: Identifier 'Foo' has already been declared

</syntaxhighlight>لاحظ أنَّ الخطأ نفسه سيظهر لو كان الصنف مُعرَّفًا عبر تعابير تعريف الأصناف (<code>[[JavaScript/Class Expression|class expression]]</code>): <syntaxhighlight lang="javascript">
var Foo = class {};
class Foo {}; // Uncaught TypeError: Identifier 'Foo' has already been declared

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

== مصادر ومواصفات ==
* مسودة المعيار [https://tc39.github.io/ecma262/#sec-class-definitions ECMAScript Latest Draft].
* معيار [https://tc39.github.io/ecma262/2017/#sec-class-definitions ECMAScript 2017].
* معيار [http://www.ecma-international.org/ecma-262/7.0/#sec-class-definitions ECMAScript 2016].
* معيار [http://www.ecma-international.org/ecma-262/6.0/#sec-class-definitions ECMAScript 2015 (6th Edition)]‎. 
[[تصنيف:JavaScript|{{SUBPAGENAME}}]]
[[تصنيف:JavaScript Statement|{{SUBPAGENAME}}]]