• illustrator Curse
  • 7Learn Android Course
  • 7Learn SEO Course
  • 7Learn WP Theme Course

    حرفه ای ترین دوره آموزش طراحی قالب وردپرس



  آیا می دانید میانگین رضایت دانشجویان سون لرن از دوره ها، بیش از 94% می باشد!

آشنایی با زبان Stylus ( قسمت نهم ) : توابع از پیش تعریف شده - بخش اول

0 1379 ۲۳ آبان ۹۳

در این مطلب میخوام تعدادی از توابع که در stylus موجود هست رو ، بهتون توضیح بدم.

red و greenو blue و alpha :

با استفاده از این توابع میتونین مقدار قرمز ، سبز ، آبی و شفاف بودن یک رنگ رو دریافت ( Get ) و یا اون رو مقداردهی ( Set ) کنید. پارامتر دوم این توابع اختیاری هست. اگر از پارامتر دوم استفاده کنیم ، Set خواهد شد و اگر استفاده نکنیم ، Get خواهد شد.

برای نمونه کد زیر ، مقدار قرمز بودن یک رنگ دلخواه رو مشخص میکنه :

خروجی این تابع و توابع green و blue ، عددی بین 0 تا 255 است. با استفاده از کد زیر هم میتونین ، مقداری دلخواه برای میزان قرمز بودن رو مشخص کنید :

توابع green و blue نیز دقیقا همانند بالا هستند. مثال :

با استفاده از تابع alpha میتونین میزان شفافیت یک رنگ رو دریافت کنید و یا مقدار جدیدی به اون بدین. مثلا کدهای زیر رو در نظر بگیرین :

مثل قبل اگر از پارامتر دوم استفاده نشه ، Get و در غیر اینصورت Set اتفاق میوفته.

dark و light :

با استفاده از این توابع میتونین مشخص کنید که یک رنگ تیره هست یا روشن. خروجی این تابع true یا false هست. برای چک کردن روشن بودن یک رنگ از روش زیر استفاده میکنیم :

بررسی تیره بودن رنگ :

 hue و saturation و lightness :

اگر با hsl آشنا باشین ، میدونین که خلاصه شده ی hue و saturation و lightness هست. با این توابع میتونین مقدار فعلی اونا رو در هر رنگی بدست بیارین ، یا مقدار جدیدی رو به اونا انتساب بدین. همانند گذشته ، اگر از پارامتر دوم استفاده نشه ، Get صورت میگیره. برای مثال تابع hue رو در نظر بگیرین :

تابع اول بدون پارامتر دوم و تابع دوم همراه با پارامتر دوم اجرا شدن. نتایج رو بعد از // قرار دادم.

توابع saturation و lightness هم دقیقا مانند فوق هستن :

 push و unshift :

با استفاده از این توابع میتونین تعدادی عضو به ابتدا یا انتهای لیستها اضافه کنید.

با استفاده از تابع push میتونین تعدادی عضو به انتهای یک لیست اضافه کنید ، بصورت زیر :

در خط اول یک لیست بنام nums ایجاد کردیم و در آن دو عضو قرار دادیم. پارامتر اول تابع push ، نام لیست مورد نظر هست و پارامترهای بعدی همان اعضایی هستند که میخواهیم به انتهای این لیست افزوده شوند. این تابع یک نام مستعار بنام append دارد ، که میتونین از اون هم استفاده کنید. این دو تابع دقیقا یک کار رو انجام میدن. حالا اگر خروجی رو ببینید ، بصورت زیر هست :

تابع unshift هم تقریبا شبیه به تابع بالایی هست ، با این تفاوت که اعضای جدید رو به ابتدای لیست مورد نظر اضافه میکنه. بصورت زیر :

نام مستعار این تابع هم prepend هست.

keys و values :

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

همچنین با استفاده از تابع values میتونیم به مقادیر دسترسی داشته باشیم :

list-separator :

این تابع یک لیست رو بعنوان ورودی دریافت میکنه و در خروجی جداکننده ی اون رو به ما تحویل میده. مثلا کدهای زیر رو در نظر بگیرین :

میبینید که خروجی اولی ، فضای خالی یا space بود و خروجی دومی کاما بود.

typeof و unit :

با استفاده از تابع typeof میتونین نوع یک متغیر یا مقدار رو مشخص کنید. این تابع نامهای مستعار type-of و type رو هم داره و هر سه دقیقا یک کار رو انجام میدن. بصورت زیر :

اگر ورودی یک رنگ باشه ، خروجی rgba خواهد بود ، که مشخص میکنه که رنگ هست.

با استفاده از تابع unit میتونین واحد یک متغیر رو مقدار رو دریافت کنید و یا اونو تغییر بدین. اگر از پارامتر دوم استفاده نشه ، واحد رو دریافت میکنید. مثال :

در مورد آخر ، واحد رو از % به px تبدیل کردیم.

match :

با استفاده از این تابع میتونین از Regular expresion ها استفاده کنید و ببینید که آیا رشته مورد نظر از این الگو پیروی میکند یا خیر. خروجی این تابع false یا true خواهد بود.

مثال :

پارامتر اول یک الگو هست و پارامتر دوم مقداری هست که میخواهید ببینید که ، از این الگو پیروی میکند یا نه.

abs و ceil و floor و round :

همه ی این توابع یک عدد رو دریافت میکنند و عملیاتی رو بر روی اون انجام میدن.

تابع abs همان قدر مطلق هست و نحوه کار آن ، به این صورت است که علامت عدد ورودی چه مثبت باشد و چه منفی ، علامت خروجی مثبت خواهد بود. بصورت زیر :

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

میبینید که 5.5 روند شده و به 6 تبدیل شده. میتوان گفت روند به بالا شده.

تابع floor هم یک عدد رو روند میکنه ، تا به بزرگترین عدد صحیح کوچکتر از خودش برسه. floor بمعنای کف هست. مثلا کد زیر رو در نظر بگیرین :

میبینید که 5.6 روند شده و به 5 تبدیل شده. میتوان گفت روند به پایین شده.

با استفاده از تابع round میتونین یک عدد اعشاری رو روند کنید. اگر به عدد پایینی نزدیکتر باشه ، روند به پایین میشه و اگر به عدد بالایی نزدیکتر باشه ، روند به بالا.

مثلا :

5.5 چون در وسط هست بصورت قراردادی به سمت بالا روند میشه.

برای توابع ceil و floor و round میتونین پارامتر دومی قرار بدین ، که دقت خروجی رو مشخص میکنه. شما میتونین تعداد اعشاری که بعد از عملیات باقی بمونن رو مشخص کنید. مثلا :

  sin و cos و tan :

با استفاده از توابع بالا میتونین مقدار سینوس و کسینوس و تانژانت رو بدست بیارین. این تابع یک ورودی دریافت میکنه. اگر واحد ورودی deg باشه ، همانند درجه با اون برخورد میشه ، در غیر اینصورت رادیان در نظر گرفته میشه.

تابع sin :

تابع cos :

تابع tan :

infinity به معنای بینهایت هست.

min و max :

با استفاده از این توابع میتونین بزرگترین و کوچکترین عدد رو مشخص کنید.

مثال min :

مثال max :

 even و odd :

با استفاده از این توابع میتونین بفهمین که یک عدد زوج هست یا فرد. تابع even برای زوج بودن و تابع odd برای فرد بودن بکار میره. خروجی این توابع true یا false هست.

مثال even :

مثال odd :

sum و avg :

این توابع تعدادی عدد رو دریافت میکنن و اونارو با هم جمع ( sum ) میکنن و یا میانگین ( average ) اونارو به ما تحویل میدن.

مثال sum :

مثال avg :

 base-convert :

با استفاده از این تابع میتونین مبنا رو به مبناهای دیگه تبدیل بدین. این تابع سه پارامتر دریافت میکنه که سومی اونا اختیاری هست.

  1. عددی که میخواهیم مبنای آن رو تبدیل کنیم و در مبنای 10 هست
  2. عددی که مبنای مورد نظر رو مشخص میکنه
  3. با استفاده از این عدد هم میتونین تعداد ارقام خروجی رو مشخص کنید. اگر تعداد کمتر باشه ، از سمت چپ با عدد 0 پر میشه. مقدار پیش فرض این پارامتر ، 2 هست

مثال :

join :

با استفاده از این تابع میتونین تعدادی عضو یا مقدار رو با یک جداکننده ، جدا جدا کنید. مثلا کد زیر رو در نظر بگیرین :

میبینید که سه عدد رو با علامت کاما از هم جدا کرده و در خروجی تحویل ما داده.

مثال های بیشتر :

خب دوستان خسته نباشید.

موفق باشید. یا علی

:: مطالب جدید سون لرن را از طریق ایمیل دریافت کنید :

دیدگاه ها اولین دیدگاه این مطلب را ارسال کنید.

ارسال دیدگاه

ورود/عضویت سریع با اکانت فیسبوک/جیمیل شما

:: شما می توانید با استفاده از اکانت یاهو یا جیمیل خود به صورت کاملا امن، سریع و بدون نیاز به ورود اطلاعات عضو و وارد سایت شوید. در این صورت هیچ نیازی به ورود نام کاربری و رمز عبور خود نخواهید داشت و هویت شما از طریق ایمیلتان مورد تائید قرار می گیرد .
برای استفاده از این روش باید در اکانت گوگل(جیمیل) و یا یاهوی خود لاگین باشید .
عضویت/ ورود سریع با :
در حال اتصال ...

ورود به سایت

ورود سریع با :
در حال اتصال ...

جستجو در سون لرن

عبارت :
7LearnTelegram