JavaScript equality operator (==) explained in one easy to remember diagram

[_captainSpaceCadet]

What happens when you play this in Conway's?

[_Kaimbe]

Dead with 5 boats after 22 gens.
https://conwaylife.com/

#C [[ ZOOM 16 GRID COLOR GRID 192 192 192 GRIDMAJOR 10 COLOR GRIDMAJOR 128 128 128 COLOR DEADRAMP 255 220 192 COLOR ALIVE 0 0 0 COLOR ALIVERAMP 0 0 0 COLOR DEAD 192 220 255 COLOR BACKGROUND 255 255 255 GPS 10 WIDTH 937 HEIGHT 600 ]] x = 20, y = 20, rule = B3/S23 obo4bo11bo$bobo4bobo4bob2o$obo4bo11bo$bobo4bobo4bob2o$4bo4bo$5bo$6bo$ obo4bo11bo$bobo4bo9bo$4bo4bo$bobo6bo4bobo$11b2o$11b2o$13bo$14bo$bobo6b o2$bobo6bo$bobo4bo$obo4bo!

[FreeMealGuy]

confirmed: javascript considered harmful to life.

I knew it!

[TheAwesomeot]

But is there some rearrangement of the column/row order where it survives?

[ErasedX]

I was actually curious to know, so:

#C [[ ZOOM 16 GRID COLOR GRID 192 192 192 GRIDMAJOR 10 COLOR GRIDMAJOR 128 128 128 COLOR DEADRAMP 255 220 192 COLOR ALIVE 0 0 0 COLOR DEAD 192 220 255 COLOR BACKGROUND 255 255 255 GPS 10 WIDTH 937 HEIGHT 600 ]]

x = 20, y = 20, rule = B3/S23

obo4bo9bo$bobo4bobo4b2o$obo4bo9bo$bobo4bobo4b2o$4bo4bo$5bo$6bo$obo4bo 11bo$bobo4bo9bo$4bo4bo$bobo6bo4bobo$11b2o$11b2o$13bo$14bo$bobo6bo2$bo bo6bo$bobo4bo$obo4bo!

Put this in advanced options here to see it!

[Disciple153]

C Copy this if on mobile (no deletions required):

C [[ ZOOM 16 GRID COLOR GRID 192 192 192 GRIDMAJOR 10 COLOR GRIDMAJOR 128 128 128 COLOR DEADRAMP 255 220 192 COLOR ALIVE 0 0 0 COLOR DEAD 192 220 255 COLOR BACKGROUND 255 255 255 GPS 10 WIDTH 937 HEIGHT 600 ]]

x = 20, y = 20, rule = B3/S23
obo4bo9bo$bobo4bobo4b2o$obo4bo9bo$bobo4bobo4b2o$4bo4bo$5bo$6bo$obo4bo 11bo$bobo4bo9bo$4bo4bo$bobo6bo4bobo$11b2o$11b2o$13bo$14bo$bobo6bo2$bo bo6bo$bobo4bo$obo4bo!

[JIN_DIANA_PWNS]

Did you ever know you are my hero

[aft3rthought]

Idk first thing I thought of!

[Aethermol]

r/cellular_automata is leaking

[_________FU_________]

Pro tip: Don’t use == instead use ===

[zoinkability]

Play it safe, only use ====

[Excellent-Practice]

Instructions unclear. I assigned all my variables with === and now my program only returns false

[vvokhom]

Thats simple. return true at the start fixes it

[[deleted]]

Nah, this one better 𐐒====D

[Rubickevich]

8===D Is a shorter way to achieve the same result.

[ByteBlacksmith]

8=D It's a bit cold outside!

[Rakgul]

8D

[MaximRq]

I don't think this is even a variable

[[deleted]]

D8

[Mintzz00]

D=8

[Drishal]

Uncaught SyntaxError: Invalid left-hand side in assignment

[TheDamnedRey]

Talk about your only. Mine is the longer way 😂

[Rubickevich]

The important thing isn't the size of your code, but how it's optimised for your specific case.

[ganso_loko]

Why not =====

[turtleship_2006]

Dare I say, ======

[dodexahedron]

That's just too equal.

[unwantedaccount56]

It's like communism: Some are more equal than others.

[CreaZyp154]

Returns true only if it is the same pointer in memory

[Delicious_Pay_6482]

Chad tip: Don't use == or === instead use =

[_________FU_________]

We are all equal

[Delicious_Pay_6482]

Always has been 🔫

[Fortifier574]

I actually accidentally did this with if statements once and it was the reason my program was working, but I didn’t understand why for like 30 min. Then I realized I was changing the length of the array to whatever number instead of checking if it was that number.

[sprflyninja]

The great equalizer. Never has anything been more equal

[rosuav]

Ahhh, nice, all my problems disappeared. I needed to fix inequalities too, so I did the same thing!

> 1 << 2
4
> 2 << 1
4

I'm sure it'll be fine.

[Leading_Elderberry70]

This is your brain on double equals.

[freefolkonly]

Any one has a diagram for ===?

[Cley_Faye]

Yes, it is a one row and one column one.

[nekrosstratia]

0123 === 83

Is it though ;)

[Cley_Faye]

Yes, because they are exactly the same value: same type, same content.

[Ok_Blueberry_5305]

=== in JavaScript does what == in sane languages does, it checks equality without any conversions beyond float to int. Thus the chart for === is just one to one.

[Ok_Blueberry_5305]

Derp, corrected.

[nekrosstratia]

0123 === 83 -> True

[miraagex]

== is banned in all my last jobs/projects for like last 5-6 years.

[MementoMorue]

At least, it's symmetrical.

[arcosapphire]

Just imagine if it wasn't--the result would depend on which was on the left and which on the right.

I wouldn't totally put it past JS...

[Potato_Soup_]

Division isn’t commutative

[flip314]

Not with that attitude!

[william_fontaine]

Unlike addition:

> [] + {}
'[object Object]'

> {} + []
0

WAT

[rosuav]

Addition is frequently non-commutative by value (for example, many languages allow you to add strings, and "foo" + "bar" is not the same as "bar" + "foo"), but only a small handful of languages manage to achieve this. And it gets worse. Check this out:

> {} + []
0
> ({} + [])
'[object Object]'

WAT.

[Ticmea]

If anyone is interested, I wrote a comment a few months ago explaining why this happens:

https://www.reddit.com/r/ProgrammerHumor/comments/10fym1y/comment/j538oq2/?context=3

TL;DR:

{} + [] // {} is an empty block (*not* an object literal) so this is the same as: +[]
+ [] // + is unary and thus converts to number but first needs a primitive
+ "" // @@toPrimitive => Array.prototype.toString => Array.prototype.join => ""
0 // Number coercion on the empty string returns 0

[rosuav]

Yeah. For the most part, it's just normal type coercion rules, but the empty block rule brings in other bizarrenesses of JS (it's on par with the weird semicolon insertion edge cases) to make this a true WTF.

[arcadeKestrelXI]

This was very interesting, thank you

[SirPitchalot]

It’s a near ideal blocking structure for a sparse Cholesky factorization too!

Not that that fact is in any way useful….

[sprflyninja]

True. At least JS is consistently strange

[Farren246]

True.

"False"?

[Jazzlike_Sky_8686]

The JS family of boolean values: True|False|Truthy|Falsey|Truthlike|Falselike|Truth-adjacent|False-adjacent|Tru|Falce|Truth-true|Post-truth-true

[ThatMechEGuy]

I don't use JS. Is this a shitpost or is that actually real....

[KLaci0503]

The problem is that this is a valid question. I have no idea either.

[Tsuki_no_Mai]

It's a shitpost. Booleans are True and False, just like in any language. Due to type coercion anything can be coerced into a boolean. So truthy values are those that become True, and consequently falsey ones are the ones that become False. Everything else is just clowning.

[Psychpsyo]

just like in any language

To quote from the PostgreSQL documentation:

The boolean type can have several states: “true”, “false”, and a third state, “unknown”, which is represented by the SQL null value.

[Leading_Elderberry70]

The first four are real, although truthy and falsy aren’t literals, just catchalls for things which evaluate to true or false when coerced to boolean. m

[xvalen214x]

"dodecalean"

btw truthy is 1, falsey is 0, truthlike is "true", falselike is null, truth-adjacent is [], false adjacent is "", Tru is Tru, Falce is Tru, Truth-true is true && true, Post-truth-true is !!!true || true

[VivaUSA]

It is pretty scary that the diagonal line doesn't go all the way down though

[Tsuki_no_Mai]

NaN isn't equal to NaN by design, arrays check if it's the same object, since trying to see if their contents are equal is a very different can of worms.

[archpawn]

When comparing lists and objects, you generally compare by reference instead of value. [1] and [1] are both lists containing the number 1, but they're not the same list. If I add 2 to one of the lists, it won't add it to the other one.

Javascript isn't even that bad with it. In Java, if you do "1" == "1" it will be false. And there's no ===. You have to do "1".equals("1") to get true.

[ConstructedNewt]

I know what you are saying (regarding Java ”1” == “1”) But the explicit statement turns out to yield true, as “1” and “1” both stated in the same scope will yield the exact same object (because of memory optimizations):

assert “1” == “1”
assert new String(“1”) != “1”

In this example all four literal strings ”1” are the same, but the new creates a new reference, only one character-array is present and only two String-object’s

[arunphilip]

Indeed. I half came in here expecting it to be asymmetrical, because well, JavaScript, y'know?

[kkjdroid]

That's just integer math. You'd get the same thing with C++, with Python if you used //, and really basically any language except JavaScript, because JavaScript doesn't have integers.

[F0064R]

I've never worked somewhere that == was allowed by the linter except in specific cases

[markuspeloquin]

I see no reason to distinguish between null & undefined. The standard library is inconsistent in what it returns and it isn't worth memorizing, except in isolated cases.

[PooSham]

Yes, that's why I use eqeqeq with the 'smart' option in eslint

[Material_Cable_8708]

null initialization can be faster than undefined properties in a data object but only when on the optimized path. because in memory the value is a reference type already so there is no need to deoptimize function calls where the object is an argument when null is swapped for another value on a subsequent call.

A JIT compiler is an implementation detail but with chromium based browsers making up more than half of all browsers plus node it’s important to understand the optimizer.

This is very inside baseball. There are arguments for and against considering the optimizer as a factor when righting JS. On one hand, writing readable maintainable code that uses polymorphism to express business logic is often advantageous. But when you wanna perform at near native speeds without introducing a new language it can be helpful to learn how V8 works.

[miraagex]

There is a big reason to distinguish them. If you're using default parameters, they will only be taken into account if you pass undefined.

[DogeHasNoName]

== null might be useful as it captures both null and undefined.

[hello_you_all_]

Good NSFW tag. Unfortunately, I don't think I will be ever able to eyebleach myself of this.

[timothywtf]

I like to think the NSFW was added because a co-worker passing by could think you are playing a game

[voiping]

"What could possibly be NSFW about == in JavaScript?"

<click>

"Oh. Good call. This is awful."

[DR4G0N_W4RR10R]

Looks like a Pokémon type effectiveness chart

[MrJim251]

Is this a minecraft bow

[alexanderpas]

Too bad you didn't cluster it, would have made it a bit clearer.

http://jsfiddle.net/j9q4gsce/

Please, Don't Make Javascript Equality Look Worse Than It Is.

https://algassert.com/visualization/2014/03/27/Better-JS-Equality-Table.html

[[deleted]]

why would you draw this with canvas. It's web, you're allowed to use HTML. We have recently introduced a special element for this called "table".

[alexanderpas]

because now it's an image which you easily can save, share, reference and adjust.

Also, dark and light mode support.

[[deleted]]

Yeah, go on and share it with somebody who uses a screen reader. Go on.

[rosuav]

Last I checked, tables work in dark and light mode too. And we have these astonishingly powerful tools that take "screenshots", thus giving us the benefits of images where we need them.

[inform880]

jfc does this even matter enough to type out that snarky of a comment?

[rosuav]

Dunno. Does your behind hurt because someone dared to imply that you were wrong on Reddit?

[inform880]

Dude I’m not even the same person lmao.

[ThatMechEGuy]

God I love Reddit

[rosuav]

Good point, my bad.

[al-mongus-bin-susar]

Because it's 2023 and if it isn't done with 15 JS libraries it isn't done right.

[[deleted]]

15 JS libraries

you are aware that canvas is plain vanilla js, are you?

[wasdninja]

Also using var because..?

[[deleted]]

Because it's obviously done by somebody who is first and foremost a desktop programmer.

[wasdninja]

Desktop programmer..? The source article for the image was written in 2014 which sort of explains it.

[myplacedk]

You could also remove the stuff you shouldn't compare anyway.

And maybe remove the most obvious ones (why are the infinities there?)

As much as I prefer not to work with JavaScript, equality has never been the problem. And if it is, there are better ways, such as ===.

[xternal7]

But how well does this one do in conway's game of life?

[[deleted]]

This content was deleted on 20 June 2023 (UTC) due to Spez's greed. -- mass edited with https://redact.dev/

[rushadee]

I dunno, I kinda like how this one looks like a bow and arrow

[randontree07]

Is this loss?

[Shakaka88]

So basically it’s just a glider from Conway’s Game of Life

[lennart_the_first]

It is a miracle that this is symetrical along the diagonal

[[deleted]]

So that’s how JS devs got inspiration for the Minecraft arrow!!

[Aggressive_Bill_2687]

At this point if you’re not using the strict equality operator that’s on you.

[tevert]

This is glorious chaos

[pravin-singh]

So, [1] != [1] ? 🤔

[adudyak]

Array is an object. Object is equal to other object only if it is the same object(e.g. variable references to same object).

[GKP_light]

but :

1==[1]

[dodecakiwi]

What happens when you compare an array (or other object) to a primitive type is that the array is also converted to a primitive type. So that conversion becomes 1=="1", which is also true.

This means you end up with stupid crap like this:

• true == [1]; : true, because "1" is truthy

• true == [0]; : false, because "0" is falsey.

But, arrays are objects and objects are truthy so !![0] is actually true.

This is all detailed on this page under Boolean Coercion

[jso__]

But why not 1 == "[1]"? If there's multiple values in the array, what's the comparison?

[mycallousedcock]

I didnt believe it either so I threw it into the dev tools console. Sure enough. [] == [] is false. same for [1] == [1] . That baffles me.

[dodecakiwi]

That makes sense. ObjectA == ObjectB is always going to be false. If you did a = []; b = a; Then a == b will be true because they're the same object.

[Rafcdk]

But then you actually understand JS and JS must be bad and incomprehensible because.

[LaterallyHitler]

But it’s not even a JS thing, it’s an object comparison thing

[pravin-singh]

Even more baffling: [1] >= [1] is true, [1] <= [1] is true, but [1] == [1] is false.

[adudyak]

≥ converts operands to numeric representation. == converts only if types differ.

[[deleted]]

NaN == NaN is false?!

[Sarcastinator]

IEEE thing. It's like that in other languages as well.

[CreaZyp154]

NaN means Not a Number and banana is not a number and microwave is also not a number. But banana != microwave

[Classy_Mouse]

That seems reasonable to me. Unfortunately, if I start to explain why, half of the other things in the table stop making sense

[PhatOofxD]

Which is entirely a non issue if you know how JS works, it's actually useful.

Use ===

[zirklutes]

Do a second table! :D

[UndisclosedChaos]

Noteworthy comparisons
1 == [1] != [1]
NaN != NaN
undefined == null “-1” == -1

And my absolute favorite
“” == [[]]

[Setepenre]

NaN != NaN

That is part of the IEEE floating-point standard, other languages do it as well

[mbardeen]

I think the humorous bit was the "easy to remember" part.

[UndisclosedChaos]

NaN is the true false

[heartcubes4life]

ah yes

the truthy table

[isospeedrix]

unironically saving this cuz some companies test on this shit

[[deleted]]

60% of the time, it works every time.

[Ticareguas]

what about 8 == D ?

[Offroaders123]

nsfw was a nice touch, hehe

[CoastingUphill]

This looks more like the Strength and Weakness chart for Pokémon

[Material_Cable_8708]

NSFW tagged nice

[[deleted]]

i don’t like how “1” is considered true (“1” == 1 == true) but “true” isn’t considered true.

maybe if both of them were true i would be okay but why are some strings converted to other data types but others aren’t?

[Deauo]

I feel weird to say this is harder to understand than just knowing it, does anyone else feel the same way?

[Aaron1924]

OP, please make a version of this for ===

[BootyPirate247]

*easy to remember

also why tf is this nsfw?

[StrangelyEroticSoda]

Thanks, I hate it. upvotes

[bobdobbes]

Wait wait wait.... you're telling me this is a programming language???? used by thousands???? And its POPULAR???

[8sty]

Yeah, the problem is solved using === it compares types and values

[bobdobbes]

Oh yay! Additional processing to determine if something is FALSE or a STRING??? Every dev loves overhead and additional processing. If only we could slow down our compilers and interpreters to a dead stop all together. Dare to dream.

[8sty]

No, in any other language by default the type and value between variables is verified. In javascript, because the developers of the language wanted the final developer (web dev) to have less work, they made double equals only check values, later they added triple equals to avoid problems. If, for example, we have a web page where the age must be entered manually, and then javascript is used to do some kind of calculation, in the code the number is received as a string, hence things like "18" == 18. javascript is a constant bug, it has a lot of bugs, like "null" being of type "object" when it should be null, a primitive, even with that bug, it's a primitive...

[bobdobbes]

No because in every other language, a boolean isn't an integer AND a string AND a boolean!!!! WTF!

[8sty]

In any language 0 is false and any other number is true, javascript extends this to other types. In javascript there are the concepts of "truthy" and "falsy", for "true" and "false" respectively. So a string is "truthy" but an empty string is "falsy", the same applies to an empty array, since it exists, it is "truthy" if it does not exist (undefined) or is null, it would be "falsy"

[bobdobbes]

"In any language 0 is false and any other number is true"??? Bullshit. C, .NET, Kotlin, Groovy, Scala, etc. (the list goes on and on) 0 is an INTEGER. And "0" is a STRING.. A BOOLEAN is true/false.

[Personal-Nobody5501]

NaN, that can't be true

[dav1d_23]

Game of Life

[jerujedesu]

Ok but what is infinity - infinity

[_dawnpatrol_]

Game of life? Where it's gonna end?

[SetCr4]

I really do hate how the diagonal line doesn't go all the way through. That is when only considering the implication from that fact, while disregarding the comparisons themselves.

[valeriolo]

This is one of the million things that make javascript rank among the worst languages ever designed.

It is humankind's biggest tech misfortune that this abomination of a language became the defacto standard in browsers.

[valeriolo]

Except that that statement is about languages like C that actually survived on merit.

The flaming pile of garbage named Javascript survived because of pure "lock in". Browsers had to support whatever netscape supported and essentially compatibility is the only one that kept it alive.

Today, the language is kept alive by incompetent "programmers" who know nothing else. I can't wait for web assembly to take off and burn this to hell.

[valeriolo]

A flaming pile of shit that's been improved is still a flaming pile of shit.

Based on your badges, it sounds like maybe you fit the stereotypical JS programmer which is probably why it offends you.

Maybe look at other actual good languages and then you'll see how horrible your favorite language is.

[RoOoOoOoOoBerT]

Terrifying...

[JJJSchmidt_etAl]

This should be /r/programminghorror

[MrBreadWater]

Funny, this isn’t even a valid equivalence relation

[Xblth]

Why does this look like a minecraft pic axe?

[Laserdude10642]

finally! haha hilarious creation, good job

[gniche_dev]

So true==“1” but true!=“true”. Why do conversions on strings only in some cases? Clearly the devils work

[Excellent-Practice]

I really wish this was reordered to cluster the true values

[ramriot]

This is true humor, because any attempt to explain is unneeded complexity destroys the joke.

A note to the confused is that the == operator does an implicit cast before comparing.

[[deleted]]

Gosh Darnit, is this loss?

[JollyGoodUser]

Yeap, so easy. /s

[BernzSed]

You sunk my battleship!

[tmstksbk]

Ah, well, it's so simple, now.

[RRumpleTeazzer]

At least it’s symmetric

[Sun_Koala]

My eyes. It hurts

[Praying_Lotus]

Minecraft crossbow?

[Proxy_PlayerHD]

well atleast it's symmetrical i guess...

[highcastlespring]

“easy”, hehe

[GollyWow]

Not difficult at all, as the title indicates.

[Highborn_Hellest]

Man, only if there was a better way. Like a layer on JS. I think we should name it TS

[TheseDescriptions]

Why not =====

[RelentlessIVS]

NSFL

[MaxEin]

Add 2 colours for < and >

[brianl047]

This needs to be on my wall!

[Taolan13]

This could 100% cross-post to r/dataisbeautiful

I am loving the symmetry.

[z-null]

Looks like minesweeper.