מסעותיי עם טרולים. כלומר.. js


(מיכאל שלמה) #1

אהלאן!
2 מילות רקע, שמי מיכאל, ואני בן 23, מאז ומתמיד אהבתי מחשבים ותיכנות, בגיל 15 בערך התחלתי באופן מקרי לחלוטין לפתח לפלאש ו-AS3 ומאז אני אוהב כל מה שקשור לתיכנות יצא לי להשתעשע מעט ב-C# ועכשיו אני נשאבתי לקסם של הקס!

מילה(טוב, קצת יותר :slight_smile: ) על פיתוח Web, לאחרונה במסגרת עבודתי, נחשפתי לחלום הבלהות של כל מתכנת שפות OOP, התחלתי לפתח ל-Web ולעבוד עם השילוש הקדוש - PHP, CSS, JS.
לפתע גיליתי מה המשמעות של צמד המילים: חוסר אונים, וחיפוש קצר בגוגל הראה לי שאני לא היחיד ושכמוני יש רבים וטובים.
אז בקצרה, מה חסר לי:

  1. כלי פיתוח - כרגע אני עובד עם הדפדפן Chrome(WTF!) ו- WebMatrix שהוא כלי די נחמד ותומך בהשלמה אוטומאטית לשלושת השפות הללו (ולעוד), שליטה מרחוק על סרברים, מתממשק (חלקית) עם Git ויחסית מהיר וקל אבל עדיין, הוא רק עורך קוד ולא שום דבר מעבר לזה, להלן הדרך הרשמית לבצע ניפוי שגיאות (Debug) ל-PHP, זה רחוק מאוד ממה שהייתי מורגל אליו עד כה (Visual Studio, FlashDevelop) - אם מישהו מכיר כלים טובים יותר, אשמח ללמוד ולהכיר!
  2. סדר - אחד “היתרונות” של JS ו-CSS היא גמישות כמעט בלתי מוגבלת שמאפשרת לכל מתכנת לפתח לפי איך שנוח לו אבל לעניות דעתי (ולבינתיים היא אכן עניה) הגמישות הזו היא “אליה וקוץ בה” כי עם הגמישות מגיעים הרבה מאוד סגנונות תיכנות מה שמקשה מאוד על קריאת הקוד (הדוגמא הבולטת היא JS שהרבה מאוד ממנה נשען על פיתוח ע"ג ספיריות כתובות)
    לדעתי השפות הללו הן מאוד פרימיטביות שעדיין קיימות כי הרוב המוחלט של האינטרנט מבוסס עליהן, בקיצור, מפתחי web בעצם הולכים על קביים.
  3. עקרונות פיתוח ברורים - כאחד שלא הכיר שפות שהן לא קשיחות טיפוס (Strictly type) לפתע הקוד נראה לי מאוד מבולגן, רגע, $value זה מספר? אובייקט? שלא לדבר שזה בכלל יכול להיות פונקציה! כמו כן, כל הסלט(ותקלות התאימות(!!!)) שבסופו של דבר נובע מהשילוב של HTML,CSS,JS,PHP ביחד הוא נוראי, רגע, מי קורא למי? המסך לפתע לבן, באיזה שפה שכחתי לשים נקודה פסיק? מחקתי CSS ומסתבר שהוא השפיע על אלמנט בדף אחר שלא שמתי לב אליו… כמובן שאני יכול להמשיך ולהמשיך, אבל לא זו מטרת הפוסט.

ואז הגיע הקש ששבר את גב הגמל (אני 2 מטר, אז קחו בחשבון שיש לי וואחד גב :smile: ) ושמו - Cookies JS.
מישהו מוכן להסביר לי למה JS (באופן מובנה!) לא תומכת בטיפול נורמאלי ב-Cookie? האם זה הגיוני שהצבת אובייקט Cookie יקרה ע"י השמה של מחרוזת!? אתם מוזמנים להסתכל בפלאי הטכנולוגיה של המאה ה-21 יצירת Cookie ב-JS באתר הרשמי כמובן (מעניין לראות ש- w3schools עובדים עם ASP כנראה שגם להם משהו לא מסתדר, או ש-Microsoft שילמה הרבה כסף ><)
ודוגמית לעצלנים שלא טרחו להיכנס:

  • יצירת עוגיה:

    document.cookie=“username=John Smith; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/”;

  • מחיקת עוגיה - לא התבלבלתם, הטריק הוא “לדרוש” את העוגיה עם תאריך תפוגה ישן מזמן הנוכחי [אילתור גאוני מספר 1]:

    document.cookie = “username=; expires=Thu, 01 Jan 1970 00:00:00 UTC”;

כשאנחנו נכנסים לאתר הוא שמור אצלינו במחשב מידע בעזרת העוגיות, כמובן שהאתרים שומרים יותר מערך אחד כמו תאריך כניסה ראשון, מספר דפים ביקרנו בתוך האתר ועוד, אבל איך הם ישמרו את כל המשתנים הללו בעוגיה אחת? ניחשתם נכון! כאן מגיע [אילתור גאוני מספר 2] כלומר, הכנסתם כלל המשתנים לעוגיה אחת והפרדתם בעזרת תו מפריד (Separator - דרג אגב, במהלך הכתיבה הגעתי לשאלה מרתקת איזה תו מפריד עדיף!).
אוקי, מגניב אז הצלחנו לשמור(יותר נכון לזרוק) מספר נתונים בעוגיה אחת, אה נכון, צריך גם לקרוא אותם, ואז מתחיל נושא מרתק לא פחות איך לנתח(Parse) את העוגיה מרובת הערכים הזו, ואם אני רוצה לעדכן את אחד הערכים? טוב… אני מאמין שהבנתם.

בעקבות זאת, החלטתי לפתח מחלקה בהקס שתנהל לי מאחורי הקלעים את כל הטיפול בעוגיות, ולי ישאר, כמו שאנחנו אוהבים, רק לדרוש מהמחשב מה אני רוצה שהוא יעשה - כלומר שהמחשב יעבוד בשבילי ולא להפך :smile:.

אז היות והקס היא שפה קשיחת טיפוס אז קודם כל הייתי צריך לבחור את מבנה הנתונים המתאים, הדרישות שלי היו( ראיתם, כבר המחשב מתחיל לעבוד בשבילי :smiley: ):

  1. גישה נוחה לנתונים, גם בשפה אליה אני מיצא: JS וגם בהקס עצמה.
  2. שיהיה אינטרקטיבי וקשיח טיפוס - כלומר, במידה ויש שגיאות שיפלוט לי אותם אוטומאטית - מסתבר שזה לא מובן מאליו…

בהקס יש מבני נתונים רבים וגם אותם אפשר להרחיב ולפתח, מודה שהיית מבולבל ואובד עצות, אז הלכתי לבקש בעצת הזקנים - התפתח שם דיון מעניין לגבי מערכת הטיפוסים של הקס באופן כללי שבהמלכו הבנתי לאט לאט מה אני צריך.
מעניין מאוד לראות שהקס מאוד גמישה בהרבה מובנים ובמקרה שלנו זה מתבטא בכך שאפשר לפתח איתה בצורה מאוד לא “קשיחה” ולהפך, להלן סיכום של מההצעות העיקריות שקיבלתי בפורום:

לבסוף החלטתי לנסות ולגשת לעניין בגישה של JS אבל בהקס ולבסס את מבנה הנתונים על Dynamic(השיטה השלישית - גמישות מוגבלת) מה שבנקודה זו התברר בסוף כלא טוב מבחינתי, הקוד עבד מצויין אבל הקוד יצא “מבולגן” מדי לטעמי, אין כאן את המבנה הלוגי וההגדרות הבסיסיות שאני מצפה לקבל כשאני בכותב בשפה כמו הקס(מודרנית, מונחת עצמים וכו’)

לאחר הרבה התחבטויות, ונסיונות לייצר את הפרוייקט הקטן הזה בהקס, הבנתי שהגישה שלי כלל לא נכונה! כל הזמן אני ניסיתי לכתוב JS בהקס אבל אני הרי כותב בהקס! ולכן צריך לכתוב הקס ולתת לקומפיילר לעשות את העבודה! חזרתי לשולחן השרטוטים וניסיתי להבין כיצד הייתי כותב את התוכנית ב-c# (לדוגמא…) והבנתי שאני צריך מחלקה CookieValue שבעצם תייצג תוכן של עוגייה וכך בעצם הגעתיל מצב יותר מונחה עצמים, יותר נוח לעיכול, קריא יותר ומדרגי(Scalability) יותר! מוזמנים להשוות! :smile:

לסיכום:

הקס היא שפה מאוד גמישה ועוצמתית! זה לא משנה אם אתם מתכנתים JS,Java,Paython… אתם תרגישו בבית! מהפרוייקט הקטן הזה, למדתי שאסור להתמכר לנוחות של המוכר ולנסות לכתוב את התוכנית בצורה יותר “הקסית” (במיוחד כשמודבר ב-JS!), ברגע שעשיתי את הסוויצ’ של לתכנת בהקס ולא לנסות להביא את JS הכל זרם, ובאמת הרגשתי בבית! :smiley:


(Itzik Arzoni) #2

חחח הרגת אותי! תענוג לקרוא אותך, בן אדם.

אבל במקום שאני אצטרך עכשיו לנבור בתוך דיון של מעל מאה תגובות סביב המתכון עוגיות שלך, אתה יכול אולי לכתוב סיכום קטן של מבני הנתונים האפשריים בהקס בהקשר הזה, ולהסביר מה עשית בסוף?
חוץ מזה, רגע, לא הבנתי, אתה כותב פרוייקט שלם בהקס עבור עוגיה?! או שאולי שאר הפרוייקט שלך הוא כתוב בג’אווהסקריפט? איך אתה מחבר בניהם?

חחח שפה של טיפוס קשוח…


(מיכאל שלמה) #4

קודם כל תודה רבה!!! :smiley:
שנית, מקבל - אני אוסיף סיכום של ההצעות.
שלישית, זה עוד לא גמור… אני עכשיו מתכוון לנסות לפתור את זה בגישה טובה יותר. ולאחר מכן אני אמשיך לכתוב את הפוסט הזה… לכל השאלות שלך יהיה מענה הולם.

חחחחחחחחחחח יפה!


(Itzik Arzoni) #5

הי מיכאל,
ראיתי עכשיו שהוספת את הטבלה עם האפשרויות פיתוח. אבל הטבלה היא תמונה…
אתה יכול לפחות לתת את הלינקים שנמצאים בטבלה, ולהסביר מה זה כל אחד מהסוגים שכתובים שם (Abstract, Dynamic etc) ?


(מיכאל שלמה) #6

קישורים:

  1. גישה נוחה יותר לנתונים ע"י “התאמת דפוס”.
  2. שימוש בביטוי מופשט (Abstract)
  3. גמישות מוגבלת

לגבי המושגים אני חושב שזה שייך לפוסט נפרד, למעוניינים להלן קישורים לאתר הקס הרשמי:

  1. Typedef
  2. Enum
  3. Pattern matching
  4. Abstract
  5. Dynamic