Typescript, function argument inside arrow function

Question

In this code, I add an action for a "bet", and pass its id as a parameter to a function. But when I call this arrow function later, the argument of this.undoBet equals to this.local_bets[this.local_bets.length].bet_id - the last bet_id that was passed inside the loop.

How to make it so that inside every arrow function, this.undoBet would preserve the bet_id assigned to it in that loop?

for (var k in this.local_bets) {

    var bet = this.local_bets[k];

    if (bet.status == BetStatus.accepted) {

        // Here bet_id is correct for every "bet" variable

        this.addUndo( "undo_bet", () => {

            // When calling this later, bet_id equals to one that belongs to the last bet inside this.local_bets

            this.undoBet( bet.bet_id );
        });

    }

}

basarat · Accepted Answer · 2016-05-27 09:16:57Z

3

A common JavaScript mistake. Its because for (var k in this.local_bets) { the index will actually be the last one by the time the continuing function executes.

Fix

use let:

for (let k in this.local_bets) {

    let bet = this.local_bets[k];

More

This is covered here https://basarat.gitbooks.io/typescript/content/docs/let.html 🌹

answered May 27, 2016 at 9:16

basarat

278k60 gold badges475 silver badges528 bronze badges

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

Comments

TSV · Accepted Answer · 2016-05-27 09:17:33Z

2

Try this (another local variable will be scoped in the each new undo bet function):

this.local_bets
    .filter(bet => bet.status == BetStatus.accepted)
    .forEach(bet => this.addUndo("undo_bet", () => this.undoBet(bet.bet_id)));

answered May 27, 2016 at 9:17

TSV

7,6681 gold badge33 silver badges39 bronze badges

1 Comment

keke Over a year ago

Although I find function chining more elegant, I used a dictionary here, so it wouldn't work. Thanks for the suggestion though!

Shivang Gupta · Accepted Answer · 2018-09-17 16:40:35Z

0

All solutions are good, but better is to use const keyword when variable is not supposed to change. Check the code below:

for (const k in this.local_bets) {

const bet = this.local_bets[k];

if (bet.status == BetStatus.accepted) {

    // Here bet_id is correct for every "bet" variable

    this.addUndo( "undo_bet", () => {

        // When calling this later, bet_id equals to one that belongs to the last bet inside this.local_bets

        this.undoBet( bet.bet_id );
    });

}

}

answered Sep 17, 2018 at 16:40

Shivang Gupta

3,3791 gold badge28 silver badges25 bronze badges

Collectives™ on Stack Overflow

Typescript, function argument inside arrow function

3 Answers 3

Fix

More

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Fix

More

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related