الفرق بين المراجعتين ل"Sass/join"

من موسوعة حسوب
اذهب إلى التنقل اذهب إلى البحث
(أنشأ الصفحة ب'<noinclude>{{DISPLAYTITLE: الدالة <code>()join</code> في Sass}}</noinclude> تحوّل الدالة <code>join'''()‎'''</code> عددًا غير ذي وحدة...')
 
سطر 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>‎$bracketed</code>، فستوضع القائمة الناتجة بين أقواس مربعة إن كان المعامل الأول كذلك.
 +
 
 +
مثل كل دوال القوائم، فإن <code>join'''()‎'''</code> تُعيد قائمةً جديدةً بدلًا من تعديل الوسائط موضعيًا.
 +
 
 
== البنية العامة ==
 
== البنية العامة ==
 
<syntaxhighlight lang="sass">
 
<syntaxhighlight lang="sass">
join($number)
+
join($list1, $list2, $separator: auto, $bracketed: auto)
 
</syntaxhighlight>
 
</syntaxhighlight>
  
 
== المعاملات ==
 
== المعاملات ==
  
=== <code>‎$number</code> ===
+
=== <code>‎$list1</code> ===
عددٌ صحيح.
+
القائمة الأولى.
 +
 
 +
=== <code>‎$list2</code> ===
 +
القائمة الثانية.
 +
 
 +
=== <code>‎$separator</code> ===
 +
فاصل القائمة الذي سيُستخدم. سواءً كانت قيمته <code>comma</code> أو <code>space</code>، فسيُستخدم هذا الفاصل. وإن كانت قيمته <code>auto</code> (القيمة الافتراضية)، فسيُحدّد الفاصل كما هو موضح أعلاه.
 +
 
 +
=== <code>‎$bracketed</code> ===
 +
يُحدد ما إذا كانت القائمة الناتجة ستوضع بين قوسين مربعين. إن كانت قيمته <code>auto</code> (القيمة الافتراضية)، فستُحدّد الأقواس كما هو موضح أعلاه.
  
 
== القيم المعادة ==
 
== القيم المعادة ==
نسبة مئوية.
+
القائمة الناتجة عن تجميع القائمتين.
  
 
== الأخطاء والاستثناءات ==
 
== الأخطاء والاستثناءات ==
سطر 18: سطر 34:
  
 
== أمثلة ==
 
== أمثلة ==
مثال عن استخدام الدالة <code>'''percentage'''()‎</code>  لضبط قيمة العرض ([[CSS/width|width]]):<syntaxhighlight lang="sass">
+
مثال عن استخدام الدالة <code>join()‎</code> لضبط قيمة الحواشي (<code>[[CSS/padding|padding]]</code>) والهوامش (<code>[[CSS/font-family|font-family]]</code>):<syntaxhighlight lang="sass">
selector {
+
.selector {
  width: percentage(0.2) // 20%
+
  padding: join(10px 20px, 30px 40px) // 10px 20px 30px 40px
 +
  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 {
  width: 20%;
+
  padding: 10px 20px 30px 40px;
 +
  font-family: "Times New Roman", Times, serif;
 
}
 
}
 
</syntaxhighlight>
 
</syntaxhighlight>
  
 
== انظر أيضًا ==
 
== انظر أيضًا ==
* الدالة <code>[[Sass/round|round'''()''']]</code>'''‎''': تُعيد العدد الصحيح الأقرب.
+
* الدالة <code>[[Sass/append|append'''()''']]</code>'''‎''': تُضيف عنصرًا إلى قائمة.
  
* الدالة <code>[[Sass/abs|abs()]]</code>‎: تُعيد القيمة المطلقة.
+
* الدالة <code>[[Sass/zip|zip()]]</code>‎: تُضم مجموعة من القوائم في قائمة واحدة متعددة الأبعاد.
* الدالة <code>[[Sass/max|max()]]</code>‎: تُعيد القيمة الأكبر بين مجموعة من الأعداد.
 
  
 
== مصادر ==
 
== مصادر ==
* [https://sass-lang.com/documentation/Sass/Script/Functions.html#percentage-instance_method قسم الدالة  في صفحة الدوال في توثيق Sass الرسمي.]
+
* [https://sass-lang.com/documentation/Sass/Script/Functions.html#join-instance_method قسم الدالة  في صفحة الدوال في توثيق Sass الرسمي.]
 
[[تصنيف:Sass]]
 
[[تصنيف:Sass]]
 
[[تصنيف: Sass Function]]
 
[[تصنيف: Sass Function]]

مراجعة 11:01، 21 أبريل 2018

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

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

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

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

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

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

المعاملات

‎$list1

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

‎$list2

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

‎$separator

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

‎$bracketed

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

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

القائمة الناتجة عن تجميع القائمتين.

الأخطاء والاستثناءات

سيُرمى الخطأ ArgumentError إن لم يكن ‎$number عددًا لا وحدة له.

أمثلة

مثال عن استخدام الدالة 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(): تُضيف عنصرًا إلى قائمة.
  • الدالة zip()‎: تُضم مجموعة من القوائم في قائمة واحدة متعددة الأبعاد.

مصادر