[Powered by Google Translate] [שבוע 8]
[הדוד J מלאן] [אוניברסיטת הרווארד]
[זה CS50.] [CS50.TV]
>> ברוך שובך.
זה CS50, וזו היא ההתחלה של 8 שבועות.
כמה הזדמנויות השבוע,
ביניהם הדיבורים האלה כאן, שבו אוכל יוגשו.
לפרטים נוספים לבדוק את השקופיות שנמצאות באינטרנט.
וגם אירוע נוסף שבוע על ידי תומאס עצמו Carriero.
הוא אחד מהבחורים של CS50 לשעבר ראש ההוראה שנמצאים כיום בDropbox,
והוא הבחור שחבר אותנו עם אתה יודע מה,
כך שאם אתה רוצה יותר מזה ראש לשיחתם אחר הצהריים לDropbox ויותר.
CS50 הצהריים הם ביום שישי הקרוב.
האם יצטרף אלינו אם אתה מסוגל, 1:15, כרגיל, באש וקרח.
>> ועכשיו אנחנו לצלול לתוך משהו שנקרא סמינרים.
CS50 הסמינרים שלנו, כזכור, הם כיתות אופציונליות אלה הובילו על ידי עמיתי ההוראה
וכמובן עוזרים וחברים של הקורס,
אנשים מקבוצה בקמפוס הנקראים ABCD, שהיא קבוצה של
technophiles בקמפוס, כמו גם קבוצה שנקראת HCS,
חברת הרווארד מחשב, סטודנטים המעוניינים באופן דומה במחשוב.
הסגל של השנה של סמינרים כולל סמינרים באנדרואיד ו iOS ו-JavaScript
וPHP, יוניקס, Vim, ועוד, ולכן הבינו שהסמינרים האלה באים.
אם אתה רוצה לאשר השתתפות לכל אחד מהם בראש לאותה כתובת שם.
אז אנו נפרסם באתר האינטרנט של הקורס את הזמנים ומקומות ברגע שהם סופיים.
אבל יודע שיש שווה של 5 השנים של סמינרים קודמים זמין באינטרנט,
רבים מהם עדיין מאוד נוכחיים במונחים של טכנולוגיות שאולי
רוצה לשחק עם לפרויקט הגמר שלך, ולכן בראש שיש לחלק מהסרטונים הזמינים.
>> CSS, אלה מכם שמכירים CSS כבר,
מה זה על רגל האחת?
מה זה CSS?
זה גיליונות סגנון מדורג, ומה זה אומר?
מה זה עושה לנו, CSS?
בסדר, בואו להתחמם עם 1 קל, HTML, שפת סימון היפרטקסט.
מה זה עושה לנו?
מישהו בכלל?
זה מתחיל להיות ממש מביך לשאול את השאלות האלה.
HTML, שפת סימון היפרטקסט.
כן? לא?
[תגובת תלמיד לא נשמעה]
אוקיי, טוב, זה מאפשר לנו לסמן טקסט להצגה בדפדפן אינטרנט.
זה לא שפת תכנות.
זה אכן שפת סימון, שאומר שהוא מורה לדפדפן כיצד להציג
מידע, כך הגלגול הפשוט של זה כפי שראינו
זה משהו סופר פשוט כמו boldfacing, סוגר פתוח סוגר ב סגור אומר
להפוך את הטקסט הזה מודגש, וזה בעצם רק אחת מדרכים רבות
שבו אנחנו יכולים לעשות את זה, ואכן, בימים אלה גישה טובה יותר
לstylizing דף האינטרנט שלך, מה שהופך את דברי הדגשה והטיה
ומרוכז ומוצדקים וכדומה, לא נעשה באמצעות תגי HTML לבד
אלא בטכניקה הנקראת CSS, גיליונות סגנון המדורג.
זו היא שפה בפני עוצמה.
גם היא לא שפת תכנות אבל-
כולם, זה דן, ששומר על שהצטרף אלינו היום.
חלק מהקשיים טכניים. לא בעיה.
>> CSS מאפשר לנו לסגנן דף
על ידי קביעה מה שנקרא נכסים, אז בואו נסתכל על זה
בדרך של כמה דוגמאות בסיסיות.
בואו ייכנסו למכשיר אותי היום.
יש לי ביום שני 8 בספריית המקור כאן,
ואני מתכוון להיכנס לספרייה בשם CSS שם יש לנו חבורה שלמה
של קבצים שמחכים לנו ממש כאן,
בתיקייה זו ויש לנו, למשל, search0.html מהעת האחרונה.
עכשיו, זוכר עם search0 יצאנו בפתק זה
על ידי סוג של יישום Google או באמת רק הקצה הקדמי לזה לפני שבוע בערך,
ושים לב שיש לנו כמה תגים חדשים שם.
היו לנו h1 לכותרת גדולה, נועזת,
טופס, אשר אפשר לנו למעשה יש טופס HTML עבור קלט של משתמש.
פעולה, מה הייתה המשמעות של תכונת פעולה
על תג הטופס HTML?
מה הייתה המשמעות שלה, פעולה זו?
אני רק עושה את זה היום.
פעולה היא היעד שבו לצורה הולכת להיות מוגש.
פעולת העובדה שאומרת = "google.com / חיפוש"
משמעות דבר הוא שכאשר המשתמש לוחץ על כפתור השליחה או שווה הערך
כל צורה ששדות שהם מלאו הולכים להיות לא נשלחו לשרת שלנו
או המכשיר שלנו אלא לכך שכתובת אתר המבוקשת בגוגל.
ואת השיטה שהוא הולך להשתמש נקראת להגיע,
ולקבל, לעת עתה, היא רק טכניקה להעברת מידע לאורך לשרת אינטרנט
בדרך של כתובת האתר, אז בואו נעיף מבט מהיר לאחור כיצד זה עובד.
>> שים לב שיש קלט ששם q
הסוג שלו הוא טקסט ולאחר מכן קלט שני מסוג submit
הערך שלו הוא CS50 חיפוש, ואכן, אם אנחנו פותחים את הקובץ הזה לכאן,
search0.html, זו צורת סופר פשוטה,
ואם אני מחפש משהו כמו מדעי מחשב
ואז הקש על Enter או לחץ על CS50 חיפוש
תבחין כי מה שקורה הוא מעבר להגעה לגוגל
אני כבר הסתיימתי באופן ספציפי את בכתובת זו בראש,
google.com / חיפוש? q = מחשב + מדע,
ומדעי מחשב הם ללא ספק מה שאני הקלדה
+ רק אומר שזה מקום שבי תו רווח היה,
וזה נעשה על ידי הדפדפן רק כדי לוודא שאין
בלבול וחלל לבן בכתובת האתר בפועל.
ואז ש, כמובן, הוא שם הפרמטר.
לא ראינו איך אנחנו, המתכנת, יכולים למעשה לגשת q עדיין.
אנחנו יכולים להניח שגוגל יודעת מה לעשות עם זה כאן,
אבל אנחנו נגיע לשם בבוא זמן היום.
>> אבל תן לי להעיף מבט במקום בsearch1.html,
שנראה קצת שונה, כי החליט שטופס זה כאן היה קצת צולע.
אני מתכוון, זה בפינה השמאלית העליונה.
באמת אין אסתטיקה לזה, ולכן אני רוצה לסגנן זה
קצת יותר כמו גוגל, דף הבית שלו, כזכור,
למרות שאתה לא יכול לבקר אותו, כי לעתים קרובות, נראה כך היום בליל כל קדושים.
אם במקום לפתוח את הגרסה 1 של קובץ זה, 1.html חיפוש, שמרכזתי אותה.
עדיין די מכוער, אבל לפחות עכשיו אני כבר התחלתי לשלוט באסתטיקה של דף זה,
לא רק מסמן אותם.
בואו נסתכל 1 חיפוש, ויש באמת רק הבדל אחד כאן,
אשר עשוי לקפוץ החוצה אליך, או אולי לא,
אבל מה השורה או קטע אחד של הבדל?
>> יש מאפיין סגנון זה, כך מתברר, כי ב-HTML
רוב האלמנטים, רוב התגים יכולים להיות תכונת סגנון עליהם,
ובתוך שתכונת הסגנון הוא מחרוזת מצוטטת,
ושהמחרוזת המצוטטת היא CSS.
אתה יכול לשים את גיליון סגנונות מדורגים שם
על ידי ההגדרה כשם מאפיין
אחריו נקודות ואחריו ערך.
זה סוג של עיצוב החלטה מצערת לפני כמה שנים
שCSS היא שפה בפני עוצמה,
אבל מבחינה תחבירית זה שונה מאוד מ-HTML.
במקרה זה, אנו רואים בתוך דף האינטרנט שלי, שכתוב ב-HTML,
יש לי CSS הפנימי של ציטוטים אלה, והכנס לCSS
הוא שיש לך מה שנקרא מאפיין ואחרי, שוב, מעי גס,
אחריו את הערך של אותו נכס, כך שאין סימן שוויון.
אין פה ציטוטים נוספים.
זה פשוט הצמד הזה המעי הגס המופרד מפתח הערך,
ושורת טקסט עושה בדיוק מה זה אומר.
זה מיישר את הטקסט בגוף הדף, וזה באמת את האומץ של הדף,
במרכז.
>> אוקיי, אז התוצאה הסופית, שיהיה ברור, היא זו.
לא כל כך סקסי, אבל לפחות זה מרוכז וקצת יותר כמו גוגל האמיתית.
אבל מה אם אני במקום לפתוח את הגרסה 2 של זה
ולהצביע כאן למטה תג חדש לגמרי?
עכשיו בראש הדף שלי, שבעבר היה רק ​​שתג
בכל הדוגמות הקודמות?
זה פשוט היה זה, בתואר.
רגע לפני תג הראש נראה כמו זה.
עכשיו, במקום שיש לו בתוך תג סגנון שלו,
וגם את זה, אני מתנצל, מבחינה תחבירית נראה מאוד שונה מ-HTML,
אבל אתה מתרגל לזה, לפיו בתוך תג הסגנון
עכשיו אני יכול גורם את מה שהייתה לפני רגע
תכונה, תכונת הסגנון, ואני יכול לשים אותו בחלקו העליון של הדף שלי.
>> למה?
ובכן, זה הוא צעד לקראת לנקות דברים, ממש כמו בכתיבת קוד C
לפעמים אנחנו נכתוב פונקציות לfactor את התפקוד משותף.
זה רק מעט נקי יותר כדי להתחיל הפקטורינג את הדברים כמו האסתטיקה
למיקום מרכזי אחד ולא שיש את כל זה לפזר ברחבי HTML שלך.
זה גם עושה מה שהוא אומר, למרות שיש בזה קצת בתחביר חדש.
זה כאן הוא בורר, וגוף רק אומר לבחור את אלמנט הגוף
ולהחיל את המאפיינים הבאים אליו.
ובכן, המאפיין הוא בדיוק אותו הדבר.
למען סדר טוב אני הוספתי פסיק בסוף,
אשר נוטה להיות כנס, ואני עטוף כל נכס זה
בסוגריים מסולסלים, כי אני באמת יכול להיות דברים שונים כאן.
אני באמת יכול להגיד משהו כמו צבע: כחול;
>> עכשיו גם זה לא הולך להיות צעד לקראת משהו כל כך יפה,
אבל אם אני עכשיו אחזור לגרסה 2 שלפחות עכשיו עשיתי את הגוף שלי
הטקסט של הדף הכחול לגמרי.
הכפתור נשאר זהה כי זה קלט. זה לא טקסט טהור.
אבל כל דבר אחר שהוא טקסט, כמו CS50 חיפוש למעלה, הוא עובדה בכחול.
שוב, כל מה שעשינו עכשיו הוא להסיר מתג הגוף, שים לב,
תכונת הסגנון, ויש לנו בחשבון את זה כאן.
זה לא שיפור עצום, אבל אם אנחנו לוקחים את זה צעד אחד קדימה
שים לב למה שאנחנו יכולים לעשות בגרסה שלישית זה כאן.
>> בsearch3.html דף האינטרנט הוא כמעט זהה
פרט למה תג חדש עכשיו?
קישור, כך שזו לא בשם מאוד קולע
בגלל שאתה לא מקשר במובן של היפר לחיץ.
במקום זאת, אתה עושה סוג של המקבילה של # כולל ב-C
לפי תג הקישור עם תכונת href
ותכונת rel אומרת קדימה
ועותק להדביק את תוכן קובץ שנקרא search3.css ממש כאן, בעצם.
זה לא ממש עושה את זה, אבל זה הרוח שלו.
זה אומר ללכת לפתוח את הקובץ, search3.css,
ולהתייחס אליו כאילו שהמשתמש הקליד אותו ממש כאן בראש העמוד
בדיוק כמו שעשיתי בדוגמא הקודמת.
Search3.css, בינתיים, הוא די פשוט.
זה באמת פשוט מכיל בדיוק מה שהייתה לפני רגע
בתג הסגנון, אבל יש לי בחשבון את זה כאן לקובץ משלה.
>> למרות שלא בילו הרבה זמן בכל ב-HTML או תכנות האינטרנט
רק באופן אינטואיטיבי מה המוטיבציה, אולי, להפקטורינג החוצה
קטע זה קטן אפילו של CSS לקובץ משלה
ואז ובכלל זה עם תג קישור זה כאן?
[תגובת תלמיד לא נשמעה]
אוקיי, זה קל יותר לקריאה במובן זה שיש לך CSS שלך בקובץ CSS.
יש לך HTML שלך בקובץ HTML שלך, כך שזה יהיה קריא יותר במובן הזה.
מה עוד יכול להיות משכנע? כן.
[תגובת תלמיד לא נשמעה]
כן, כדי שתוכל לכלול אותו פעמים רבות, ולכן כרגע אנחנו עושים אלה
דוגמאות בסיסיות עם קבצים בודדים, אבל תנחנה שאתה בעצם עושה
אתר אמיתי כמו שאתם רוצים ל7 pset או פרויקט הגמר שלך אולי,
ואתה רוצה להיות דפי אינטרנט מרובים, כפי שהוא בוודאי משותף על
World Wide Web בפועל, וזה יהיה סוג של צולע
יש להעתיק ולהדביק אותו הצבע הכחול
ואת אותו הטקסט מיושר למרכז בכל אחד מהדפים הללו.
במקום זה הגיוני יותר גורם החוצה, ממש כמו שעשינו ב-C
עם. קובץ h, לשים אותו במקום אחד מרכזי,
במקרה search3.css זה ולאחר מכן לאפשר לכל קובץ
באתר האינטרנט שלך לקובץ שבעצם כולל בדרך של תג זה כאן בקו 16.
כהוא בדרך המקרה, התחיל עם גרסה 0, איזה סוג של עבודות
אבל הוא לא בהכרח הטוב ביותר, ועם כל צעד,
1 חיפוש, חיפוש 2, ועכשיו חיפוש 3 נקטנו צעדי תינוק אלה
כיוון עיצובים ששואב קטן ויותר הכנה
לדפים יותר מורכבים שאנחנו יכולים לעשות בהמשך הדרך.
>> תן לי לפתוח לי את הדוגמא האחרונה כאן רק כדי להראות
דף גם מסוגנן יותר, אבל קודם בואו נסתכל על ה-HTML.
זה search4.html, ושים לב שמבנה זה כמעט אותו הדבר
פרט להקדמה של תג חדש, דיב.
דיב הוא תג שמציג חלוקה של הדף.
אתה יכול לחשוב על זה כמלבן בלתי נראה.
זה יוצר סוג של רצועה של אזור בדף האינטרנט
כי אתה יכול לסגנן הכל בבת אחת.
מה שעשיתי כאן הוא כדלקמן.
בתוך תג הגוף שלי, שהיה שם כל זמן,
אני אומר ליצור חלוקה של הדף כאן באמצעות קווים 45 עד 47,
וזה אומר בעצם לתת לי מלבן סמוי לאורך חלק העליון של הדף.
אז תן לי מלבן שני, אמנם בלתי נראה, מתחת לזה,
ולזהות אותו בשם התוכן, ולאחר מכן לבסוף,
תן לי את חטיבה שלישית של העמוד בתחתית
בשם זהות.
אנחנו נראה למה עשיתי את זה ברגע,
אבל מושגית יש לי חלוקת כותרת.
יש לי חטיבת תוכן, ויש לי חלוקה תחתונה של העמוד
למרות אלה הם רק בסימון.
המשתמש לא הולך לראות 3 מלבנים,
אבל סוג של מבני יש מאחורי הקלעים
הם בעצם הווה.
>> עכשיו, למי אכפת? למה בעצם לעשות את זה?
כל דבר אחר על הדף זהה כפי שראינו בעבר.
הנה הטופס שלי. הנה הקלט שלי, הקלט שלי, מעבר שורה וכן הלאה.
הנה תמונה, אם כי, ולכן אנחנו רואים לאן זה הגיע מרגע.
הנה כותרת תחתונה, שהיא חדשה, רק בגלל שרציתי להציג
עוד קצת תוכן כאן.
אם אנחנו לגלול למעלה נבחין זהות של div זה כותרת.
זיהוי של div זה הוא תוכן, ותעודת הזהות של אחד זה תחתון.
וכפי שהשם מרמז, כאשר יש לך תכונת זיהוי
ב-HTML, מעצם הגדרתו חייבת לזהות באופן ייחודי
אחד מהאלמנטים, אחד מהתגים בדף שלך.
הניטל הוא לחלוטין עליך לזכור שיש לך מזהה כותרת כבר.
יש לך תחתון. יש לך מזהה תוכן כבר.
המחשב לא הולך להבין מה זהות זמינה בשבילך,
כך שאתה יכול לתת בטעות 2 תגי זיהוי של כותרת,
וזה היה פשוט טועה.
>> אתה צריך לזכור את מה שאתה יצרת,
אבל ברגע שעשית את ההודעה כי מה שאנחנו יכולים לעשות כאן.
עכשיו אני יכול לציין בתגית הסגנון שלי בראש
או באופן שקול בקובץ CSS שלי, אם אני עדיין משתמש בגרסה ש,
אני יכול לומר # כותרת, ומה שזה אומר הוא שכל מה שתג
בדף זה יש זיהוי של הכותרת
ו#, פשוט על ידי כינוס אנושי, מייצג זהות.
השלט או סימן הק"ג החד מייצג זהות.
הכותרת היא השם שנתתי לו.
משמעות הדבר הוא החלת מאפיין זה CSS
לכל תג בדף זה נושא תעודת זהות של כותרת.
עסקה גם כאן.
החל נכס זה, אשר קורה להיות אותו הדבר, לכל אלמנט
זהות שלו הוא תוכן, ולאחר מכן כאן
שם לב יש לי קצת להשתכלל עם כותרת תחתונה.
כל אלמנט מזהה שהוא תחתון, שלא יכול להיות רק אחד בהגדרה,
קדימה ולהפוך את גודל הגופן שלו קטן יותר,
הנועז משקל גופן, השולים שלה 20 פיקסלים.
>> מה זה אומר?
זה רק שולים בחלק העליון, התחתון, והשמאל והימין.
פירושו של הדבר לתת לי מרווח בלתי נראה 20-פיקסל סביבו
רק כדי לדחוף את כל שאר ממנו קצת, כמו שאתה יכול לעשות ב-Word,
Microsoft Word או עמודים או כמו.
ולאחר מכן טקסט ליישר מרכז.
בואו לראות את התוצאה הסופית, ואחר כך נלך חזרה עד לקטע שנותר אחד מCSS יש.
זוהי הגרסה 4, האחרונה שלנו לדוגמאות החיפוש, וזה הרבה הרבה יותר סקסי.
עכשיו, בהגינות, אני פשוט בגוגל "מחולל לוגו גופן google".
וזה אפשר לי ליצור קובץ GIF, פורמט תמונה, שנראה כמו שיש.
למעשה, אתה יכול לעשות את זה יותר מדי.
יש לנו "מחולל לוגו גופני google".
>> בואו נראה אם ​​אנחנו יכולים לעשות את זה.
אוקיי, אני חושב שזה הייתי האתר.
אנחנו יכולים לומר Ec 10, למשל, ולהפוך אותם לעצמם.
אתה יכול לשחק עם זה במשך כל יום ארוך ולאחר מכן לחץ לחיצה ימנית על זה
ולאחר מכן להוריד את הקובץ GIF בפועל, שזה כל מה שאני עשיתי.
ואכן, בגלל זה ב-HTML שלי, כזכור, לכאן
היה לי תג תמונה, שראינו בשבוע שעבר בקצרה
מקורו logo.gif.
ומה שוב היה מוטיבציה שיש תכונת alt זה,
תכונה זו אלטרנטיבה?
כן.
[תגובת תלמיד לא נשמעה]
טוב, כל כך 2 סיבות באמת, אם הדפדפן לא יכול למשוך את התמונה
כי יש לך חיבור לרשת איטי או התמונה פגומה
או משהו כזה כי לפחות אדם יכול לראות "CS50 חיפוש"
ולאחר מכן גם מסיבות של נגישות.
אם יש לך משתמש שהוא עיוור והוא משתמש בקורא מסך
ולכן ברורים שלא יכול לראות את תמונות שהם יכולים לפחות
לשמוע טקסט אם המחשב שלהם מדבר אותה אליהם.
>> באופן כללי, זה הכי טוב להתאמן כשמדובר בנגישות של דפים
כך שמשתמש אפילו בסיטואציה הזאת יכולה לשמוע או לראות, אם אפשר לומר כך,
מה זה זה בדף שלך.
יש עוד דבר אחד שעשיתי כאן
שהוא קצת מעניין, ואנו רואים יותר על זה בבעיה להגדיר 7
באמצעות אחד מהמכנסיים הקצרים בראשות אחד מעמיתי ההוראה.
אבל # תוכן מתייחס לתג
זהות שלו הוא תוכן, אבל יש תו רווח, ואז יש את מילת הקלט.
ובכן, מה שמעניין הוא שעל CSS אתה יכול
מתייחס לתגים בסוג של דף בצורה היררכית,
ומה הקטע הזה של אמצעי CSS הוא למצוא את התג
זהות שלו הוא תוכן, ולאחר מכן להחיל את המאפיינים הבאים
לכל תגי הקלט שהם צאצאיו של תוכן,
זה שמסוכסך בתוכו.
כניסה, שוב, היא חשובה רק למחשב, לא לבני האדם,
אלא על ידי ועידתנו לשנן את הדברים כמו שאנחנו הולכים עמוקים יותר לתוך דף,
אז זה אומר שחל בהפרש של 5 פיקסלים לכל אלמנט קלט
זה איפשהו בתוך או מקונן בתוך של
מרכיב הזהות שלו הוא תוכן.
>> מי זה קשור אל?
ובכן, יש למעשה רק 2 החבר 'ה האלה כאן.
שים לב שבתוך של הטופס יש 2 כניסות,
כפי שהיה לכל הדוגמות הללו.
אבל שים לב ש2 הכניסות האלה יקרו לי לקנן בפנים,
אם כי מעט מאוד, כמה שכבות של כניסה,
בתוך תג זיהוי שלו הוא תוכן.
מה זה אומר?
אם תלכו לדפדפן כאן אתה יכול לראות, מעט אי פעם כל כך
תנו לי להתמקד שביש קצת ריפוד בין הכפתור
ובין שדה הטקסט.
>> תן לי לבטל באופן זמני את זה.
עזוב אותי ל-CSS שלי, ונתת לי ללכת קדימה ופשוט
לשנות שולים מזה 5 פיקסלים ל0 פיקסלים.
תן לי ללכת קדימה ואז לשמור את הקובץ, לחזור למנוע החיפוש
ולטעון מחדש, ולצפות באמצע העמוד.
יש הכול דחוס יחד, וכשאני ראשון הצלפתי דוגמה זו
חשבתי שנראה טיפשי בשדה הטקסט ולאחר מכן על הכפתור מייד מתחתיו.
אני רוצה לרפד אותה קצת, אז אני הצגתי שולים.
מה שלא יעשו בהרצאה היא לעבור כמה עשרות
מאפייני CSS שקיימת כי, שוב, יש דברים כמו גודל גופן,
משקל גופן, שולים, ליישר טקסט, וכמה תריסרים אחרים,
ואנו להפנות אותך בבעיה להגדיר 7 להדרכות שונות באינטרנט
והפניות שמאפשרות לך לקחת את הדברים האלה.
אבל מה שבאמת חשוב בסופו של היום
>> הוא להבין איך הדברים האלה מיושמים.
שוב, אם יש לנו בתוך תגית סגנון בי
יכול ללכת לבוררים, מהסוג שציין מזהים
למי אתה רוצה להחיל מאפיינים אלו,
ואז אתה מכניס את המאפיינים כזוג ערך מפתח
מופרד על ידי מעי גס ולאחר מכן הסתיים בנקודת פסיק,
או שאתה יכול לקרוע את כל זה ולשים אותו בקובץ CSS נפרד
בפני עצמו.
בסדר, כל שאלה על המושגים
או התמונה הגדולה של CSS?
אתה שוב תראה את זה יותר ב7 pset,
אך תשמרו את זה בדרך כלל די פשוט.
לא? בסדר.
הגיע זמן לשפת תכנות עצמו,
ואנחנו נחזור לקצת CSS בצורה של דוגמה.
PHP היא למעשה שפה נגישה להפליא
בכך שהוא כמעט שווה ערך מבחינה תחבירית לג
במילים אחרות, אם אתה יודע C, אתה יודע לחלק הכי PHP,
לפחות מבחינה תחבירית, למרות שיש כמה תכונות חדשות
וכמה מושגים חדשים יהיו לנו להסתכל.
>> אבל על פי רוב, עכשיו שאנו מעבר מ C ל-PHP
רוב הדברים החדשים הוא באמת בתמונה הגדולה,
איך אתה משתמש בשפה לתכנית באינטרנט בניגוד ל
בשורת הפקודה או במהבהב פקודה כפי שעשינו עד כה.
להתייחסות, במיוחד עם 7 pset ואילך פרויקט הגמר,
אל תנצל את כתובת האתר כאן אם אתה רוצה לקרוא על הרשמיות של PHP.
הם ממש כמו ספר לימוד מקוון חופשי ביעילות,
ואתה גם תמצא כי מה שבאמת נחמד בPHP
הם שיש מאת פונקציות שמגיעות עם זה,
ואילו ב-C שלא בהכרח יש גישה ל
פונקציות נוספות מעבר להיו בספריית המתמטיקה, CS50 הספרייה.
ב PHP והרבה שפות מודרניות, פייתון ורובי ביניהם,
אתה מקבל גישה לפונקציות רבות יותר, מה שאומר שאתה מקבל לכתוב
הרבה פחות קוד, כי אתה יכול לעמוד על כתפיהם של אנשים אחרים
שכבר כתב דברים מסוימים בשבילך.
>> בואו ניקח לסיור מהיר של התחביר של PHP ואז לכתוב כמה דוגמאות.
מה שיפה על PHP הראש ובראשונה
אין פונקציה עיקרית.
אם אתה רוצה לכתוב תכנית ב-PHP אתה פשוט תתחיל לכתוב קוד,
ואתה לא צריך לדאוג לראשי.
אין int. אין תמורה.
אין argv, argc שנדרש בעת כתיבת התכנית.
במקום זאת אתה יכול פשוט להתחיל לכתוב קוד, וזה בחלק
כי PHP היא מה שנקרא שפה לפרש.
ג נערך, והוא נערך במובן זה שאתה מתחיל
עם קוד מקור, להפעיל אותו באמצעות קלאנג, שהוא מהדר,
וסופו של דבר, לאחר מספר מסוים של צעדים שאתה מקבל קוד אובייקט, 0s ו 1s.
PHP ופייתון ורובי ופרל ואחרים
סוגים שונים של שפות שבאינך לקמפל אותם.
אתה לא הולך מקוד המקור ל0s ו 1s.
אתה פשוט להפעיל את קוד המקור, ואתה מפעיל את קוד המקור
על ידי כתיבה בקובץ טקסט רגיל, שהסתיימה ב. PHP במקרה זה
במקום. ג, ומה התכנית עושה במחשב שלך
הוא מפרש אותו, פשוטו כמשמעו, קו הקוד שלך על ידי שורה אחרת שורה.
>> במילים אחרות, במקום לכתוב תכנית ולהריץ את התוכנה
ישירות במקום לכתוב תכנית עם קובץ המסתיים ב. PHP.
ואז אתה מפעיל את תכנית בפועל נקראת php.exe, אם אתה ב-Windows,
או סתם PHP אם אתה ב-Mac OS או לינוקס,
ואתה מספק כקלט לתכנית PHP קוד המקור שלך,
ומטרתו בחיים היא לקרוא בראש שלך הקוד למטה, מהשמאל לימין,
ולעשות כל מה שאמרת לו לעשות.
>> בואו לראות מה זה הולך מתכוון תחבירי.
ב PHP יש לנו תנאים.
שקופית זה זהה למה שראית שוב בשבוע 1
בגלל תנאים תחביריים, IFS IFS ואחר ואחר ב-PHP
נראה בדיוק כמו זה.
כשזה מגיע לביטויי וליאניות שהם הולכים להיראות בדיוק כמו זה.
כשזה מגיע לדברים anding יחד כבוליאנים זה הולך להיראות בדיוק כמו זה.
מתגים נראים אותו הדבר, ואתה מקבל יתרון הנוסף ב-PHP
כי מתגים ב C יכולים לעבור רק על char או int.
אתה לא יכול לעבור על ערך מחרוזת.
ב PHP אתה בעצם יכול להיות ביטוי
שהוא משתנה שתוכן הם מחרוזת,
ואתה באמת יכול לעשות השוואת מחרוזת בצורה אינטואיטיבית האמיתית,
לא השוואת מצביע, על מנת להחליט אם לעשות את המקרה אני או j או משהו אחר.
נראים שפוטנציאל לפני זמן רב.
>> לולאות מדי להפליא הן אותו הדבר.
ללולאות יש אתחול, מצב, וחלק מספר העדכונים.
בעוד לולאות קיימות גם ב-PHP.
לעשות בזמן שלולאות קיימות גם ב-PHP,
ומערכים קיימים ב-PHP, אבל הנה שבו התחביר מתחיל להיות קצת שונה,
אבל המושגים הם אותו הדבר, ואת המושגים באמת אותו הדבר
כפי שהיו ב0 שבוע עם גרד.
בראש ובראשונה הוא הסימן $.
זו הייתה החלטת עיצוב ב-PHP לפי כל משתנה
ב-PHP על ידי העיצוב מתחיל עם סימן $.
אין יותר X, Y, Z. זה עכשיו $ X, Y $, $ Z רק בגלל.
זה משהו שצריך לזכור, ועכשיו בצד ימין
זה נראה דומה למערך,
אבל אנחנו משתמשים בסוגריים מרובעים כאן.
ב-PHP ו ב-JavaScript, כמו שנראים בסופו של דבר לראות,
כדי להצהיר על מערך אתה עושה סוגר מרובע פתוח וסגור סוגריים מרובעים,
ואז יש לך רשימה של ערכים מופרדים בפסיקים, אם ints
או מחרוזות תווים, או מה שאתה רוצה, בתוך של שהביטוי שם.
>> עכשיו, איך אנחנו עושים משהו כמו זה ב-C?
מה היה התחביר להכרזה על מערך של מספרים ידועים סטטי?
זה היה סוגריים מסולסלים, הבדל כל כך קל כאן, אבל בשניהם PHP
וסופו של דבר זה רק משתמש JavaScript סוגריים מרובעים, כך שבאמת
הפרט המעניין היחיד כאן הוא סימן $ לשם משתנה
וגם את הסוגריים המרובעים, ויש דבר אחד מוזר
זה הושמט, כמו גם בצד השמאלי של הסימן =.
מה חסר כי אנחנו כבר דורשים בשבועות אחרונים? כן.
[תגובת תלמיד לא נשמעה]
הגודל, כך שאין אזכור לגודל של המערך.
למען אמת, אין שום אזכור לסוגריים מרובעים בצד השמאל
של הסימן =, ומה עוד חסר בקו?
כן. >> [תגובת תלמיד לא נשמעה]
הסוג, ולכן מה שמעניין במיוחד על PHP
הוא שזה לא שפה חזקה מוקלדת כC הוא,
וזה מאופיין חזק במובן זה שאתה חייב לומר char,
אתה חייב לומר int, אתה חייב לומר לצוף.
>> כל פעם שאתה רוצה יש לך משתנה לספר קלאנג מה הסוג שלו הוא.
PHP היא קצת עצלה יותר.
זה הוקלד באופן רופף, במובן זה
אתה יכול לקבל צוף תווים ומחרוזות
וints וכן הלאה, אבל השפה עצם
לא ממש אכפת לי מה אתה מכניס בתוך משתנה.
אתה לא צריך להודיע ​​לו מראש מה סוג נתונים
הוא הולך במשתנה.
זה לגמרי תלוי בך, אז זה נחמד
בכך שאתה לא צריך לדאוג כל כך הרבה על נתוני הקלדה
ולדאוג מה הטיעונים שלך, וכן הלאה.
זה גם אומר לבסוף פונקציות ב-PHP הולכות להיות מסוגל לחזור
גם רוב int של הזמן, ואולי פעם בכמה זמן
הם יחזרו bool, שקר וליאני, למשל, למקרה שמשהו ישתבש.
זה נותן לנו כמה upsides, אבל זה יהיה גם לגרום לנו סוג של עיצוב על ידי
קצת עצל יותר כשזה מגיע להקלדת נתונים.
>> מה עוד יש לזכור כאן?
משתנים נראים די אוהבים, כל כך של $ = זה "שלום, עולם".
זה אולי inferable מהדוגמא הקודמת,
ויש לנו סוג אחר של לולאה.
זה אחד אנחנו בעצם רואים פעם בכמה זמן מאז שזה די נוח,
foreach לבנות.
במקרה זה, לוקחת לולאת foreach בתוך סוגר 3 מילותיה בדרך כלל,
משהו $ ראשון, שזה מה שמערך אתה רוצה לחזר על החברים,
אז פשוטו כמילת מפתח, ואז לבסוף,
עוד שם משתנה שאתה יכול לבחור.
זה יכול להיות foo, בר, או רכיב,
ומה זה לבנות עושה
הוא אם מערך $ מכיל 10 מרכיבים
בכל איטרציה של מערך מצטער שזה, בכל איטרציה של לולאה זה
המרכיב משתנה בשם הולך להיות מעודכן
להיות האלמנט הראשון במערך, אז האלמנט השני במערך,
אז המרכיב השלישי במערך, ובכך מייתר את הצורך
לעשות את כיתוב סוגר המרובע המעצבן מעט ו
$ I כדי אינדקס לתוך מערך.
PHP עושה את כל זה בשבילך את העבודה ועל כל איטרציה
רק מושיט לך את האלמנט הבא מהמערך
מבלי שתצטרך לדעת על או אכפת מיקום האינדקס המספרי שלו.
>> ואז לבסוף, לעת עתה, קיימת תכונה של PHP אחד אחרת
זה הולך להיות הרבה מאוד שימושי, במיוחד כאשר אנו מתחילים בתכנות באינטרנט,
וזה, כידוע, מערך אסוציאטיבי.
המערכים שאנו מכירים עד כה כשל 20 שניות לפני
ובמשך 8 השבועות האחרונים צמודים מערכים מספריים,
סוג של מערכים מסורתיים שבו המדדים ints,
0, 1, 2, כל הדרך למעלה.
מערכים אסוציאטיביים הם הרבה יותר חזקים.
הם מאפשרים לך יש מפתחות שרירותיים,
מדדים שרירותיים וערכים שרירותיים.
בעוד במערך מסורתי זה 0, 1, 2,
במערך אסוציאטיבי שאתה יכול להיות ראשים
או מפתח של foo שערך בר.
אז אתה יכול לקבל מפתח נוסף ששם באז וערך שלו הוא qux.
>> שוב, שמות טיפשיים במדעי מחשב גנריות משתנים כאן,
אבל הנקודה היא שהמערך הזה אין סוגר 0 או סוגר 1.
זה במקום הולך להיות הסוגר foo וסוגר באז.
זה הרבה יותר תכליתי שבאנחנו הולכים להיות מסוגלים לשייך
מילים עם מילים אחרות, מפתחות עם ערכים לחלוטין באופן שרירותי,
ואנחנו הולכים להיות מסוגלים לקבל את אותם ערכים אחורה בזמן קבוע
משום מה מתחת למכסת מנוע מערך אסוציאטיבי
באמת הוא שולחן חשיש.
תזכיר כי שולחן חשיש מאפשר לך לשים בקלט כלשהו
רוצה לשים את מילת הדוד אם ברצונך להוסיף דוד לסוג של מילון,
ואז אתה מקבל חזרה ערך כלשהו בדרך כלל.
במקרה של איות, אמת או שקר.
דוד או מה שמילה הוא באו שאינו נמצא במילון.
מערך אסוציאטיבי הוא באמת רק שולחן חשיש,
אבל זה גלגול ידידותי למשתמש הרבה יותר מזה.
כפי שנראה, זה הולך כדי לאפשר לנו לעשות כמה דברים
מאוד, מאוד בקלות.
>> בואו ניקח מבט על כמה PHP בסיסי
דוגמאות ולראות מה אנחנו יכולים לעשות עם שפה זו.
תן לי ללכת קדימה ולפתוח בספרייה שלנו היום
קובץ שנקרא hello1.php.
קובץ זה הוא תגובה יותר מאשר קוד בפועל,
אז תן לי למעשה להסיר את כל ההערות מהקובץ
ובהווה לך אולי תכנית PHP הפשוטה ממש כאן.
5 שורות, וכמה מהם הם חלל לבן,
כל כך להבחין בכמה הבדלים עיקריים כאן.
הקובץ נקרא hello1.php.
הקו הראשון, אם כי, הוא <? PHP.
דומה ברוח ה-HTML,
הרצף של תווים שמציין למחשב
"היי, מחשב, הנה מגיע תכנית אנחנו בב-PHP".
היא מוודא שזה לא מבולבל שזה קצת שפה אחרת.
קו 2 הוא חלל לבן ומעניין.
קו 3 הוא הידיד הוותיק שלנו printf,
הפעם בהקשר של PHP.
PHP יש גרסה משלה printf שמתנהג בדיוק אותו הדבר,
אז זה רק הולך להדפיס "שלום, עולם".
ואז תג מול זה כאן,?>, אומר שזהו לקוד PHP שלי.
>> בואו לראות איך להפעיל את זה.
אני הולך לחזור לחלון המסוף שלי כאן.
אני הולך להיכנס לספריית PHP שלי.
שים לב שיש לנו חבורה שלמה של קבצים, הראשון בם הוא hello.php.
תן לי ללכת קדימה ולרוץ, hello1.php זה, להיכנס.
לא ניתן אישור. אוקיי.
איך אנחנו יכולים לסדר דברים כאלה בעבר?
מה זה? >> [תגובת תלמיד לא נשמעה]
אנחנו צריכים לקרוא ולכתוב, אבל תנו לי לעשות ls-l.
זכור את התפוקה סתומה למדי זה לפי hello1
נראה שיהיה קריא וכתיבה על ידי
אבל קריאה על ידי כולם.
מסתבר שזה באמת לא צעד בכיוון הנכון.
ההבדל, שוב, עם שפה פרשה
הוא אינך מפעיל את התוכנה ישירות.
אתה במקום לרוץ מתורגמן ומושיט אותו הקוד
שכתבת כך שהוא יכול לפרש אותו השורה אחרת השורה.
במקרה זה, המתורגמן או תוכנה, אני ממש רוצה לרוץ
נקרא מילולי PHP.
>> אי שם על כונן הקשיח של המכשיר יש תכנית
מישהו אחר כתב בשם PHP או ב-Windows php.exe.
מה שאני הולך לעשות כאן הוא שאני לא ממש להפעיל PHP
אלא לתת לו כארגומנט שורת פקודת הקוד שאני כתבתי,
ואז אני התרחקתי ומקיש על Enter.
היא פועלת תכנית שלי בשבילי, מלמעלה למטה, משמאל לימין.
תן לי ללכת קדימה, לפתוח את שונות קלות של זה.
בהודעת hello2.php שגם זה
היא בעיקר הערות, אז בואו להיפטר מאלו כהסחתי,
ומה שונה בבירור כרגע על הקובץ הזה?
יש קו זה חדש, סתום למדי בחלק העליון.
בתור 1 זה #! / Bin / php.
סל הוא מוסכמה על לינוקס ו-Mac OS לקבצים בינאריים,
כך / bin פירוש זה הוא תיקייה המכילה אוסף של קבצים בינאריים
שמתוכן, שאחד מהם הוא PHP.
#! הוא כונה עסק,
המהווה את הדרך המהירה ולומר זאת, ומה זה אומר
הוא שכאשר אתה מפעיל תכנית זו כעת יש רמז בחלק העליון של הקובץ
המספר את המחשב איזה פרשן לשימוש.
>> זה נהיה קצת מעצבן אם היה לך לספר למשתמשים וללקוחות שלך שלך
"היי, כתב תכנית זו נקראת hello1.php."
כל מה שאתה צריך לעשות זה לרוץ לנצח PHP ולאחר מכן את שמה של תכנית זו.
למען אמת, זה יהיה רק ​​יותר נחמד לרוץ hello1.php,
ואכן, אנחנו יכולים אם אנחנו נעשה את הדברים הבאים.
תן לי ללכת קדימה ולעשות ls-l, והודעה בhello2 זה עדיין רק לקרוא לכתוב
ואז לקרוא לקרוא, אז אני לא יכול עדיין לעשות את זה, hello2.php.
אבל אנחנו הצגנו את זה ולו בחטף הפעם אחרונה, את פקודת chmod.
אם אני עושה chmod + x, מה שאומר שכל executability התוספת,
ולאחר מכן ולאחר מכן לעשות hello2.php ls-l שוב לב מה השתנה.
אחד, לינוקס מראה לי את שם הקובץ בירוק להעביר את הרעיון
שהפעלה של זה, אבל חשוב יותר, בצד השמאלי
שם לב שקצת מייצג x להפעלה בינתיים נקבע.
מה זה אומר שעכשיו הוא שאני יכול להפעיל ./hello2.php כרגיל,
הקש על Enter, ובגלל כל העסק בחלקו העליון של הקובץ
זה רמז, שוב, ללינוקס שאומרת
להשתמש במתורגמן זה כדי להפעיל קובץ זה.
אל תדאגו מאלץ את המשתמש להקליד אותו למעשה.
>> ומה שיפה הוא כעת זה סוג של לא רלוונטי ללקוחות שלי או החברים שלי
באיזו שפה כתבתי את התכנית הזאת ב, אז אני יכול ללכת קדימה עם MV
ושנה את שם הדבר הזה לhello2, למשל.
ועכשיו אם אני עושה ./hello2
ולהקטין את תצוגת התכנית שלי ממשיכה לפעול.
סיומות קבצים אלה הן מוסכמה אנושית שזה נחוץ
למשהו כמו קלאנג ולעשות שתחפשו אותם.
אבל עבור PHP, אני יכול להתקשר לכל דבר סיומת קובץ זה שאני רוצה.
אני יכול להערים על העולם לחשוב שאני ממש טוב ברובי,
ואני יכול לכתוב hello2.rb ולאחר מכן להפעיל את זה,
וזהו, עכשיו יש לי את גרסת רובי, שהוא שקר מוחלט.
אבל את סיומות קבצים הן חסרות משמעות
אם קובץ הפעלה ויש רמז מיוחד זה בחלק העליון של הקובץ.
>> עכשיו, כמו בצד, תנו לי להראות לך במהירות גרסה 3,
שהוא סוג של טריק שימושי לדעת.
בhello3 שעשיתי משהו רע במקצת
שאני אעדכן מקוון קוד המקור.
בגרסת 3 מתברר כי ברוב מחשבי לינוקס
יש תכנית בשם env לאיכות הסביבה,
ומה אתה יכול לעשות כאן הוא אם אין לך מושג בו PHP
מותקן על הכונן הקשיח המקומי, כי אכן זה יכול להשתנות בהתאם למחשב
שמישהו משתמש, env פשוט אומר לרוץ env,
שהוא ברוב המערכות, ולהבין איפה PHP היא.
רק תרגיל משותף, כך שאינך צריך לדאוג למצוא איפה היא תכנית.
אבל אם אתה עושה את הטיפול כדי לגלות איפה היא תכנית ולא היה אכפת עד כה
אתה יכול להשתמש בפקודה ש.
>> בואו להגדיל אותי החוצה וסוג שPHP,
ושימו לב שהוא אומר לי שזה ממש בusr / bin / php.
זה סוג של שקר. זה גם בסל.
זה רק מראה לי את המכה הראשונה.
אם אי פעם תהית איפה הוא קלאנג, שקלאנג, זה בusr / bin / צלצול,
אשר עושים, usr / bin / לעשות, ומה משמעות של זה הוא כל הזמן הזה
היית יכול להקליד / bin usr / צלצול להיכנס לרוץ קלאנג,
אבל זה סוג של מייגע לעשות את זה, ולכן חלק מתיקיות
כמו usr / bin ובן מניחים שיהיו ברירת מחדל
כדי שהמחשב יודע להסתכל בם בשבילך.
כל שאלות על כתיבת תכנית סופר, סופר פשוטה Hello World
ב-PHP ולאחר מכן מפעיל אותו?
כי עכשיו נתחיל להציג את התחביר יותר משכנע.
בסדר, הנה זה בא.
תוכניות אלה שראינו ממש לפני כולם.
>> אם אני פותח, למשל, בואו נעשיתי beer1.php,
אנחנו לא נעבור על כמה גרסות של זה, אבל מה שעשיתי
היה אני ישבתי ומזגתי אותו או להמרה
הקוד שלי C לקוד PHP כאן.
רוב העליון של הקובץ הוא כאן הערות מעלה.
מתברר שיש פונקציה חדשה אחד שאנחנו צריכים קראנו readline.
GetString, כזכור, בין 0 ואילך שבוע היה CS50 דבר.
PHP מגיע עם הפונקציה שלו ידידותית למשתמש בשם readline
שלוקח את הטיעון 1, אשר מציין את הפקודה
כי אתה רוצה להראות למשתמש, ומה עושה readline
הוא מחזיר אותו כל מה שהמשתמש מקליד פנימה
במקרה זה, אני מכריז על משתנה בשם n $.
אני מאחסן אותו בערך ההחזרה של readline
לאחר להציג הודעה למשתמש במחרוזת הזאת.
רק כדי לגבות, למעשה להפעיל את הדבר הזה, תן לי ללכת קדימה
ולהפעיל beer1.php PHP.
כמה בקבוקים יהיו? בואו פשוט לעשות 2 שלב זה.
Enter. זה הכל.
>> התכנית היא פונקציונלי זהה לגרסת C משבועות לפני.
אבל מבחינה תחבירית בואו לראות מה שונה.
אחרי שאני מקבל int ממשתמש ההודעה שאני עושה איזה בדיקת שגיאות,
ואם n הוא פחות מ 1 אני מתפטר ואני מדפיס את
הודעה מצטערת למשתמש והיציאה עם 1.
גם זה קצת שונה.
ב C מה עשינו? ב C חזרנו 1.
ב PHP אתה יוצא עם 1, אשר בכנות אני חושב שהוא קצת יותר אינטואיטיבי
בגלל שאתה ממש אתה לצאת מהתוכנה.
בסדר, ואז כאן השיר המעצבן זהה תחבירי
פרט למשתנה, ולכן כאן בקו 24 ואילך
שם לבי ללולאה הוא כמעט אותו הדבר,
אבל יש לי $ מולי וn,
ומה גם שחסר בקו 26 שהיו לנו בעבר
כאשר הכריז אני משתנה?
אין שום סוג.
אין זה נכון ב-PHP לומר int.
אתה פשוט לא צריך לעשות את זה.
המחשב, מתורגמן PHP הוא חכם מספיק כדי להבין
כי אם אתה שם את מספר ב$ אני יהיה לטפל בו
כמספר בשבילך.
ואז כאן אנחנו תקע ב$ i, $ i, $ i - 1.
כל זה הוא אותו הדבר, ואז אנחנו עושים כאן למטה "וואו, זה מעצבן" printf
ולאחר מכן צא (0).
>> שוב, טייק אוויי כאן הוא שלמרות שאנחנו הולכים לבלות יחסית
מעט זמן על PHP, ובוודאי לעומת מה שעשינו בג',
זה כמעט אותו הדבר, ולכן מה שנעשינו היום ובשבוע הבא
ומעבר לו להתמקד באמת על כמה רעיונות החדשים.
רק כדי לראות שדבר אחד אינו מעל לתרגם מ C,
זו הייתה תכנית פשוטה סופר שעשינו בשבוע 1
או 2 קוביות שערך.
אבל מה שהיה מעניין באותה העת על תכנית זו היא שהיא
הציג את הרעיון של פונקציה נכתבה מותאמת אישית שכתבו בעצמנו.
התחביר ב-PHP הוא כמעט אותו הדבר.
הנה התכנית שלי למעלה.
שימו לב שוב נעדר זה רעיון עיקרי.
אני מתחיל לכתוב קוד, וזה מה שהולך לקבל להורג על ידי המתורגמן.
אני מדפיס את x הוא כעת 2, ככל הנראה.
אז אני טוען עקוב ...
אז אני קורא לפונקצית הקובייה ולעבור בx $
ולהקצות את ערך ההחזרה לx $.
אז אני טוען שהוא חתוך לקוביות, ואז אני אומר את זה, שאני מקווה
יגיד x הוא כעת 8.
התחביר של הפונקציה ב-PHP הוא לא היה בצורה.
שוב חסר הוא סוג התמורה.
שוב חסר הוא סוג ההחזרה וגם חסר הוא איזה סוג אחר?
[תגובת תלמיד לא נשמעה]
טוב, בסדר, זה טוב. בואו נחזור לזה בשנייה.
>> אין לנו, למשל, int כאן.
אנחנו לא, למשל, יש int כאן כי, שוב, ב-PHP
אתה פשוט לא צריך ולא צריך לעשות את זה,
אלא שיש מילת המפתח החדש הזה שנקרא פונקציה.
ב PHP זה כמעט קצת יותר ברור, כי כאשר אתה רוצה פונקציה
אתה ממש אומר פונקציה, אתה נותן לו את שם ולאחר מכן רשימה מופרדת בפסיקים
אם כל טענותיה.
אין צורך לומר חלל או משהו כזה, ואז התשואה היא זהה,
$ * $ * $.
מה גם שחסר? סמי ציין את זה כאן.
בראש הקובץ נעדר לחלוטין ב-PHP גם הוא אב טיפוס.
גם זה על ידי עיצוב.
שפות ומתורגמנים כמו PHP חכמות יותר מאי פעם C הייתה
במהדרים כמו קלאנג.
>> זוכר שקלאנג, אם לא אמר לו קובייה שקיים,
אם לא אמר לו שprintf מקיים כעם אב טיפוס
או עם # כולל, טוב, זה הולך לצעוק עליך ואפילו לא לקמפל את הקוד שלך.
PHP ושפות מודרניות יותר הם הרבה יותר חכם כשזה מגיע לזה.
הם ייקחו על עצמם לקרוא את כל הקוד שלך
ואז צעק עליך רק אם הוא מוצא שום מקום קובייה.
זה לא משנה אם קובייה היא בתחתית או בראש או אפילו בחלק הקובץ נפרד.
שפות PHP ודומות כעת חכמות מספיק כדי להסתכל קדימה
על הכול לפני הסוברת כמי שעשה טעות.
איפה זה משאיר אותנו?
>> בואו נעשה הדוגמא האחרונה כאן בתנאים,
ואם אני פותח את הודעת conditions2.php מדי
תחביר כאן הוא כמעט אותו הדבר.
אני משתמש readline במקום GetString, אבל קו שהוא אותו הדבר כמו קודם,
"הייתי רוצה שלם בבקשה."
אז יש מצב, אם, אם אחר, ולאחר מכן אחר,
אבל תפקודי תכנית זו היא גם זהה לזה שעשינו לפני שבועות,
כך שאם אני מפעיל את הדבר הזה, PHP של conditions2,
ואני נותן לו מספר כמו 23 -
הרמתי מספר חיובי. אם אני נותן לו -1 לקחתי מספר שלילי.
אם אני נותן לו 0 אני אכן הרמתי 0.
אז למי אכפת מכל זה?
ובכן, אחד מהסוג שהכיף של תרגילים כאן
לי לפחות היה לחזור ולראות כמה מהר אני יכול ליישם pset 5,
pset שגיאות הכתיב.
זוכר שהיה הקובץ הזה שנקרא speller.c,
והיה שם קובץ שנקרא dictionary.c.
מה שעשיתי היה לי סוג של בילה כמה דקות ואני אומר קוד C
לקוד PHP, ואנחנו לא מבלים זמן רב באית
כי בדיוק כמו בpset 5 אתה לא באמת צריך
מבלה זמן רב באית עצמו בגלל תשומת הלב שלך הייתה במילון.
>> תסתפק בכך שאומר שאם אתה קורא את האיות,
קובץ זה כאן, זה פחות או יותר שווה ערך לקוד C
אנחנו נתנו לך לpset 5.
אני רק הוספתי כמה דולרים במקומות.
שיניתי את שמות פונקציות מסוימים אם הם לא היה קיימים ב-PHP.
יש דבר אחד נוסף כאן, preg_match,
שזו הדרך קטנה של להשתכלל עושה משהו, אבל אנחנו עוד נחזור לזה בסוף.
אבל בקיצור, אית הוא כמעט זהה, ואם אתה מסתכל בתחתית
מה זה בסופו יורק את זה כאן,
מילים באיות שגויה, מילים במילון, מילים בטקסט.
בסדר, אז מה זה מעניין עכשיו הוא הבא.
בחלק העליון של הקובץ שלי אני דורש dictionary.php.
בדיוק כמו C # שכולל PHP יש פונקציה מיוחדת הנקראת דורשים
שפחות או יותר עושה את אותו הדבר, דורש קובץ שנקרא dictionary.php.
איך אני יכול ללכת על יישום pset 5?
תן לי ללכת קדימה, לפתוח את קובץ כאן.
תן לי לקחת קצת התייחסות כאן.
ותן לי ליצור קובץ חדש ולהתחיל לקרוא dictionary.php זה.
תן לי לשים אותו בתיקייה אחרת, כדי שנוכל לעשות את זה לחיות.
ועכשיו אני זום פנימה
אני הולך להתחיל קובץ PHP שלי עם סוגר פתוח PHP סגור סוגריים.
ואז לכאן היו כמה פונקציות שנחוצות ליישום לpset 5,
אז תן לי להתחיל ליישם כמה מאלה,
כך סימון הפונקציה, שהייתי צריך לקחת את מילה כבטיעון.
אנחנו נעשה את זה ונחזור אליו ברגע.
>> היה עומס פונקציה, אשר לקח כבמה ויכוח?
מילון, ולכן הקובץ שממש רציתי לטעון.
היה גודל פונקציה, שלא לנקוט בכל טיעונים
ולא הייתה פונקציה, מה היה אחרים?
לפרוק, שלא לקחת שום טיעונים או.
אלה הם 4 הפונקציות שהייתי צריך כעת ליישם ב-PHP,
ומה שאני הולך לעשות הוא ללכת ולעשות את זה.
הרבה השתמש בטבלת חשיש בpset 5,
אז תן לי להמשיך וליצור טבלת חשיש ב-PHP.
עשה.
זה נותן לי שולחן חשיש. ובכן, מדוע?
אחד, משתנה נקרא שולחן $, רק כדי להעלות את הרעיון של שולחן חשיש.
הסוגריים המרובעים, אם כי, כזכור, מייצגים את מה?
מערך, אבל במערכי PHP לא צריך להיות צמוד מספרי.
הם יכולים גם להיות מערכים אסוציאטיביים,
מה שאומר שאתה יכול לקבל את המפתחות וערכים שרירותיים.
>> ממש כמו בpset 5, אלו מכם שעשו יישומי שולחן חשיש
אתה כנראה הכנסת את המילה ולאחר מכן הכנסת אותו לשרשרת של רשימות מקושרות,
או שאתה מאוחסן הערך של מקום או משהו דומה לזה אמיתי.
אתה איכשהו זכרת את העובדה שהמילה הייתה שם.
לעת עתה, שהולך להיות שולחן החשיש שלי,
ואז עכשיו ללכת על יישום פונקצית ההמחאה
אני רק צריך להסתכל לתוכו ששולחן החשיש
ולראות אם מילה היא שם.
מה שאני הולך לעשות הוא שאני עומד לומר אם-
תניחו isset, שהיא פונקצית PHP שממש רק אומר הוא סט המפתח,
כך isset ($ שולחן [$ מילה],
ואם כן החזר אמיתי.
זה הכל. זה pset 5 ב-PHP.
ובכן, בהגינות, בסדר.
אחרת בתמורת שווא, כך שזה לא שם.
מה באמת קורה פה?
ובכן, אם שולחן או חשיש שולחן כאן באופן כללי יותר,
הוא מערך אסוציאטיבי שאומר שאתה יכול להוסיף לאינדקס לתוכו
עם מילה כמו "מילה", ואתה צריך לחזור קצת ערך.
>> אנחנו מקבלים סוג של צעד אחד לפנינו.
זה יהיה די נחמד אם אנחנו באמת עמוסים הקובץ ראשון,
כך העומס הוא לא ממש פשוט, אבל תן לי להמשיך ולהלהיב
יישום מהיר באמת של עומס.
תן לי ללכת קדימה ואומרים מילות מילון מקבלת קובץ.
פונקצית הקובץ ב-PHP פתחה קובץ
ואתה חוזר למערך של כל מילים שבקובץ,
רק מושיט לך אותם.
זה היה כאב גדול מדי, לא?
עכשיו foreach, זה המבנה החדש שלנו, foreach ($ מילים כמילת $).
לולאה זה הולך להתחיל iterating על מילות המערך
ולהקצות למילה משתנית $ כל מילה בקובץ
מהראשונה לשני לשלישי לרביעים את כל הדרך
כך שאני לא צריך לעשות [i] כיתוב המעצבן ואוהבים.
ומה שאני פשוט הולך לעשות לכל אחת ממילים אלה
הוא לאחסן אותו בשולחן שלי על ידי יצירת אינדקס לטבלה
ואז עושה נכון כי לזכור
שמילה נמצאת במילון שלי כל מה שאני באמת צריך לעשות
הוא סוג של להעיף קצת ולומר את המילה הזו בטבלת החשיש שלי היא שם, נכון.
ואם זה לא שם, אין לי במפורש לשים שווא,
אחרת הייתי צריך לשים שווא לכל המילים האפשריות ביקום.
>> די לי רק כדי להגדיר ערך מדד
לנכון גם אם מילה היא למעשה בשולחן החשיש שלי.
עכשיו, אני חותך כמה פינות כאן שאני אניף את הידות שלי בעכשיו,
אבל עכשיו פונקצית העומס נעשתה.
אני טוען את כל המילים מהקובץ לתוך מערך.
אני לחזר על שהמערך, ועבור כל מילה במערך
אני מחבר אותו לשולחן החשיש שלי עם קו 1 של קוד.
זה כיף. אתה יודע איך אנחנו יכולים ליישם את הגודל עכשיו?
ובכן, גודל הוא תמיד די קל, בהגינות.
כאן אנו יכולים פשוט להחזיר ספירה של שולחן.
זה די קל מדי, לספור את מספר הדברים בטבלה.
זה בעצם סוג של לא יעיל ביותר.
אני כנראה צריך להיות בגודל משתנה בשם כדי שנוכל לעשות את זה
בזמן קבוע, אבל זה די קל.
אה, ולאחר מכן לפרוק, אם אנחנו באמת רוצים להיות כאן אנאליים
אנו יכולים לומר כי ככה אתה פורק משהו.
אתה פשוט להגדיר משתנה שווה למערך ריק,
והוא נפטר מכל מה שהיה שם.
אין הצורך להתקשר חינם.
>> שוב, חתכתי כמה פינות, ואני מתנצל על סט בעיית ההקצאה 5
אולי ב-C, אבל אם אנחנו עכשיו הולכים קדימה ולהפעיל את זה,
אני הולך בעצם להפעיל את הגרסה שכתבתי מראש
רק כדי שלא יעשו טעויות תחביריות שהיא.
תן לי ללכת קדימה ולהפעיל איות. השימוש הוא זהה.
הנה קובץ מילון שמכיל רק את המילה foo.
כאן הוא קובץ טקסט המכיל רק foo בר.
בואו בדיקת איות, כך אית זה, באמצעות קובץ מילון זה בקובץ הטקסט הזה.
יש מילה אחת שגוי, בר, וזהו.
עשה עם pset 5.
בואו ניקח הפסקה של 5 דקות הליכה כאן, ואנחנו נחזור ויותר על PHP.
בסדר, אנחנו חוזרים.
בואו נעשה-שונאים אותי לזמן מה.
עכשיו בואו נראה אם ​​זה ממש לא היה חיובי
למעשה יישום הדבר הזה ב-PHP.
נכון, זה לקח 45 שניות ליישום.
>> אבל בואו נלך קדימה עכשיו ולנהל את העניינים.
תן לי ללכת קדימה ולהפעיל גרסת C
מאית, ושנריץ את זה על אחד מהקבצים הגדולים,
אשר תנ"ך.
וכי כאן הם בבואו נכנסנו לתיקיית C,
אית בקינג ג'יימס 5.
הרבה מילים באיות שגויה.
אוקיי, אז זה הפלט יכול להיות שעלית גם אם לעתים הם קצת שונים,
אם יש לך כל מה שעובד בצורה נכונה, ולכן זמן בסך הכל לבדיקת איות
תנ"ך היה .38 שניות, אז די טוב באמצעות יישום זה.
עכשיו תן לי ללכת לגרסת PHP, שאנחנו פשוט כתבנו.
תן לי לנהל את האיות בקינג ג'יימס.
אופס, טעות להתעלם מזה. אני בספרייה הלא הנכונה.
בודק איות בקינג ג'יימס 5.
כמעט סיימתי.
>> אוקיי, ההבחנה הדקה תבין שהייתה יותר מ 3 שניות שם.
זה זמן לפעול נכון.
מתברר שזה לוקח זמן לירוק הרבה טקסט מתוך
בגלל חציצת בעיות, אבל סיפור ארוך קצר,
שהיו 3.15 שניות של מכונת זמן, זמן מעבד,
לעומת מה שהיה זה לפני רגע?
כמו .3.
אני מתכוון, שזה סדר הגודל איטי יותר, אז איפה הוא כי
האטה מגוחכת מגיעה?
ובכן, כפי שקרה עם רוב כל החלטת עיצוב שעשינו
בכיתה במשך 9 השבועות האחרונים יש כמעט תמיד האיזון הזה.
לפעמים פשוט בין המרחב, לפעמים בין המרחב והזמן,
מרחב, זמן ומאמץ פיתוח, ואכן כאן, למרות
אנחנו הצלנו את כמות עצומה של זמן, אולי פוטנציאל 10-20-30 שעות
זמן פיתוח יישום בודק האיות
על ידי הצלפה אותו במרחק 45 שניות בשפה זו
המחיר שאנחנו משלמים הוא שזה סדר הגודל איטי יותר כתוצאה מכך,
וזה בדרך כלל קורה עם ביותר בכל שפה פרשה,
PHP, Python, Ruby, פרל או אחר לפיו
אם אתה הולך להפעיל אותו באמצעות מתורגמן ויש לו לקרוא את הקוד שלך
שורה אחרת שורה, מלמעלה למטה, משמאל לימין,
המתווך שהוא הולך לקחת קצת זמן משלו,
ומה שאת מרגישה כאן ב3 השניות לעומת 0.3 שניות
היא העובדה שיש מתווך שיש לו את זה, פשוטו כמשמעו, כדי לפרש את הקוד שלנו
שורה אחרת שורה, וחס וחליל אם אתה בתוך לולאה
עם קובץ ענק המכיל מאה אלף מילים.
>> שמעל הולך להוסיף ולהוסיף ולהוסיף ולהוסיף עד.
לכלי כזה זה כנראה לא השפה הטובה ביותר לשימוש עבור יישום
בודק איות אם מיידיות הוא לעניין את המשתמשים שלך ולך.
אבל יש לנו את המותרות ברגע היא אם אתה
להשתמש בשפה כמו PHP או הרבה שפות פורשו
בהקשר של האינטרנט, לצורך העניין, יש לך את היתרון
כי האינטרנט הוא הרבה יותר איטי מרוב המחשבים.
יש לך מעבד GHz במחשב שלך, 2 ג'יגה הרץ, אולי אפילו יותר בימים אלה.
אבל המציאות היא באינטרנט יש כמות גבוהה של מיסות
לפי לדפדפן לשוחח עם שרת, למרות שראינו בשבוע שעבר
שזה די מהר, חצי אלפית שני או כך,
גם מוסיף, ואם אתה מוריד דברים כמו תמונה
או תמונה לפייסבוק או לקבל הודעות מיידיות על פטפוט פייסבוק,
Gchat או כמו כל פעמים הללו הלוך
בין הדפדפן ותחילת השרת להוסיף עד,
מה שהופך את הבחירה הספציפית שלך של שפה במקרים רבים
לא כל כך רלוונטי, כך שאתה עדין באמצעות שפה קצת יותר איטית
כמו PHP או Python או Ruby
אבל עבורה יש upsides הענק לך ולעמיתיך
והחברים שלך, כי אתה יכול ליישם את הדברים כך, כל כך הרבה יותר מהר.
ויותר מכך, יש לך הרבה פחות סיכון לפגמי אבטחה מסוימים.
אין שום כיוונים ב-PHP.
אין שום תקלות SEG שאתה יכול בקלות לגרום
באותו אופן כמו בג
עם C אתה סופר קרוב לחומרה.
עם שפות PHP ודומות שאתה סוג של רמה גבוהה יותר, אם אפשר לומר כך,
עם הרבה גינות בינך ובין מה שבאמת קורה
בתוך המכונה, וזה רק איזון.
>> אנחנו הגענו לנקודה שיש שפות הבאות מודרניות יותר, ברמה גבוהה
כמו PHP בגלל הלקחים בשפות כמו PHP בג
אבל אם אתה לא מבין מה שקורה מתחת למכסת המנוע כל הזמן הזה
אתה בוודאי לא יכול לקבל את ההחלטות הנכונות בעיצוב,
ובוודאי כשזה מגיע לעבודה במקום כמו פייסבוק או גוגל
או כל אחד מהמקומות האלה שיותר ויותר משחק עם ערכות נתונים גדולים
גם אם תחזור ואל premed ועובדים עם חלק MD
על כמה נתונים גדולים להגדיר מעורב חולים ורופאים
וכמו שימוש בכלים הנכונים בהרבה מאוד משכנע
כי אחרת הניתוח של חלק ערכת נתונים שלך עלול לקחת שניות,
או שזה ממש עלול לקחת שעות.
זוהי רק דוגמה אחת, שלא לתסכל אותך במאמץ אחת כמה וכמה
זה היה ב C אבל כדי לעזור לך להבין שכאשר אתה ליישם משהו ב-C
אתה באמת מבין, או בתאוריה, באמת מבין
איך הכל או צריך לעבוד, ויש לך שליטה כמעט מלאה
על מה שקורה מתחת למכסת המנוע, ועם שפות ברמה גבוהות אלה
יש לך לוותר על שליטה רבה יותר לאנשים שהמציאו אותם
וכפוף יותר להחלטות העיצוב שלהם יותר משלך.
אבל אם אנחנו לוקחים כמובן מאליו שביצועים
הוא לא ממש חשוב כמו באינטרנט בגלל הבעיות האחרות האלה,
רק מהירויות רשת הן מעט איטיות יותר ממהירויות מעבד בכל מקרה,
כדי שנוכל למיין של להרשות לעצמו להשתמש בשפה קצת יותר איטית
אם upsides אנחנו יכולים לפתח דברים מהר יותר פי 10 או אפילו יותר.
>> בואו לראות איך אנחנו יכולים להתחיל להשתמש בזה.
תן לי ללכת לתיקייה
בין הדוגמות של היום נקרא frosh.ims,
וזה למעשה היה מוטיבציה אישית על ידי העובדה שהדבר הראשון
כתבתי לאינטרנט לפני שנים לאחר נטילת CS50 וCS51
היה אתר אינטרנט לתכנית IMs הפרוש, ספורט כיתה ט ביצוע עצמי,
אשר בשלב זה היה לפני מספיק שנים כי בעת
אין אתר אינטרנט לתכנית, אף שלא היה אינטרנט,
ובמקום שיש משגיח בWigglesworth שלפיו אם אתה רוצה
להרשמה לכדורעף או כדורגל או מה שאתה יכול למלא את פיסת נייר.
אז היית חוצה את החצר.
אז היית דופק על הדלת והחלקה בדלת או את ידם למשגיח
פיסת נייר עם השם שלך על זה, אם אתה רוצה להיות קפטן קבוצה,
מה ספורט שאתה רוצה לעשות, ומה שהיית במעונות פנימה
זה היה סוג של דרך בית ספר ישנה של עשיית דברים, וזה היה ראש ממשלה
ההזדמנות להפוך הרבה של תהליך זה.
אפשר פשוט ללכת לאתר האינטרנט. אתה מקליד משהו פנימה
אתה מקבל אישור בדואר אלקטרוני, ובום, שתסיים.
>> זה היה הדבר הראשון שעשיתי, אם כי בשפה הנקראת פרל,
אבל זה יחסית קל לעשות ב-PHP, וזה סוג של נציג
מהבעיות שאתה יכול להתחיל לפתור כאשר אתה יכול להביע את עצמך
תכנות ולא צריך להסתמך על דברים כמו אתרי Google
או Excel או כלים שנמסרו לך.
אתם עכשיו יש את היכולת לעשות דברים כאלה.
זוהי גרסה מכוערת במיוחד של טופס,
אבל בואו פשוט להשתמש בו לתחילת השיחה לפי זה
בערך מה שנראית כמו צורה לפני שנים בשבילנו
כדי לאפשר לאנשים באינטרנט כדי להירשם לפרוש IMS.
בקשנו שם, תיבת סימון לאו אם הם לא רוצים להיות קפטן,
זכר או נקבה, ואז מה שהם היו במעונות,
ואז הם היו לשלוח טופס זה.
תן מבט של 1 מתחת למכסת המנוע בHTML שמייצג דף זה.
תן לי ללכת לfroshims0,
וכמאמר מוסגר, ל7 pset אני לוקח כמובן מאליו
הספריות והתיקיות שאני מכניס את הדברים פנימה
אנחנו ננחה אותך בדיוק היכן דברים צריך ללכת במכשיר,
שפקודות mod אתה צריך לרוץ, אז אל תדאג על כל
פרטים טיפשיים בסינכרון מהרגע הראשון כאן.
>> בסדר, הנה froshims0.php.
בואו לגלול אותי, ומה שמוזר כאן,
מדובר בקובץ PHP, אבל מה בתוכו, באופן ברור?
זה המון HTML, ואכן, המקור של PHP
באמת היו בשביל להיות שפת אינטרנט ממוקדת.
רגע לפני שאנו השתמשנו בו כדי ליישם את דוגמא הבירה,
התנאים לדוגמא, דוגמא שלום, וזה בסדר גמור.
אתה יכול להשתמש ב PHP כשפת scripting
שם תסריט הוא באמת רק המינוח שניתן לתכנית מהירה ומלוכלכת
או משהו שאתה כותב בתסריט או באופן כללי יותר שפה לפרש.
PHP היא סופר שימושי שמשום שראית כמה מהר
יחסית אנחנו יכולים להלהיב תוכניות ב-PHP.
אבל זה באמת היה מיועד לשימוש באינטרנט,
ומיועד לאינטרנט במובן זה שמבחין כאן בחלק העליון של הקובץ
אני מתחיל עם <? PHP.
אז יש לי חבורה של הערות חסרות תועלת, שהוענקו, אבל אז אני סוגר מצב PHP.
אבל אז אני שוקע במצב HTML.
>> מה שמעניין בPHP הוא על אף שהקובץ מסתיים ב. php
זה אמור בדרך כלל להיות שותף התערבב-עם HTML,
איזה קוד PHP, קצת HTML.
ואנחנו נראים סופו של דבר שאנחנו יכולים להתחיל להקניט אלה בנפרד
ולשמור בנפרד HTML שלנו מPHP לגמרי,
אבל את המקורות של PHP באמת היינו נותנים לך את הגמישות הזאת,
שאם אתה רוצה קצת HTML פשוט לכתוב את זה, וזה יהיה
לירוק זהה לדפדפן.
אבל אם אתה צריך קצת טכניקת תכנות,
קצת קוד תכנות, אתה יכול גם לשים אותו לתוך אותו הקובץ המדויק, כפי שמייד תראו.
הנה HTML שלי.
יש לי תואר הזה לפרוש IMS.
יש לי תג גוף שיש לי חלק בזה CSS לכל מרכז באמצע,
ואז יש לי כאן בצורה שכנראה הולכת להיות מוגש
לקובץ חדש בשם register0.php, ולכן אנחנו רואים את זה ברגע.
זה באמצעות שיטה הנקראת הודעה, שאנחנו נחזור גם.
אז יש לי כמה כניסות טופס, שם אחד שנקרא, סוג שלו הוא טקסט,
אחד ששם הוא קפטן, סוג שלו היא תיבת סימון,
וזה, שלא ראו את זה לפני, אבל זה בדיוק מה שזה אומר.
אתם תקבלו תיבת סימון במקום תיבת טקסט.
כאן למטה יש לך כפתור רדיו, שהוא אחד מהכפתורים העגולים האלה
כי אתה יכול לבחור אחד זה או אחר.
>> שים לב שזה מכוון שנתתי שני כפתורי הרדיו את שמו של מין.
זה איך אתה מקבל הרחקה הדדית לפיה עליכם ללחוץ
או זה או שאחד, ועל ידי לחיצה על השני
זה unchecks אחר, אז אתה צריך לתת להם אותו שם
אם אתה רוצה שהם יהיו סותרים כזה.
ולאחר מכן למעונות, אני לא חושב שראינו את זה עדיין, אבל זה תפריט בחירה, תפריט נפתח.
התג לכך הוא בחירה.
לאחר מכן עליך לתת תפריט הנפתח שם,
ואז יש לך חבורה שלמה של אפשרויות אלה.
בשלב הראשון, רק לאסתטיקה, הוא מחרוזת ריקה.
רציתי רק את הירידה כריקה כברירת מחדל,
ואז יש Apley, Canaday, אפור, וכן הלאה.
ושים לב לדיכוטומיה כאן.
האפשרות בנפתחת יש ערך,
אבל אז יש לו שם ידידותי לאדם, שבדוגמה זו
זהה, אבל אם אנחנו באמת רוצים להיות אנאליים יכולים להיות לנו
הערך של נפתח זו פשוט להיות גרסה הקצרה,
אפור, אבל אנחנו יכולים לומר באמת אפור הול שהאדם בעצם רואה,
אבל זה לא כל כך מעניין, אז אני פשוט עושה את זה פשוט והפכתי אותם זהה.
ואז למטה בתחתית יש לנו כפתור שליחה
אשר שראינו בעבר, אבל שמנו לב שאני פשוט נתתי לזה מילה אחרת.
במקום CS50 חיפוש נתתי את התווית "הרשמה".
>> התוצאה הסופית היא זה דף אינטרנט כאן, ושוב,
איפה זה מקבל הוגש ל?
הוא מקבל שהוגש לקובץ מסוים, הערך של תכונת הפעולה,
שהיה register0.php.
בואו לראות מה באמת קורה כאן.
תן לי ללכת קדימה ולמלא טופס זה, אומר דוד,
זכר, מתיוס, ואז אני אגיד את ההרשמה.
בואו להגדיל אותי החוצה ולחץ על הרשמה.
אוקיי, אז סוג של טעם, אבל בואו נראים מה באמת קורה.
שימו לב שכתובת האתר השתנתה להיות register0.php.
מה הוא סקרנות נעדרה מכתובת האתר, אם כי, למרות שאנחנו פשוט הגשנו את הטופס?
[תגובת תלמיד לא נשמעה]
אוקיי, זה פשוט משתמש להיות Chrome ידידותי בימים אלה.
זה ממש שם. הם פשוט להסתיר אותו כדי לחסוך מקום.
אבל מחשבה טובה, מחשבה טובה.
לקראת הקצה השני של כתובת האתר, אם כי, מה חסר? כן.
[סטודנטים] מחרוזת השאילתה.
מחרוזת השאילתה, כך זוכרת מדוגמאות החיפוש של Google הפשוטות שלנו.
ברגע שאני לוחץ על כפתור שליחה את כתובת האתר
לקח אותי לגוגל, אבל אז לא היו? q = מדעי מחשב או מה שהקלדתי פנימה
זה בגלל שהשתמשנו בשיטה מקבלת עם דוגמא החיפוש.
>> הפעם אנחנו משתמשים בשיטה מה במקום?
הודעה, ואחת ההבחנות המיידיות
בין לקבל ולפרסם פוסט שלא מעמיד את הקלט של המשתמש ב-URL.
היא מסתירה אותו. זה עדיין שולח אותו.
למעשה, מה שאנחנו רואים בדפדפן כאן, כפי שנגלים ברגע
על ידי התבוננות בregister0, הוא שאני פשוט רואה את התוכן
במערך שהוגשו מהדפדפן לשרת.
אבל את כתובת האתר לא חייבת?, אין שום מילות מפתח
או ערכים בזה, ולמה זה?
ובכן, הודעה מאפשרת לך עדיין לשלוח נתונים מהטופס לשרת,
אבל זה לא שם אותו ב-URL, אז איזה סוג של מידע הוא הודעה
מתאים במיוחד לאולי כשאתה שואל את המשתמש
הקלד בקלט לטופס?
משהו כמו סיסמא, משהו כמו מה עוד?
מספרי כרטיסי אשראי.
כל דבר שהוא מעט רגיש אתה בטח לא רוצה לגמור בכתובת האתר
אם רק כי זה אומר שהשותף שלך או בן משפחה יכול פשוט לחפור ב
ההיסטוריה שלך באינטרנט ולאחר מכן, פשוטו כמשמעו, לראות את הסיסמות שלך,
פשוטו כמשמעו, לראות את מספרי כרטיסי האשראי שלך, כי רוב הדפדפנים
זוכר בהיסטוריה כל כתובות אתה כבר בבית,
כך שאם רק בגלל שזה יהיה רעיון לא רע.
שימוש בעורות הודעה שפרטים מהמשתמש.
>> כמו כן, איך אתה להעלות תמונה לפייסבוק?
ובכן, את 2 מנגנונים היחידים שאתה באמת יכול להשתמש,
למרות שיש כמה אלה יותר מסתוריים אחרים, לקבל ולפרסם.
איך אפשר בכלל אפשר להעלות תמונה דרך כתובת אתר?
למעשה אתה יכול לעשות את זה.
אתה יכול לקחת JPEG או מפה סיבית או GIF ואתה יכול לייצג אותו בקסדצימלי
או משהו שנקרא בסיס 64.
במקום בסיס 16 אתה משתמש בבסיס 64, שלמעשה נראה כמו
תווי ASCII, ולמעשה אתה יכולים להעלות תמונה דרך ה-URL
אחרי סימן שאלה, אבל יש בדרך כלל מגבלות גודל.
רוב הדפדפנים לכפות כתובות להיות לא יותר מ -1,000 שחקנים,
אולי 2,000 תווים או דומיהם, ולכן אינך יכולים להעלות
10 MB פייסבוק תמונה.
בשביל זה אתה משתמש בהודעה, כמו גם, אז לעת עתה מקבל מכניס את הפרמטרים ב-URL,
וזה נחמד ושימושי לפעמים, אבל לכל דבר רגיש או גדול
הודעה היא הדרך ללכת.
מה register0 בעצם עושה כאן?
ובכן, אם אני פותח את ההודעה register0 שזה הוא דף סופר פשוט,
אבל זה ממחיש את העובדה שאני יכול לשתף להתערבב, לטוב או לרע,
HTML עם PHP.
כל הקובץ הזה, פרט להערות בראש, הוא HTML
חוץ מהבחור הזה כאן.
>> שים לב באמצע קוד PHP שלי,
באמצע HTML שלי, יש לי סוג של באופן זמני
נכנס למצב של PHP.
אני קורא לפונקציה מיוחדת הנקראת ההדפסה r.
זה אומר להדפיס רקורסיבית, ומה שהיא עושה זה מדפיס באופן רקורסיבי
כל מה שמשתנה אתה מוסר אותו, פסיק, מצב יציאת PHP.
והתג מראש נותן לך טקסט מעוצב מראש,
טקסט מרחב מונים, כך שכל מקום שאתה באמת רואה את זה.
זה לא ייעלם. מהי הודעה?
ובכן, מה שמעניין ומשכנע על PHP
הוא שכל פעם שאתה שולח טופס באמצעות לקבל או לפרסם
ומה שהוגש לך על ידי דפדפן
PHP עצמו דמוי מה זוגות ערך המפתח הללו,
דמויות לבדוק אם יש סימנים שווים, דמויות לבדוק אם יש סימן שאלה.
זה עושה את כל העבודה הקשה לך, ואז זה נותן לך מערך אסוציאטיבי
המכיל את כל מה שמשתמש הקליד בטופס.
ובכן, מה עשה שדות טופס זה יש?
>> היה לו 4 שדות.
אחד היה שדה טקסט בשם שם.
אחד מהם היה תיבת סימון שנקראה קפטן.
אחד מהם היה כפתור רדיו בשם מין,
ואחד היה תפריט נפתח נקרא מעונות,
כל כך שם לב כשאני מדפיס באופן רקורסיבי
את תוכנו של המשתנה המיוחדת הזה.
זה משתנה גלובלי מיוחד שנקרא פשוטו $ _POST, בכל הכמוסות.
זה משתנה גלובלי מיוחד שPHP רק יוצר עבורך
וידות אליך, כך שאתה יכול לגשת לכל הדבר
שהוגש באמצעות טופס על ידי משתמש.
ועל ידי התקשרות r הדפסה עליו, לא היית עושה את זה ביישום רגיל.
אנחנו עושים את זה כדי לראות בפנים של משתנה זה,
ומה שבתוכו, טוב, 4 מפתחות,
4 פרמטרי http, אם אפשר לומר כך,
שם, קפטן, מין, מעונות, ולאחר מכן את הערכים שהמשתמש
הקליד בלמעט במקרה אחד.
עשיתי סוג D--V-I-D.
למרות שבדקתי את התיבה,, לגבר, כנראה שהגיש את ערך
מסתם מ 'להיות תמציתי.
>> כשנבחרתי מתיוס זה הערך שנבררו,
ואת זה הוא קצת טיפשי, אבל זה האמנה.
כאשר בדקתי את התיבה, ערך על, "על", קבל הוגש לתיבת הסימון.
אם לא בדקתי את זה, אין שום ערך היית נשלח כלל.
זה רק נותן לנו תובנה לתוך מה שבפנים של המשתנה הגלובלי המיוחד הזה,
וזה כל כך מיוחד שהיא נקראת במשתנת סופר גלובלית.
היא קיימת בכל מקום בשבילך בתוך הקוד שלך, כך שאתה ממש יכול לגשת אליו.
זה לא שמשכנע, אז בואו באמת להשתמש הגלובלי הסופר
ובעצם מנסה לרשום למישהו.
בfroshims1 אני הולך לעשות שינוי אחד.
אני משנה את הפעולה להיות register1.php,
ואני עושה עוד דבר אחד.
אני היה סוג של נבוך מהאיכות של דף האינטרנט שלי שם.
זה די מחריד, בכנות, כך מתברר
כי אתה יכול להשתמש בקלות באינטרנט
של אנשים אחרים קוד JavaScript, CSS של אנשים אחרים
שהן כתבו ופתחו את הקוד ונעשתה זמינים כספרייה,
אם אפשר לומר כך, ולמשל, כאן אני משתמש בספרייה זמינה באופן חופשי,
חבורה של קוד שמישהו אחר כתב.
>> טוויטר במקרה כתב את הקוד הזה, וזה נקרא ספריית bootstrap,
וזה פשוט חבורה של גיליונות סגנון CSS, צרור. קבצי css
שמישהו אחר כתב והבין איך להשיג הכל נחמד ויפה
כך שאנשים כמונו יכולים לדאוג קצת פחות על אסתטיקה ולהתמקד הרבה יותר
על ההיגיון ותכנות בפועל.
על ידי קישורו עם שהתג, המהווה את אותו התג הייתי זכור לstyles3.css קודם לכן,
עכשיו יש לי גישה לקובץ שנקרא bootstrap.min.css.
דקות רק אומרות שהם כבר minified זה והם שנפטרים מכל החלל הלבן וכן הלאה
רק כדי לוודא שהם לא שולחים לי יותר בתים ממה שאני ממש צריך.
אבל יש בקבוצה שלמה של CSS, אז אם אני עכשיו פותח את הגרסה 1 של הפרוש IMs
שם לב שהקובץ שלי הוא בהחלט יפה.
עכשיו זה עדיין רק שחור ולבן, אבל שם לב שרק על ידי שימוש גיליון הסגנון שלהם
ושימוש בתכונות מסוימות שלה על הטופס שלי זה לא מדהים,
אבל זה בהחלט נקי יותר ממה שהיה בעבר, והמקרן לא עושה את זה צדק.
יש קווים אפורים קטנים מסביב לכפתורים וסביב שדה הטקסט ממש כאן,
אבל זה בהחלט נקי יותר ממה שהיה לפני.
>> עכשיו, בהגינות, אני לא צריך לשנות את הסימון שלי קצת.
זו היא גרסת 1, ושים לב שאני השתמשתי כמה תגים חדשים,
ובכנות, לא היה לי מושג איך לעשות את זה עד שקראתי את התיעוד
לספריית bootstrap של טוויטר, והם אמרו לי שאם אתה רוצה להשתמש בספרייה שלנו
להשתמש באלמנט בתוך קבוצת שדות הטופס שלך,
לשים את המילה שאתה רוצה להראות לצד בתוך שדה של תג תווית,
ואז לתת את הקלט שלך שם, בדיוק כמו בעבר,
ולאחר מכן לתיבה, לא רק שאתה עוטף אותו באלמנט תווית,
אתה משתמש במשהו שנקרא בכיתה, ולכן אנחנו לא ראינו את זה בעבר,
אבל אתה רואה את זה באחד מכנסיים הקצרים של pset 7.
כיתה בCSS מאפשרת לך לעשות משהו דומה מאוד לזיהוי,
אבל לפני שהיינו לנו זהות עם הסמל #
שזה היה אחד ורק אלמנט אחד.
מה שנחמד בכיתה הוא שמספר אלמנטים יכולים להיות באותה הכיתה
או אותו חומר CSS להחיל את זה.
>> אבל שוב, נוסף על אלה בטווח הקצר, ושאר זה פשוט להעתיק ולהדביק
מהתיעוד שלהם שבו אני הוספתי תווית פה ושם.
ובסופו, משום שצרפתי את תג הקישור בראש,
הכל נראה יפה יותר באופן אוטומטי
פשוט על ידי כך שסמן את הדף שלי באופן ש
טוויטר צפוי, ויש כל כך הרבה דרכים שונות
לעשות את זה, וזה אכן מאוד מתאים.
בשלב זה של הסמסטר, כפי שתראה במפרט של pset 7,
Googling בסביבה, לקרוא על ספריות, באמצעות CSS של אנשים אחרים
וJavaScript כדי לפתור את בעיות נלוות
כדי להגדיר את הבעיה עצם בהחלט מעודדת והיא הדרך
האינטרנט בנוי בימים אלה, על ידי שעמד על כתפיהם של אנשים אחרים
כך שאתה באמת יכול להתמקד בבעיות החדשות ומעניינות.
אבל בואו נתמקד עכשיו, שוב, את ההיגיון.
>> זה היה עיקוף מהיר על אסתטיקה, רק כדי להראות לך את הכיוון שבו אתה יכול ללכת.
אני הולך לחזור למכוער יותר אחד לעכשיו רק בגלל
אין שום סח דעת עם דברי טוויטר, ותנו לי ללכת קדימה, לפתוח את
froshims2, ששוב, נבדל בפעולה, register2.php,
ובואו נסתכל על מה שההשפעה היא כאן.
תן לי ללכת קדימה והקלד בדוד.
אני לא אהיה קפטן זה זמן.
אני אגיד את הזכר, מתיוס, פנקס.
לעזאזל. אוקיי, זה בורג על החלק שלי.
Stand by.
Register2, 22 קו, אם ריק או מצטער.
בואו לטעון מחדש.
אוקיי, על שליחת טופס זה מה בדיוק קרה?
אני הקלדתי בדוד, בדק זכר, לחץ מתיוס, פנקס.
אתה רושם. (טוב, לא ממש.)
זה ברור צעד מעבר פשוט מדפיס את תוכנו של משתנה כלשהו,
אבל מה שהקובץ הזה בעצם עושה?
בregister2.php
שם לב שיש לי קצת קוד חדש.
בתוך תג הגוף שלי יש לי בעצם אם אחר לבנות,
אבל בגלל שאני אשתף מתערבב זה עם קצת HTML
יש לי להיכנס ולצאת ממצב PHP קדימה ואחורה, אז בואו לראות מה אני עושה.
>> בשורה הראשונה כאן שאני אומר אם זה המקרה
שהודעת הסופר הגלובלי ריק למפתח של שם,
כך במילים אחרות, אם המשתמש לא נתן לי ערך לשם בצורה,
לאחר מכן רוקן הולך לחזור נכון כי את הערך ריק.
או להבחין בפסים האנכיים, אם מין ריק
בתוך הסופר הגלובלי המיוחד הזה, ששוב, מייצג את תוכן הטופס,
או המעונות ריקות, אז אני הולך קדימה וצועק על המשתמש.
איך? ובכן, שם לב שאני עומד לומר לך לספק את שמך, המין, והמעונות.
בואו בעצם לגרום את הטעות הזאת.
תן לי לחזור לצורה שלי. תן לי לטעון מחדש כדי לנקות אותה.
ואני רק הולך לתת להם דוד, והם לא צריכים לדעת איפה אני גר.
הרשמה. כנראה שאני צריך להגיד להם איפה אני גר.
עליך לספק שם, המין והמעונות שלך. חזור.
>> ואני יכול ללחוץ כדי לחזור לצורתו, אך מדוע זה כך?
ובכן, במקרה שהשם לא היה ריק, אבל היה מין, והמעון היה,
כך כל הביטוי זה הוערך לנכון, ולמרות שהתחביר הוא קצת חדש,
שוב, אנחנו נכנסים למצב PHP ומוכר אם הצהרה,
אבל החלק החדש כאן הוא רק זה מעי גס, ואני פשלתי ידי השמטת סוגריים
במקרה, שלא להבחין במעי הגס, וזה אומר
למרות שאנחנו יוצאים כל מצב PHP
העוקב יש לירוק את המילה במילה לדפדפן
עד שתראה בלוק אחר, כפי שאנו עושים כאן,
בכל מקרה אתה צריך במקום לירוק את זה
עד שתראה את endif, אז כמה מעט תחביר חדש
שמאפשר לי לעבור בין HTML ו-PHP.
אנחנו יכולים לנקות את זה סופו של דבר, אך לעת עתה,
זה סוג של דרך משכנעת של בדיקת שגיאות בטופס.
>> עכשיו, אני אומר לך לא באמת נרשמתי, כי ברור שלא עשיתי דבר, אלא את הנתונים,
אז בואו באמת מנסה לעשות משהו מגניב.
בfroshims3 ההבדל היחיד הוא שאני הולך להגיש לregister3,
כך HTML יש את אותו.
בregister3 יבחין זה.
זה אחד הוא סוג של סקסי.
בראש אני משתמש במשפט דורש, אז זה כמו תכלול #.
הפעם זה לא stdio.h או משהו כזה.
זה ספריית PHP, וזה נקרא PHPMailer.
איך אני יודע בדיוק לכולל מחרוזת צוטטה?
קראתי אותו בתיעוד, ולכן כאשר הם אמרו לי לשים את זה בחלק העליון של הקובץ
אם ברצונך להשתמש בספרייה מיוחדת הנקראת PHPMailer שעושה מה שהוא אומר.
זה מאפשר לך לשלוח דוא"ל דרך PHP.
עכשיו בואו לגלול למטה עוד יותר.
>> שים לב להתחיל אני במצב PHP כל הזמן הזה,
אז עכשיו שם לב לכאן לאחר היבוא שהספרייה,
כביכול, אני עושה כמה בדיקות שפיות.
אם זה המקרה שהשם אינו ריק
והמגדר אינו ריק להבחין בסימני קריאת נקודות
ומעונות אינן ריקות, ואז המשתמש מלא את הטופס באופן הגיוני, לפחות מספיק.
לא אכפת לי אם הם קפטן או לא. אני רק צריך את השם שלהם, מין, ומעונות.
אם הם מלאו אותם החוצה כך שאף אחד מהתחומים האלה הם ריקים
זה מעט תחביר חדש.
PHP, כדרך אגב, הוא שפת תכנות מונחה עצמים
שחלק מכם אולי זוכר מרכבים ממוגנים או כדומים.
לעת עתה, אם לא מוכר, רק יודע שכדי להשתמש בספרייה זו
אתה צריך לכתוב שורת הקוד כמו זה באמצעות מילת מפתח חדשה,
ממש מילת מפתח חדשה בשם חדש.
אבל מעבר לכך, יש לנו כמה תחביר מוכר.
זה מפעיל חץ, שהוא דומה למה שנהגתי לstructs בהקשר של מצביעים.
להיום PHP אין מצביעים,
אך אני יודע שעכשיו בתוך של המשתנה האלקטרוני
הוא למעשה סוג של מצביע לספרייה מיוחדת
שמישהו אחר כתב, ואם אני רוצה לגשת פונקציונלי ספציפי
בתוך הספרייה שאני, כמו ב-C, להשתמש באופרטור החץ,
למרות שלא מדובר בעצם מצביעים.
זה סוג של גרסתם של PHP עצמו.
פירושו של הדבר ללכת לספרייה ולקרוא את פונקצית IsSMTP.
SMTP, כזכור, מהלוחמים שלנו נקי מתייחס לדוא"ל,
וזה רק אומר ששימוש בשרת דואר אלקטרוני עבור פרוש IMs רישום זה.
>> מה מארח אני רוצה להשתמש?
ובכן, הרווארד, אם גוגל מסביב, יש שרת הדוא"ל נקרא smtp.fas.harvard.edu.
אם אתה משחק יחד בבית או שאתה חי על Comcast רשת
זה יכול להיות משהו כמו smtp.comcast.net.
זה לגמרי תלוי איפה אתה גר ומי ספק האינטרנט שלך הוא.
אחרי זה אני הולך להגדרה שלי מכתובת באופן שרירותי להיות jharvard@cs50.net.
אז אני הולך להגדיר את הכתובת כדי להיות jharvard@cs50.net.
הדרך היחידה שאני מכיר שפונקציות אלה נקראו SetFrom וAddAddress
הוא, שוב, אני קורא את התיעוד.
זה לא סוג של הקסם ידוע לכל המתכנתים.
אז אני קובע לנושא "רישום".
ועכשיו הקו הזה הוא קצת מכוער משום מה מפעיל הנקודה מתכוון ב-PHP?
מישהו יודע?
לשרשר.
ב C זה כאב בצוואר כדי לשרשר 2 מחרוזות יחד.
אתה צריך להתמודד עם malloc או realloc או כל הדברים האלה
רק כדי להאריך את אורכו של חוט.
ב-PHP, ב-JavaScript ובשפות אחרות
אתה בדרך כלל יכול לעשות את זה עם תו בודד.
במקרה זה, משמעות הדבר היא לקחת נקודת מחרוזת זה כאן
ולצרף אליו זה מחרוזת.
>> אה, ודרך אגב, אותו יש לצרף למחרוזת זו,
אשר קורה להיות בתוך משתנה הגלובלי שהסופר.
ואז לצרף אותו לשורה חדשה, כך שכל הנקודות האלה רק אומרות
לשמור על מה שהופך גדולה יותר ויותר ויותר גדולה מחרוזת,
ואתה לא צריך לדאוג בכלל על malloc או כמו בלשון כזאת,
ויש דרכים אחרות לעשות את זה, אבל זה הוא אחד המהיר ביותר
דרכים סכמה את זה.
מה זה עושה?
זה יוצר גוף מייל שהולך להגיד שם: קפטן: מין: Dorm:
, ואז לבסוף, כל בשורות נפרדות
שורה אחת של קוד, ואני הולך להתעלם מזה לעת עתה.
אם == שווא רק אומר שאם משהו ישתבש,
אבל הקסם שקורה כאן.
שלח דואר הפירוש לשלוח דוא"ל זה.
בואו לראות מה התוצאה הסופית היא.
בתחתית הקובץ, שים לב שזה הולך אומר שאתה רושם באמת
אם אני מקבל כל כך רחוק.
אם, לעומת זאת, ברגי המשתמש עד, שים לב שאנחנו התחלנו בזה
אם מצב כאן, אם הוא לא ריק ולא ריק
ולא רוקנו לשלוח את הדואר.
אחר אנחנו הולכים לשלוח את שורת קוד הזאת,
שהוא הולך להיות השפעה, כפי שתראה ב7 pset, של הפניית המשתמש
חזרה למקום ממנו בא, froshims3.php.
>> תחזיק אצבעות, אחר זה הולך להיות ההדגמה המאכזבת ביותר כיום.
הנה אנחנו מתחילים.
תן לי לפתוח את תיבת הדואר הנכנס שלי הדוא"ל שלי לjharvard ב-Gmail.
אין דוא"ל עכשיו. בסדר.
עכשיו בואו תפתחו אותי froshims3, המהווה את הדוגמא השלישית ואחרונה אנחנו מסתכלים כאן.
אוקיי, הנה זה בא.
נייט, הוא יהיה קפטן, זכר, מ, נגיד, Apley.
הרשמה. אוקיי, אתה רושם באמת.
עכשיו, אם אני לגלול מעל לדוא"ל שלי, הו, אלוהים שלי.
יש לי רק באופן דינמי נשלח דואר אלקטרוני באינטרנט.
>> בואו נשאיר באווירה שכזו.
וידאו הוא קרוב להרצאה שפספסנו. להתראות בשבוע הבא.
[CS50.TV]