scope of if statement in javascript compared to python

Question

I have a function in react where i want to do :

   renderPost(data) {
        const dateStr = new Date(data.pub_date).toLocaleString();
        const img='empty'
        if (data.header_image_url.url!=null) {
            const img=data.header_image_url.url}
        else {
            const img="/app/frontend/img.png"}
        return (
            <div className="card mb-4">
            <Link to={`/post/${data.id}`}> <img src={img} className="card-img-top" alt=""/> </Link>

But it's not working like python : the const img inside the {} in the if and else statements dont take effect and dont override my const variable declaration above.

How can i do that ?

a) you seem to have a misunderstanding about what const means, b) you are redeclaring the (block-scoped) variable over and over, c) a javascript tutorial may be useful to read, e.g. javascript.info — ASDFGerte
– ASDFGerte, Commented Jun 10, 2022 at 12:47

Quentin · Accepted Answer · 2022-06-10 12:48:12Z

1

You have two problems here.

You can't change the value of a const. That's the whole point of consts! If you want to change it, use let.

Declaring a variable in a different scope shadows the variable in the wider scope. It doesn't overwrite it. Don't use const (or let) inside the block.

There is a school of thought which says you should avoid overwriting variables in favour of code structures where they are assigned in a single place. This can make code more readable.

In this case, each branch of the if does nothing except make an assignment to the same place.

This is the ideal place to use a conditional operator.

const img = data.header_image_url.url != null
     ? data.header_image_url.url
     : "/app/frontend/img.png";

… or a nullish coalescing operator:

const img = data.header_image_url.url ?? "/app/frontend/img.png";

answered Jun 10, 2022 at 12:48

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

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

2 Comments

user19271630 Over a year ago

thanks it makes sense...it's not the same approach as in python. what about using var?

Quentin Over a year ago

var is essentially let but looser and with problems. There's no reason to use it in 2022 other than if you are targetting Internet Explorer.

Collectives™ on Stack Overflow

scope of if statement in javascript compared to python

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related