לוגו אתר Fresh          
 
 
  אפשרות תפריט  ראשי         אפשרות תפריט  מבזקים     אפשרות תפריט  צור קשר     חץ שמאלה ‎print ‎"Hello World!"; if‎ ‎not rules.‎know ‎then rules.‎read(); חץ ימינה  

לך אחורה   לובי הפורומים > מחשבים > תכנות ובניית אתרים
שמור לעצמך קישור לדף זה באתרי שמירת קישורים חברתיים
תגובה
 
כלי אשכול חפש באשכול זה



  #1  
ישן 30-10-2015, 08:29
צלמית המשתמש של ShoobyD
  ShoobyD מנהל ShoobyD אינו מחובר  
מנהל משבראש, בלשנות, תכנות ויהדות
 
חבר מתאריך: 04.06.06
הודעות: 32,994
שלח הודעה דרך MSN אל ShoobyD Facebook profile LinkedIn profile Follow me...
סרט איך JavaScript באמת עובדת: על ה־event loop + חידה

בהנחה שאנו מכירים כבר את השפה, איך בת׳כלס עובד המנוע שמריץ אותה (ומה שמסביבו)?
[ספציפית פעולות אסינכרוניות]


אבל קודם כל.. חידה:
מה יקרה אם נריץ את הקוד הבא, ולמה?
קוד PHP:
 for ( var i=0i<5i++ )
    
setTimeout( function() { console.log(i) }, ); 
כלומר לולאה שקוראת לפונקציית הדפסת האינדקס הרץ, עם השהיית זמן אפסית.
האם התוצאה תהיה זהה תמיד?

ואם הגבול העליון יהיה גדול יותר, זה ישנה משהו?
קוד PHP:
 for ( var i=0i<500i++ )
    
setTimeout( function() { console.log(i) }, ); 

ומה יקרה אם נתעסק באינדקס הרץ i בתוך הלולאה?
קוד PHP:
 for ( var i=0i<50i++ )
    
setTimeout( function() { console.log(i--) }, ); 

ומה אם לגמרי נשתגע?
קוד PHP:
 for ( var i=0i<50i++ ) {
    
setTimeout( function() { console.log(i--) }, );
    
console.log(i);


הסרטון הבא מסביר איך בג׳אווה סקריפט מתנהלים מחסנית הקריאות (call stack), תור המשימות, טיפול באירועים וכו׳.


לצפייה במקור באתר Vimeo, לחצו כאן.
כעת נוכל גם להבין את תוצאות כל דוגמאות הקוד לעיל.


נערך לאחרונה ע"י ShoobyD בתאריך 31-10-2015 בשעה 17:43.
תגובה ללא ציטוט תגובה עם ציטוט חזרה לפורום
  #2  
ישן 12-11-2015, 20:19
צלמית המשתמש של פסטן
  פסטן פסטן אינו מחובר  
 
חבר מתאריך: 14.12.09
הודעות: 9,648
בתגובה להודעה מספר 1 שנכתבה על ידי ShoobyD שמתחילה ב "איך JavaScript באמת עובדת: על ה־event loop + חידה"

ציטוט:
במקור נכתב על ידי ShoobyD
אבל קודם כל.. חידה:
מה יקרה אם נריץ את הקוד הבא, ולמה?
[INDENT]
קוד PHP:
 for ( var i=0i<5i++ )
    
setTimeout( function() { console.log(i) }, ); 
כלומר לולאה שקוראת לפונקציית הדפסת האינדקס הרץ, עם השהיית זמן אפסית.
האם התוצאה תהיה זהה תמיד?

ואם הגבול העליון יהיה גדול יותר, זה ישנה משהו?
קוד PHP:
 for ( var i=0i<500i++ )
    
setTimeout( function() { console.log(i) }, ); 

ומה יקרה אם נתעסק באינדקס הרץ i בתוך הלולאה?
קוד PHP:
 for ( var i=0i<50i++ )
    
setTimeout( function() { console.log(i--) }, ); 

ומה אם לגמרי נשתגע?
קוד PHP:
 for ( var i=0i<50i++ ) {
    
setTimeout( function() { console.log(i--) }, );
    
console.log(i);



קודם כל אנחש:

בקוד הראשון יודפס 5 פעמים 5.
בקוד השני יודפס 500 פעמים 500.
מאחר ומודפס אותו הדבר אין מה לדבר על סדר.
בהנחה שזו לא הייתה הכוונה אפשר להשתמש ב-let או לעשות ש-f תקבל פרמטר.

בקוד השלישי יודפסו המספרים מ-50 עד 1. אני מנחש שזה מאותה סיבה שלמעלה הודפס אותו מספר, ה-capture מתבצע by reference (או משהו כזה).

בקוד הרביעי יודפסו המספרים מ-0 עד 49 בלולאה. אחרי זה יודפסו המספרים מ-50 עד 1 ב-callback-ים כמו בקוד השלישי.

לגבי הסדר: שמעתי פעם שהסדר שבו נקראים כל ה-callback-ים הוא לפי הסדר שבו עושים להם queue, אבל שמעתי גם על מקרים שבהם קרו דברים מוזרים. נטען שזה באגים, אבל מאחר ולא קראתי את ה-spec ואני לא בקי בכל תועבת הווב הזאת אני לא בטוח האם זה נכון.

ראיתי את הסרטון. נורא. בבהתחלה לא רציתי לראות כי זה 20 דקות. מה נראה לך?
אחר כך אמרתי לעצמי אולי זה שווה את זה. ראיתי. לקח לו 5 דקות להסביר מה זה מחסנית קריאות.
גרוע. לפי ההסבר שלו זה צריך להיות בסדר הקריאות ל-setTimeout.

בדיקה: צדקתי ב-1-3. ב-4 משום מה הודפס 0 עד 49, אחרי זה undefined ואחרי זה 50 עד 1. נתתי לזה 2 דקות. לא הבנתי למה. אחכה להסבר.
_____________________________________
תמונה שהועלתה על ידי גולש באתר ולכן אין אנו יכולים לדעת מה היא מכילה(קרדיט למרשי)
אמר לה ינאי מלכא לדביתיה אל תתיראי מן הפרושין ולא ממי שאינן פרושין אלא מן הצבועין שדומין לפרושין שמעשיהן כמעשה זמרי ומבקשין שכר כפנחס

אמר פסטן: שניהם גרועים, אבל עדיף להיות טיפש מאשר שקרן.
תמונה שהועלתה על ידי גולש באתר ולכן אין אנו יכולים לדעת מה היא מכילה

תגובה ללא ציטוט תגובה עם ציטוט חזרה לפורום
  #5  
ישן 12-11-2015, 21:57
צלמית המשתמש של ShoobyD
  ShoobyD מנהל ShoobyD אינו מחובר  
מנהל משבראש, בלשנות, תכנות ויהדות
 
חבר מתאריך: 04.06.06
הודעות: 32,994
שלח הודעה דרך MSN אל ShoobyD Facebook profile LinkedIn profile Follow me...
בתגובה להודעה מספר 2 שנכתבה על ידי פסטן שמתחילה ב "[QUOTE=ShoobyD]אבל קודם כל....."

ציטוט:
במקור נכתב על ידי פסטן
לגבי הסדר: שמעתי פעם שהסדר שבו נקראים כל ה-callback-ים הוא לפי הסדר שבו עושים להם queue
למה אתה קורא "הסדר שבו עושים להם queue"?
ההכנסה לתור נעשית בידי המנגנונים של הדפדפן (מה שהוא קרא להם WebAPIs), והסדר יכול להיות שונה מסדר הקריאות לאותם מנגנונים.
אם נעשה לדוגמא:
קוד PHP:
 for ( var i=0i<5i++ ) {
    
setTimeout( function() { console.log(i) }, 2000 );
    
setTimeout( function() { console.log(i*2) }, 1000 );

אז ברור שה־timeouts עם i*2 יסתיימו קודם, ולכן ייכנסו לתור קודם, ולכן יודפסו למעשה חמישה פעמים 10 ואז חמישה פעמים 5.




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




ציטוט:
במקור נכתב על ידי פסטן
בדיקה: צדקתי ב-1-3. ב-4 משום מה הודפס 0 עד 49, אחרי זה undefined ואחרי זה 50 עד 1. נתתי לזה 2 דקות. לא הבנתי למה. אחכה להסבר.
האמת שגם פה צדקת.
זה לא באמת שמודפס undefined, זה פשוט הקונסול אומר לך מה הסקריפט מחזיר, שבמקרה זה הוא כלום.
[האם בכלל יציג זאת בת׳כלס תלוי בדפדפן שלך]
הקטע הוא שהקונסול מראה לך מה ערך ההחזרה לפני שמתבצעים ה־callbacks, ולכן פה הוא נדחף באמצע.

גם אם תעשה:
קוד PHP:
 console.log("hi"); 
יודפס:
קוד:
hi undefined
כי console.log לא מחזירה כלום.

ואם תעשה:
קוד PHP:
 console.log("hi"); x=17
יודפס:
קוד:
hi 17

אם, לעומת זאת, נדפיס את התוצאה לדף במקום לקונסול, באופן הבא:
קוד PHP:
 for ( var i=0i<5i++ ) { 
    
setTimeout( function() { document.write(i--) }, ); 
    
document.write(i); 

אז לדף יודפס 0123454321 בעוד הקונסול יראה undefined.


נערך לאחרונה ע"י ShoobyD בתאריך 14-11-2015 בשעה 01:30. סיבה: הזחות
תגובה ללא ציטוט תגובה עם ציטוט חזרה לפורום
  #6  
ישן 15-11-2015, 02:11
צלמית המשתמש של פסטן
  פסטן פסטן אינו מחובר  
 
חבר מתאריך: 14.12.09
הודעות: 9,648
בתגובה להודעה מספר 5 שנכתבה על ידי ShoobyD שמתחילה ב "[QUOTE=פסטן]לגבי הסדר: שמעתי..."

ציטוט:
במקור נכתב על ידי ShoobyD
למה אתה קורא "הסדר שבו עושים להם queue"?
ההכנסה לתור נעשית בידי המנגנונים של הדפדפן (מה שהוא קרא להם WebAPIs), והסדר יכול להיות שונה מסדר הקריאות לאותם מנגנונים.
אם נעשה לדוגמא:
קוד PHP:
 for ( var i=0i<5i++ ) {
    
setTimeout( function() { console.log(i) }, 2000 );
    
setTimeout( function() { console.log(i*2) }, 1000 );

אז ברור שה־timeouts עם i*2 יסתיימו קודם, ולכן ייכנסו לתור קודם, ולכן יודפסו למעשה חמישה פעמים 10 ואז חמישה פעמים 5.
לזה בדיוק אני מתכוון.
הבאת עכשיו שני מקרים קלים שבהם התוצאה די דטרמיניסטית - לקרוא מספר פעמים עם 0, ולקרוא פעם אחת עם 2000ms ופעם עם 1000ms. אבל הנה לך חידה בחזרה, בלי לבדוק, מה ידפיס הקוד הבא?
קוד:
for ( var i=0; i<50; i++ ) setTimeout( function(j) { console.log(j) }, (i%5)*1000, i );

והקוד הבא?
קוד:
for ( var i=0; i<50; i++ ) setTimeout( function(j) { console.log(j) }, (i%5)*100, i );

והקוד הבא?
קוד:
for ( var i=0; i<50; i++ ) setTimeout( function(j) { console.log(j) }, (i%5)*10, i );

והקוד האחרון?
קוד:
for ( var i=0; i<50; i++ ) setTimeout( function(j) { console.log(j) }, i%5, i );


עכשיו בדוק. אחרי זה הסבר.

ציטוט:
במקור נכתב על ידי ShoobyD
האמת שגם פה צדקת.
זה לא באמת שמודפס undefined, זה פשוט הקונסול אומר לך מה הסקריפט מחזיר, שבמקרה זה הוא כלום.
[האם בכלל יציג זאת בת׳כלס תלוי בדפדפן שלך]
הקטע הוא שהקונסול מראה לך מה ערך ההחזרה לפני שמתבצעים ה־callbacks, ולכן פה הוא נדחף באמצע.
כן, בסוף הבנתי את זה. נורא.
_____________________________________
תמונה שהועלתה על ידי גולש באתר ולכן אין אנו יכולים לדעת מה היא מכילה(קרדיט למרשי)
אמר לה ינאי מלכא לדביתיה אל תתיראי מן הפרושין ולא ממי שאינן פרושין אלא מן הצבועין שדומין לפרושין שמעשיהן כמעשה זמרי ומבקשין שכר כפנחס

אמר פסטן: שניהם גרועים, אבל עדיף להיות טיפש מאשר שקרן.
תמונה שהועלתה על ידי גולש באתר ולכן אין אנו יכולים לדעת מה היא מכילה

תגובה ללא ציטוט תגובה עם ציטוט חזרה לפורום
  #7  
ישן 16-11-2015, 01:56
צלמית המשתמש של ShoobyD
  ShoobyD מנהל ShoobyD אינו מחובר  
מנהל משבראש, בלשנות, תכנות ויהדות
 
חבר מתאריך: 04.06.06
הודעות: 32,994
שלח הודעה דרך MSN אל ShoobyD Facebook profile LinkedIn profile Follow me...
בתגובה להודעה מספר 6 שנכתבה על ידי פסטן שמתחילה ב "[QUOTE=ShoobyD]למה אתה קורא..."

ציטוט:
במקור נכתב על ידי פסטן
הבאת עכשיו שני מקרים קלים שבהם התוצאה די דטרמיניסטית
בכוונה בחרתי מקרים שבהם התוצאה דטרמיניסטית.
מי שלא מכיר את הקונספט של ה־event loop, עלול לטעות ולסבור שהיא אינה כזו, ולכן שאלתי על לולאה גדולה יותר.


ציטוט:
במקור נכתב על ידי פסטן
אבל הנה לך חידה בחזרה, בלי לבדוק, מה ידפיס הקוד הבא?
לכאורה היה אמור להיות מודפס בכולם המספרים בעלי שארית 0 מודולו 5 לפי הסדר (0, 5, 10, 15..), לאחריהם שארית 1, שארית 2 וכך הלאה.
אלא מאי, שזמן ההשהיה הולך וקטן עם הדוגמאות, כך שבשלב מסוים אמורים ה־timeouts לפוג ולהיכנס לתור עוד לפני שהלולאה מסתיימת, כך לדוגמא ה־timeout של 1 יסתיים עוד לפני שבכלל יתחיל ה־timeout של 5, ועל־כן יודפס לפניו.
כלומר לדעתי התוצאה פה לא תהיה דטרמיניסטית.

[בגלל זה בדוגמא שהבאתי לעיל, עם ה־i וה־i*2, קבעתי זמני השהייה יחסית ארוכים, אחרת הקביעה שם לא בטוח שהייתה מתקיימת]


נערך לאחרונה ע"י ShoobyD בתאריך 16-11-2015 בשעה 01:59.
תגובה ללא ציטוט תגובה עם ציטוט חזרה לפורום
תגובה

כלי אשכול חפש באשכול זה
חפש באשכול זה:

חיפוש מתקדם
מצבי תצוגה דרג אשכול זה
דרג אשכול זה:

מזער את תיבת המידע אפשרויות משלוח הודעות
אתה לא יכול לפתוח אשכולות חדשים
אתה לא יכול להגיב לאשכולות
אתה לא יכול לצרף קבצים
אתה לא יכול לערוך את ההודעות שלך

קוד vB פעיל
קוד [IMG] פעיל
קוד HTML כבוי
מעבר לפורום



כל הזמנים המוצגים בדף זה הם לפי איזור זמן GMT +2. השעה כעת היא 22:30

הדף נוצר ב 0.34 שניות עם 12 שאילתות

הפורום מבוסס על vBulletin, גירסא 3.0.6
כל הזכויות לתוכנת הפורומים שמורות © 2019 - 2000 לחברת Jelsoft Enterprises.
כל הזכויות שמורות ל Fresh.co.il ©

צור קשר | תקנון האתר