Typescript - closure inside loop

Question

I am trying to use closures in Typescript inside a loop, but I've got some serious problems:

for(let vehicle of vehicles) {
    update(location => 
        {
            vehicle.location = location;
        }
    );
}

I am using Typescript 1.8.1 and I need to target ES5, when I compile the following error shows:

Loop contains block-scoped variable 'vehicle' 
referenced by a function in the loop. 
This is only supported in ECMAScript 6 or higher.

If i use var instead of let in the loop, it uses last value of vehicle for all closures.

Is there any good workaround for this problem when targeting ES5?

Possible duplicate of JavaScript closure inside loops – simple practical example — Ruan Mendes
– Ruan Mendes, Commented Apr 13, 2016 at 12:12

basarat · Accepted Answer · 2016-04-13 12:46:46Z

2

Is there any good workaround for this problem when targeting ES5?

Please update to TypeScript nightly. This feature is supported there and will eventually make it to a release.

More

https://basarat.gitbooks.io/typescript/content/docs/getting-started.html#nightly-typescript

answered Apr 13, 2016 at 12:46

basarat

278k60 gold badges475 silver badges528 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

ArcSine · Accepted Answer · 2016-04-13 12:03:51Z

0

This is a problem because the function you calling in update is bound to the variable vehicle, not the loop iteration vehicle. You would need to do something like:

for(let vehicle of vehicles) {
    (vehicleClosure => {
        update(location => vehicleClosure.location = location)
    })(vehicle)
}

Or use a JavaScript runtime that supports scoping via let which should behave as intended.

answered Apr 13, 2016 at 12:03

ArcSine

6446 silver badges14 bronze badges

Comments

Ruan Mendes · Accepted Answer · 2016-04-13 12:05:49Z

0

Yes, bind the function that is using the closure variable, that will create a separate vehicle reference for each of the inner functions in the loop

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind

for(let vehicle of vehicles) {
    update(function(veh, location)  {
        veh.location = location;
    }.bind(null, vehicle));
}

answered Apr 13, 2016 at 12:05

Ruan Mendes

92.7k31 gold badges161 silver badges225 bronze badges

Collectives™ on Stack Overflow

Typescript - closure inside loop

3 Answers 3

More

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

More

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related