How does one achieve ternary assignment in Javascript?

Question

I would like to do a reassignment of a class variable in Javascript (or Typescript) using a ternary operator. The reassignment of this.foo depends on the current value of this.foo which I can update with the following:

setFoo = () => {
    this.foo = this.foo ? "" : "foo";
}

However, I am wondering if I can do reassignment of this.foo without writing this.foo twice. This would be helpful because I am trying to dynamically update classes on an Angular component (written in Typescript).

I would like to be able to write something like the following which makes use of truthy/falsy values. If this.foo is truthy, then "" is assigned; otherwise, "foo" is assigned:

setFoo = () => {
    this.foo =? "" : "foo";
}

I have tried searching for similar questions but could not find an answer. My initial thought was to use the ??= operator in Typescript 4.0 but I do not think it will work. Perhaps my ideal solution does not exist because it could be a bad programming habit. Thanks

The only thing possible is this.foo = this.foo || "" and this.foo = this.foo && "". That does not quite fit your need, but still is shorter. — Iyashi
– Iyashi, Commented Oct 28, 2020 at 17:33
Why? Ternary itself is awful enough, though I nowadays find myself using it more often with const. Don't minify your developement code, let a minifier do that when you're releasing the code to production. — Teemu
– Teemu, Commented Oct 28, 2020 at 17:35
the way you have written it works and is concise enough. I don't see any reason to want to shorten it. — Rick
– Rick, Commented Oct 28, 2020 at 18:24
I don't find two this.xs being redundant in that specific syntax, as there are two operators, and both of the operators need their operands. The case just happens to use the same variable in the operands of both of the operators. If the case was const x = (y) ? 1 : 2;, you wouldn't think 1 was redundant. For what you're after, we'd need a brand new "check&assign" operator ... — Teemu
– Teemu, Commented Oct 28, 2020 at 18:55

Wai Ha Lee · Accepted Answer · 2020-10-29 14:32:20Z

1

Great question. Unfortunately this is not possible. There is a shorthand version that some people use, but it still includes a duplication:

foo = foo || otherCondition;

So the shorthand of a shorthand, not too useful in my opinion.

Short answer: I'd go with the normal ternary.

edited Oct 29, 2020 at 14:32

Wai Ha Lee

8,856102 gold badges61 silver badges100 bronze badges

answered Oct 28, 2020 at 22:50

jburtondev

3,3231 gold badge19 silver badges26 bronze badges

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

Comments

Rizwan · Accepted Answer · 2020-10-28 17:36:30Z

0

You have to use the IF ELSE instead of using ternary statement, if else will give you more control on the statement written under it's and efficient to use.

answered Oct 28, 2020 at 17:36

Rizwan

1281 silver badge7 bronze badges

1 Comment

Charles Kornoelje Over a year ago

I appreciate the response, but this doesn't solve my issue of writing this.foo twice. Once would be within the if statement condition and the other would be assigning the variable.

Collectives™ on Stack Overflow

How does one achieve ternary assignment in Javascript?

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related