במאמר הקודם דיברנו על פונקציות ב-SASS. פונקציות, בניגוד ל-mixin, מגיעות מה-core של SASS וכתובות ברובי. כיוון שהן כתובות בשפת תכנות אמיתית, יש להן כוח הרבה יותר חזק ואנו יכולים לעשות איתן הרבה מאד דברים. במאמר הזה, שהוא האחרון בסדרת המדריכים על SASS, נסביר כיצד כותבים פונקציה.
אם אתם יודעים רובי, ניתן להוסיף בקלות פונקציות משלכם, אם יש לכם צורך בכך. כמובן שהמאמר הזה, שמיועד להסביר איך עושים את זה בקלות, אינו מיועד לכל אחד. אפילו לא למשתמשים מתקדמים ב-SASS אלא למתכנתים מתקדמים שצריכים פונקציונליות ברמה שרוב המשתמשים לעולם לא יצטרכו.
ואחרי ההבהרות והאזהרות, בואו ונראה כמה זה פשוט.
פונקצית הדוגמה שלנו היא פונקצית חיפוש טקסט. אני נותן לה string ו-substring והיא מחזירה לי true או false בהתאם לנוכחות מה שחיפשתי.
ראשית, הקוד ברובי. מדובר בקוד פשוט ביותר שלא צריך להיות גאון ברובי על מנת להבין אותו
module Sass::Script::Functions
def includes_string(string, substring)
assert_type string, :String
assert_type substring, :String
Sass::Script::Bool.new(string.value.include?(substring.value))
end
declare :includes_string, [:string, :substring]
end
זה קוד פשוט שמקבל שני ארגומנטים – string ו-substring ומשתמש במתודת include של מחרוזת טקסט כדי להחזיר true או false.
את הפונקציה הזו אני אשמור כ-test.rb בתיקיה כלשהי. לצורך הפשטות, זו תהיה התיקיה שממנה אני מריץ את ה-SASS.
עכשיו, כל מה שנותר לי לעשות זה לבקש מ-SASS לכלול את test.rb כאשר אני מריץ אותו. איך אני עושה את זה?
sass --watch input:output -r test.rb
באמצעות הפרמטר r ושם הקובץ. שימו לב שאם הקובץ נמצא בתיקיה מסוימת שהיא לא התיקיה שבה אתם מריצים את SASS, חובה לכלול את הנתיב.
כל מה שנותר לי זה לבדוק את הפונקציה, איך נעשה את זה בקלות? עם debug:
@debug includes_string('hello world!', 'hello');
מיד כשנקמפל את הקובץ נוכל לראות את התוצאה הבאה בקונסולה:
input/test.scss:5 DEBUG: true
וזו ההוכחה שהכל תקין ועובד! אם משהו לא היה תקין בפונקציה שלנו או ב-include, היינו מקבלים את הטקסט הבא בקונסולה:
input/test.scss:5 DEBUG: includes_string("hello world!", "hello")
שזה אומר בעצם שהקומפיילר לא מכיר את ה-includes_string ומתייחס אליו כמחרוזת טקסט פשוטה.
כאמור, לא רבים יצטרכו את הפונקציונליות הזו, אבל אם מישהו כן צריך להרחיב מאד את SASS – אפשר לראות כמה זה פשוט, קל ונוח.
זה המאמר האחרון בסדרת המדריכים על SASS.