How to toggle a boolean?

Question

Is there a really easy way to toggle a boolean value in javascript?

So far, the best I've got outside of writing a custom function is the ternary:

bool = bool ? false : true;

Jordan · Accepted Answer · 2020-05-21T19:24:59.553

1208

bool = !bool;

This holds true in most languages.

edited May 21 '20 at 19:24

answered Jul 22 '12 at 22:11

Jordan

31,971
6
56
67

12

really nice solution, i was using: test = (test == true)? false : true; – alpera Jan 19 '14 at 15:46
1

This need initialisation, so is there a way without initialisation. Though this would work on object attributes. – user2846569 May 16 '14 at 14:40
18

@user2846569, if you're toggling the boolean, that means that by nature the variable has already been initialized. You could expand it to `bool = !bool || true;` to have a default, I suppose. – Jordan May 22 '14 at 00:53
3

@Jordan That causes ReferenceError – user2846569 May 23 '14 at 11:12
1

J.B wants a unary statement rather than binary statement. Perhaps it could be bool!! or !!bool. But so far i've never seen such syntax. I agree with Jordan. It is so short already. – Fandi Susanto Nov 06 '14 at 05:04
1

This works well even when the value starts with `undefined` – goodhyun Apr 02 '17 at 15:38
Consider `bool = bool === true;` to map falsy values to false. – Killroy Oct 21 '19 at 08:27
If anyone's needing this for VB.NET, it's bool = (not) bool – kosherjellyfish Jan 15 '21 at 04:24
Wish there was shorter syntax, f.e. `bool=!`or something. – trusktr Aug 30 '23 at 22:40

score 122 · Answer 2 · edited Nov 03 '21 at 00:16

122

If you don't mind the boolean being converted to a number (that is either 0 or 1), you can use the Bitwise XOR Assignment Operator. Like so:

bool ^= true;   //- toggle value.

This is especially good if you use long, descriptive boolean names, EG:

let inDynamicEditMode   = true;     // Value is: true (boolean)
inDynamicEditMode      ^= true;     // Value is: 0 (number)
inDynamicEditMode      ^= true;     // Value is: 1 (number)
inDynamicEditMode      ^= true;     // Value is: 0 (number)

This is easier for me to scan than repeating the variable in each line.

This method works in all (major) browsers (and most programming languages).

edited Nov 03 '21 at 00:16

NearHuscarl

66,950
18
261
230

answered May 28 '13 at 05:14

Brock Adams

90,639
22
233
295

22

Since this recasts to an integer anyway, it can be simplified as: `bool ^= 1` – Kyle Mueller Oct 23 '13 at 16:14
62

As the value is casted to a number, you will be not able to do `bool === false` or `bool === true` anymore. It might break existing code, so be careful. – aymericbeaumet Jan 20 '14 at 09:22

Zameer Ansari · Answer 3 · 2018-01-29T12:59:05.500

16

Let's see this in action:

var b = true;

console.log(b); // true

b = !b;
console.log(b); // false

b = !b;
console.log(b); // true

Anyways, there is no shorter way than what you currently have.

edited Jan 29 '18 at 12:59

answered Jan 29 '18 at 12:52

Zameer Ansari

28,977
24
140
219

score 13 · Answer 4 · answered Jul 13 '16 at 11:00

13

bool = bool != true;

One of the cases.

answered Jul 13 '16 at 11:00

Boris

4,944
7
36
69

OfirD · Answer 5 · 2021-10-06T12:54:12.027

5

I was searching after a toggling method that does the same, but which "toggles" an initial value of null or undefined to false.

Here it is:

booly = !(booly != false)

edited Oct 06 '21 at 12:54

answered Jun 11 '18 at 13:46

OfirD

9,442
5
47
90

score 2 · Answer 6 · answered Jul 28 '22 at 01:35

This is an old question but I think a ES6 update will be good.

Usually we want a toggle that can handle everything without breaking our code.

We can use an initial value for null or undefined values as false.

const boolToggler = b => !(b ?? false)

let foo
console.log('foo:', foo) // undefined

foo = boolToggler(foo)
console.log('foo:', foo) // true (assumes undefined as 'false')

foo = boolToggler(foo)
console.log('foo:', foo); // false

let fee = null
console.log('fee:', fee) // null

fee = boolToggler(fee)
console.log('fee:', fee) // true (assumes null as 'false')

let faa = true
console.log('faa:', faa) // true

faa = boolToggler(faa)
console.log('faa:', faa); // false

Isn't `!(b ?? false)` kind of redundant since it's being fed into the `!` operator? `null` and `undefined` are falsy anyway so the same behavior can be achieved with `!b` — Slackow, Aug 31 '23 at 17:35

score 1 · Answer 7 · answered Sep 20 '17 at 11:42

1

bool === tool ? bool : tool

if you want the value to hold true if tool (another boolean) has the same value

answered Sep 20 '17 at 11:42

Ardhi

2,855
1
22
31

score 1 · Answer 8 · answered Dec 26 '20 at 14:46

1

In a case where you may be storing true / false as strings, such as in localStorage where the protocol flipped to multi object storage in 2009 & then flipped back to string only in 2011 - you can use JSON.parse to interpret to boolean on the fly:

this.sidebar = !JSON.parse(this.sidebar);

answered Dec 26 '20 at 14:46

Grant

5,709
2
38
50

In case the variable has a different values for true/false like "Yes"/"No", I use `sidebar = (sidebar == trueValue) falseValue : trueValue;` – alans Feb 08 '21 at 22:29

score 0 · Answer 9 · answered Dec 22 '21 at 15:12

I always liked Boolean value, but nowadays I'm using binary for both convenience and debugging. You can use de consept !key : ++key: --key to toggle, and if you are in any asynchronous function or anytime an error or false true occurs, the value will leak out of 0(zero)/ 1(one) and you can trigger an alert to debug later.

How to toggle a boolean?

9 Answers9

Linked

Related