Triple equal to in a js function

Question

The following piece of code rotates the image to certain angle, which gives us a feel in such a way that a circle rotates In the function that rotates the image, they have used triple "=" sign(===) and also along with a ","(better explanation in code below), can someone explain what happens in the function Thanks in advance

var c=$(".round-slider");

$(".circle-1").on("click", function () { 
    "240" === c.attr("data-rotate").slice(3) && c.attr("data-rotate", "deg120"), 
    "-120" === c.attr("data-rotate").slice(3) && c.attr("data-rotate", "deg-240"), 
    "0" === c.attr("data-rotate").slice(3) && c.attr("data-rotate", "deg120"), 
    "360" !== c.attr("data-rotate").slice(3) && "-360" !== c.attr("data-rotate").slice(3) || (c.addClass("stopTransition"), 
    c.attr("data-rotate", "deg0"), 
    setTimeout(function () { 
        c.removeClass("stopTransition"), c.attr("data-rotate", "deg120") 
    }, 10)), 
    setTimeout(function () { 
        c.addClass("slide-3"), c.removeClass("slide-1 slide-2") 
    }, 15) 
})

You can;t google that? It's strict equality same type a string "46" will not equal 46 a number. — zer00ne, Jan 12 '19 at 06:32
you can find your answer here :- https://stackoverflow.com/questions/523643/difference-between-and-in-javascript — Parth Raval, Jan 12 '19 at 06:41
@zer00ne i understood the triple equal to, but not able to understand the statement fully — Grijan, Jan 12 '19 at 07:56
@Grijan did you understand the triple equal to when you asked the question or now, given the answers? If when you asked the question, then you could have made it a lot clearer and saved everyone's time as as it stands it appears to be only about the triple equals (question title). — freedomn-m, Jan 12 '19 at 08:12

score 2 · Answer 1 · answered Jan 12 '19 at 06:56

2

This function is written in a style I'd strongly discourage; the author either has a unique style or it was run through an optimizer.

Imagine a simple if statement:

if (x === 3) x = 7;

You can rewrite this using a boolean and operator (&&), because the right half of the operator will not be evaluated if the first half is false. (This is called short circuit evaluation.) Example:

(x === 3) && (x = 7);

So this function is just a bunch of if statements, written in an unusual style.

The commas instead of semicolons is a strange (although legal) choice. In this particular function, you could replace those commas with semicolons and there would be no functional change.

answered Jan 12 '19 at 06:56

Elliot Nelson

11,371
3
30
44

is it like "240" === "0" and set the class name to deg240? i don't understand the use of comma even if it is a semi colon, can you please explain it a bit, or is it like if("240" === "0") then set the class name to deg240 – Grijan Jan 12 '19 at 08:00
This answer explains it quite clearly, but could do with an example from your own code: `if (c.attr("data-rotate").slice(3) === "240") { c.attr("data-rotate", "deg120") }` – freedomn-m Jan 12 '19 at 08:09
1

If it was done this way by an optimiser, that optimiser should never be used again as it's not very efficient code. – freedomn-m Jan 12 '19 at 08:16

score 1 · Answer 2 · answered Jan 12 '19 at 06:36

1

( === ) which check equals with strong data type compatibly also but ( == ) which check data type compatibly.

if( "10" == 10 ) {
    console.log( "this will be printed");
}


if( "10" === 10 ) {
  console.log( "this won't be printed");
}

answered Jan 12 '19 at 06:36

Gnanasekaran Palanisamy

887
5
7

score 1 · Answer 3 · answered Jan 12 '19 at 06:56

" === " does the two things which details are as follows

Match the data type ( string = string)
Match the value ( "240" = "240" )

suppose c.attr("data-rotate").slice(3) contains a value 240 and below is the code to access that value

var dataRotateValue= c.attr("data-rotate").slice(3);

if(dataRotateValue === "240") {
  console.log("hey value matched as well as data type")
}

the above value and data type matched and our if block got the true condition

Triple equal to in a js function

3 Answers3