Results 1 to 10 of 10

Thread: loop for fn function always return last value

  1. #1
    Sencha User
    Join Date
    May 2013
    Posts
    25
    Vote Rating
    1
      0  

    Default loop for fn function always return last value

    some problem thing here
    Code:
    for (i =1; i<=4; i++) {
                        picturesListeners.push({
                            element: 'element',
                            delegate: 'div.img'+i,
                            event: 'tap',
                            fn: function() {
                                console.log(i);
                            }
                        });
                    }
    it always return 4 no matter which div img clicked. Anyone know why?

  2. #2
    Sencha - Community Support Team mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,023
    Vote Rating
    1334
      0  

    Default

    Where does the a variable get defined?
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Frontend Engineer
    ________________
    Need any sort of Ext JS help? Modus Create is here to help!

    Check out my GitHub:
    https://github.com/mitchellsimoens

  3. #3
    Sencha User
    Join Date
    May 2013
    Posts
    25
    Vote Rating
    1
      0  

    Default

    Opss, sorry it should be 'i' instead of 'a' here. But it's not the root cause..

  4. #4
    Sencha - Community Support Team mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,023
    Vote Rating
    1334
      0  

    Default

    This is how JavaScript works, the variable's value changes with each iteration so when the for loops ends, the value of i is 4
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Frontend Engineer
    ________________
    Need any sort of Ext JS help? Modus Create is here to help!

    Check out my GitHub:
    https://github.com/mitchellsimoens

  5. #5
    Sencha User
    Join Date
    May 2013
    Posts
    25
    Vote Rating
    1
      0  

    Default

    hmm but the div class are all correct which is img1, img2, img3 and img4 from this loop. Just the fn: function will always take the last value which is 4. any idea so that the output will be 1, 2, 3 and 4? Thanks

  6. #6
    Sencha User evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    18,965
    Vote Rating
    931
      0  

    Default

    You can use this pattern to capture the index:

    Code:
    var fns = [], 
        i = 0;
    for (i = 0; i < 4; i++) {
        fns.push((function(captured) {
            return function() {
                console.log(captured);
            }
        })(i));
    }
    fns[0]();
    fns[1]();
    fns[2]();
    fns[3]();
    Twitter - @evantrimboli
    Former Sencha framework engineer, available for consulting.
    As of 2017-09-22 I am not employed by Sencha, all subsequent posts are my own and do not represent Sencha in any way.

  7. #7
    Sencha User
    Join Date
    May 2013
    Posts
    25
    Vote Rating
    1
      0  

    Default

    hmm i need to tap the div and show the value... sorry i'm new in sencha.. haha~

  8. #8
    Sencha User evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    18,965
    Vote Rating
    931
      0  

    Default

    Code:
    for ( i = 1; i <= 4; i++) {
        picturesListeners.push({
            element: 'element',
            delegate: 'div.img' + i,
            event: 'tap',
            fn: (function() {
                return function(captured) {
                    console.log(captured);
                };
            })(i)
        });
    }
    Twitter - @evantrimboli
    Former Sencha framework engineer, available for consulting.
    As of 2017-09-22 I am not employed by Sencha, all subsequent posts are my own and do not represent Sencha in any way.

  9. #9
    Sencha User
    Join Date
    May 2013
    Posts
    25
    Vote Rating
    1
      0  

    Default

    Thanks

  10. #10
    Sencha User
    Join Date
    May 2013
    Posts
    25
    Vote Rating
    1
      0  

    Default

    found the issue~ thanks

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •