الفرق بين المراجعتين لصفحة: «Sass/join»

من موسوعة حسوب
لا ملخص تعديل
ط استبدال النص - 'توثيق Sass الرسمي.]' ب'توثيق Sass الرسمي].'
 
(6 مراجعات متوسطة بواسطة 3 مستخدمين غير معروضة)
سطر 1: سطر 1:
<noinclude>{{DISPLAYTITLE: الدالة <code>()join</code> في Sass}}</noinclude>
<noinclude>{{DISPLAYTITLE: الدالة <code>()join</code> في Sass}}</noinclude>
تجمع الدالة <code>join'''()‎'''</code> قائمتين في قائمة واحدة.
تجمع الدالة <code>join()‎</code> قائمتين في قائمة واحدة.


ما لم يُمرّر <code>‎$separator</code>، إن كانت إحدى القائمتين مفصولةً بفواصل والأخرى مفصولةً بمسافات، فسيُستخدم فاصل المعامل الأول في القائمة الناتجة. وإن كانت كلا القائمتين تحتويان على أقل من عنصرين ، فستُستخدم المسافات في القائمة الناتجة.
ما لم يُمرّر المعامل <code>‎$separator</code> وكانت عناصر إحدى القائمتين مفصولةً بفاصلة وعناصر الأخرى مفصولةً بمسافات، فسيُستخدم نوع فاصلة المعامل الأول في القائمة الناتجة. إن كانت كلا القائمتين تحتويان على أقل من عنصرين ، فستُستخدم المسافة لفصل عناصر القائمة الناتجة.


ما لم يُمرر <code>‎$bracketed</code>، فستوضع القائمة الناتجة بين أقواس مربعة إن كان المعامل الأول كذلك.
ما لم يُمرر المعامل <code>‎$bracketed</code>، فستوضع القائمة الناتجة بين قوسين مربعين شرط أن تكون القائمة الأولى <code>‎$list1</code> كذلك.


مثل كل دوال القوائم، فإن <code>join'''()‎'''</code> تُعيد قائمةً جديدةً بدلًا من تعديل الوسائط موضعيًا.
تُعيد الدالة <code>join()‎</code> قائمةً جديدةً، مثل كل دوال القوائم، بدلًا من تعديل المعاملات موضعيًا.


== البنية العامة ==
== البنية العامة ==
سطر 22: سطر 22:


=== <code>‎$separator</code> ===
=== <code>‎$separator</code> ===
فاصل القائمة الذي سيُستخدم. سواءً كانت قيمته <code>comma</code> أو <code>space</code>، فسيُستخدم هذا الفاصل. وإن كانت قيمته <code>auto</code> (القيمة الافتراضية)، فسيُحدّد الفاصل كما هو موضح أعلاه.
فاصل القائمة الذي سيُستخدم في فصل العناصر. يمكن أن تكون قيمته <code>comma</code> (أي استعمال الفاصلة لفصل العناصر) أو <code>space</code> (استعمال المسافة للفصل). أمَّا إن كانت قيمته <code>auto</code>، وهي القيمة الافتراضيَّة، فسيُحدّد الفاصل كما هو شُرح أعلاه.


=== <code>‎$bracketed</code> ===
=== <code>‎$bracketed</code> ===
يُحدد ما إذا كانت القائمة الناتجة ستوضع بين قوسين مربعين. إن كانت قيمته <code>auto</code> (القيمة الافتراضية)، فستُحدّد الأقواس كما هو موضح أعلاه.
يُحدِّد ما إذا كانت القائمة الناتجة ستوضع بين قوسين مربعين. إن كانت قيمته <code>auto</code>، القيمة الافتراضيَّة، فستُحدّد الأقواس كما هو شُرح أعلاه.


== القيم المعادة ==
== القيم المعادة ==
القائمة الناتجة عن تجميع القائمتين.
تُعاد قائمة ناتجة عن جمع القائمة <code>‎$list1</code> والقائمة <code>‎$list2</code>.
 
== الأخطاء والاستثناءات ==
سيُرمى الخطأ <code>ArgumentError</code> إن لم يكن <code>‎$number</code> عددًا لا وحدة له.


== أمثلة ==
== أمثلة ==
مثال عن استخدام الدالة <code>join()‎</code> لضبط قيمة الحواشي (<code>[[CSS/padding|padding]]</code>) والخطوط (<code>[[CSS/font-family|font-family]]</code>):<syntaxhighlight lang="sass">
مثال عن استخدام الدالة <code>join()‎</code> لضبط قيمة الحواشي (<code>[[CSS/padding|padding]]</code>) والخطوط (<code>[[CSS/font-family|font-family]]</code>):<syntaxhighlight lang="sass">
.selector {
.selector {
   padding: join(10px 20px, 30px 40px) // 10px 20px 30px 40px
   padding: join(10px 20px, 30px 40px); // 10px 20px 30px 40px
   font-family: join(("Times New Roman", Times), serif) // "Times New Roman", Times, serif;
   font-family: join(("Times New Roman", Times), serif); // "Times New Roman", Times, serif;
}
}
</syntaxhighlight>سيُصرّف المثال السابق إلى شيفرة <nowiki/>[[CSS]] الآتية:<syntaxhighlight lang="css">
</syntaxhighlight>سيُصرّف المثال السابق إلى شيفرة <nowiki/>[[CSS]] الآتية:<syntaxhighlight lang="css">
.selector {
.selector {
  padding: 10px 20px 30px 40px;
  padding: 10px 20px 30px 40px;
  font-family: "Times New Roman", Times, serif;
  font-family: "Times New Roman", Times, serif; }
}
</syntaxhighlight>
</syntaxhighlight>


== انظر أيضًا ==
== انظر أيضًا ==
* الدالة <code>[[Sass/append|append'''()''']]</code>'''''': تُضيف عنصرًا إلى قائمة.
* الدالة <code>[[Sass/append|append()]]</code>‎: تُضيف عنصرًا إلى قائمة.
 
* الدالة <code>[[Sass/is bracketed|is_bracketed()‎]]</code>: تتحقَّق ما إذا كانت القائمة تستخدم الأقواس المربعة أم لا.
* الدالة <code>[[Sass/zip|zip()]]</code>‎: تُضم مجموعة من القوائم في قائمة واحدة متعددة الأبعاد.
* الدالة <code>[[Sass/zip|zip()]]</code>‎: تُضم مجموعة من القوائم في قائمة واحدة متعدِّدة الأبعاد.


== مصادر ==
== مصادر ==
* [https://sass-lang.com/documentation/Sass/Script/Functions.html#join-instance_method قسم الدالة  في صفحة الدوال في توثيق Sass الرسمي.]
* [https://sass-lang.com/documentation/Sass/Script/Functions.html#join-instance_method قسم الدالة join في صفحة الدوال في توثيق Sass الرسمي].
[[تصنيف:Sass]]
[[تصنيف:Sass|{{SUBPAGENAME}}]]
[[تصنيف: Sass Function]]
[[تصنيف: Sass Function|{{SUBPAGENAME}}]]

المراجعة الحالية بتاريخ 07:01، 20 مايو 2018

تجمع الدالة join()‎ قائمتين في قائمة واحدة.

ما لم يُمرّر المعامل ‎$separator وكانت عناصر إحدى القائمتين مفصولةً بفاصلة وعناصر الأخرى مفصولةً بمسافات، فسيُستخدم نوع فاصلة المعامل الأول في القائمة الناتجة. إن كانت كلا القائمتين تحتويان على أقل من عنصرين ، فستُستخدم المسافة لفصل عناصر القائمة الناتجة.

ما لم يُمرر المعامل ‎$bracketed، فستوضع القائمة الناتجة بين قوسين مربعين شرط أن تكون القائمة الأولى ‎$list1 كذلك.

تُعيد الدالة join()‎ قائمةً جديدةً، مثل كل دوال القوائم، بدلًا من تعديل المعاملات موضعيًا.

البنية العامة

join($list1, $list2, $separator: auto, $bracketed: auto)

المعاملات

‎$list1

القائمة الأولى.

‎$list2

القائمة الثانية.

‎$separator

فاصل القائمة الذي سيُستخدم في فصل العناصر. يمكن أن تكون قيمته comma (أي استعمال الفاصلة لفصل العناصر) أو space (استعمال المسافة للفصل). أمَّا إن كانت قيمته auto، وهي القيمة الافتراضيَّة، فسيُحدّد الفاصل كما هو شُرح أعلاه.

‎$bracketed

يُحدِّد ما إذا كانت القائمة الناتجة ستوضع بين قوسين مربعين. إن كانت قيمته auto، القيمة الافتراضيَّة، فستُحدّد الأقواس كما هو شُرح أعلاه.

القيم المعادة

تُعاد قائمة ناتجة عن جمع القائمة ‎$list1 والقائمة ‎$list2.

أمثلة

مثال عن استخدام الدالة join()‎ لضبط قيمة الحواشي (padding) والخطوط (font-family):

.selector {
   padding: join(10px 20px, 30px 40px); // 10px 20px 30px 40px
   font-family: join(("Times New Roman", Times), serif); // "Times New Roman", Times, serif;
}

سيُصرّف المثال السابق إلى شيفرة CSS الآتية:

.selector {
  padding: 10px 20px 30px 40px;
  font-family: "Times New Roman", Times, serif; }

انظر أيضًا

  • الدالة append()‎: تُضيف عنصرًا إلى قائمة.
  • الدالة is_bracketed()‎: تتحقَّق ما إذا كانت القائمة تستخدم الأقواس المربعة أم لا.
  • الدالة zip()‎: تُضم مجموعة من القوائم في قائمة واحدة متعدِّدة الأبعاد.

مصادر