آموزش فارسی Sass | توابع Sass

در این قسمت از سری آموزش فارسی Sass به 3 دسته دیگر از توابع موجود در Sass به همراه ذکر مثال می پردازیم. با ما در این قسمت از آموزش فارسی Sass همراه بمانید.

توابع Map در Sass

در Sass نوع داده ای Map به صورت یک (یا بیشتر) جفت key/value ارائه می گردد.

نکته: می توان همراه با map ها از توابع لیست که در قسمت قبلی شرح داده شد، استفاده کرد. در این صورت با map مانند یک لیست برخورد می شود. لیستی که شامل دو عنصر می شود.

map ها در Sass تغییرناپذیرند. بنابراین توابع map، یک map جدید برمی گردانند و map اصلی تغییری نمی کند. جدول زیر، لیست توابع map در Sass را نشان می دهد:

تابع	شرح و مثال
(map-get(map, key	کلید خاصی را از map برمی گرداند. مثال: (font-sizes: ("small": 12px, "normal": 18px, "large": 24px$ ("map-get($font-sizes, "small Result: 12px
(map-has-key(map, key	بررسی می کند که map کلید خاصی را دارد یا خیر. مقدار true یا false برمی گرداند. مثال: (font-sizes: ("small": 12px, "normal": 18px, "large": 24px$ ("map-has-key($font-sizes, "big Result: false
(map-keys(map	لیستی از همه کلید های داخل map را برمی گرداند. مثال: (font-sizes: ("small": 12px, "normal": 18px, "large": 24px$ (map-keys($font-sizes "Result: "small", "normal, "large
(map-merge(map1, map2	map2 را به انتهای map1 الحاق می کند (می چسباند). مثال: (font-sizes: ("small": 12px, "normal": 18px, "large": 24px$ (font-sizes2: ("x-large": 30px, "xx-large": 36px$ (map-merge($font-sizes, $font-sizes2 Result: "small": 12px, "normal": 18px, "large": 24px, "x-large": 30px, "xx-large": 36px
(...map-remove(map, keys	کلید های تعیین شده را از map حذف می کند. مثال: (font-sizes: ("small": 12px, "normal": 18px, "large": 24px$ ("map-remove($font-sizes, "small (Result: ("normal": 18px, "large": 24px ("map-remove($font-sizes, "small", "large (Result: ("normal": 18px
(map-values(map	در لیستی، همه مقادیر داخل map را برمی گرداند. مثال: (font-sizes: ("small": 12px, "normal": 18px, "large": 24px$ (map-values($font-sizes Result: 12px, 18px, 24px

توابع مربوط به Selector ها در Sass

توابع Selector جهت بررسی و نگهداری selector ها استفاده می شوند.

جدول زیر لیست همه توابع Selector در Sass را برمی گرداند:

تابع	شرح و مثال
(is-superselector(super, sub	این تابع بررسی می کند که زیر مجموعه ای که به یک Selector نسبت داده شده است، آیا واقعا زیر مجموعه آن است یا خیر. مثال: ("is-superselector("div", "div.myInput Result: true ("is-superselector("div.myInput", "div Result: false ("is-superselector("div", "div Result: true
(selector-append(selectors	این تابع selector دوم را به selector اول اضافه می کند و به همین ترتیب selector سوم به دوم و Selector چهارم به سوم و ... مثال: ("selector-append("div", ".myInput Result: div.myInput ("selector-append(".warning", "__a Result: .warning__a
(selector-nest(selectors	یک Selector جدید که شامل لیستی از Selector های تو در توی CSS می شود و براساس لیستی برگردانده می شوند. این لیست در ورودی تابع به آن داده می شود. مثال: ("selector-nest("ul", "li Result: ul li ("selector-nest(".warning", "alert", "div Result: .warning div, alert div
(selector-parse(selector	این تابع لیستی از Selector ها را برمی گرداند. در واقع Selector هایی را که در ورودی داده شده اند، (با همان فرمت داده شده) به صورت رشته هایی جدا برمی گرداند. مثال: ("selector-parse("h1 .myInput .warning ('Result: ('h1' '.myInput' '.warning
(selector-replace(selector, original, replacement	این تابع هم یک Selector جدید برمی گرداند، اما با این مکانیزم که پارامتر replacement را با پارامتر original در selector اصلی جایگزین می کند و selector جدید را برمی گرداند. مثال: ("selector-replace("p.warning", "p", "div Result: div.warning
(selector-unify(selector1, selector2	یک Selector جدید را برمی گرداند که حاصل تطابق 2 Selector در ورودی تابع است. اگر تطابقی حاصل نشود، null باز می گرداند. مثال: ("selector-unify("myInput", ".disabled Result: myInput.disabled ("selector-unify("p", "h1 Result: null
(simple-selectors(selectors	براساس ورودی تابع، لیستی از تک Selector ها را برمی گرداند. مثال: ("simple-selectors("div.myInput Result: div, .myInput "(simple-selectors("div.myInput:before Result: div, .myInput, :before

توابع Introspection در Sass

وقتی یک استایل می سازید، توابع Introspection به ندرت استفاده می شوند. اما این توابع زمانی ارزش خود را نشان می دهند که چیزی درست کار نکند. در حقیقت می توان آن ها را توابعی برای باگ زدایی نامید.

جدول زیر لیستی از توابع introspection در Sass را ارائه کرده است:

تابع	شرح و مثال
(...call(function, arguments	این تابع در واقعی تابعی را که نامش در ورودی می آید، به همراه آرگومان هایش می خواند و نتیجه را برمی گرداند.
()content-exists	بررسی می کند که آیا mixin جاری به یک بلوک content@ رفته است یا خیر.
(feature-exists(feature	بررسی می کند که یک ویژگی خاص توسط ورژن جاری Sass پشتیبانی می شود یا خیر. مثال: ;("feature-exists("at-error Result: true
(function-exists(functionname	بررسی می کند که یک تابع خاص وجود دارد یا خیر. مثال: ("function-exists("nonsense Result: false
(get-function(functionname, css: false	این تابع یک تابع خاصی را برمی گرداند، اما اگر مقدار css برابر باشد با true، در این صورت خودِ تابع CSS را به صورت ساده برمی گرداند.
(global-variable-exists(variablename	بررسی می کند یک متغیر سراسری خاص وجود دارد یا خیر. مثال: (variable-exists(a Result: true
(inspect(value	رشته ای که مقداری را نشان می دهد، در خروجی برمی گرداند.
(mixin-exists(mixinname	این تابع بررسی می کند که یک mixin خاص وجود دارد یا خیر. مثال: ("mixin-exists("important-text Result: true
(type-of(value	این تابع نوع یک مقدار را در خروجی برمی گرداند. این نوع می تواند از موارد زیر باشد: string ،color ، list ،map ،bool ،null ،function ،arglist مثال: (type-of(15px Result: number (type-of(#ff0000 Result: color
(unit(number	این تابع واحد یک مقدار یا در واقع واحدی را که همراه با یک عدد آمده باشد، برمی گرداند. مثال: (unit(15px Result: px
(unitless(number	این تابع بررسی می کند که به همراه یک عدد، واحد هم آمده است یا خیر. مثال: (unitless(15px Result: false (unitless(15 Result: true
(variable-exists(variablename	این تابع بررسی می کند یک متغیر خاص (در ورودی) در محدوده خاص (scope) وجود دارد یا خیر. مثال: (variable-exists(b Result: true

به پایان این درس از سری آموزش فارسی Sass رسیدیم. امیدواریم از مطالب امروز بهره کافی را برده باشید.

توابع Map و Selector و Introspection

توابع Map در Sass

توابع مربوط به Selector ها در Sass

توابع Introspection در Sass