JavaScript === (triple equals)

Question

Given the following snippet:

function countZeroes(array) {
  function counter(total, element) {
    return total + (element === 0 ? 1 : 0);
  }
  return reduce(counter, 0, array);
}

1. What does === do?
2. Is reduce a built-in function? What does it do?
3. Please explain the steps of this program.

Answer 1

It is the strict equality operator.

It compares two values and checks to see if they are identical according to the Strict Equality Comparison Algorithm.

This is opposed to ==, which will attempt to coerce one or both of the values being compared if they are of different types. That one uses the Abstract Equality Comparison Algorithm.

The rules for the Abstract algorithm can be tricky. You're better off using === unless you have special need for ==.

From the MDN docs

The standard equality operators (== and !=) compare two operands without regard to their type. The strict equality operators (=== and !==) perform equality comparisons on operands of the same type. Use strict equality operators if the operands must be of a specific type as well as value or if the exact type of the operands is important. Otherwise, use the standard equality operators, which allow you to compare the identity of two operands even if they are not of the same type.

---

With regard to the code, this part:

(element === 0 ? 1 : 0)

...basically says if the value of element is exactly equal to 0, then use 1, otherwise use 0.

So to take that entire line:

return total + (element === 0 ? 1 : 0);

...the return value of the function will be total + 1 if element equals 0, otherwise the return value will be total + 0.

You could rewrite the code using an if-else statement:

if( element === 0 ) {
    return total + 1;
} else {
    return total + 0;
}

Answer 2

=== is a strict equality comparison. The == operator in JavaScript does type coercion, which often has surprising results, like how ' ' == false. So most JavaScript developers use === where possible.

Hard to tell about reduce(). That is not a built-in global function in JavaScript, but it likely refers to the reduce() method on JavaScript arrays. The reduce() method executes counter() once for every element in the array, and each time it calls counter(), it replaces total with the returned value from the counter() call. So the given function counts the number of elements that are strictly equal to zero in array.

Answer 3

Its a very good question and generally developer coming from other languages always have difficulty understanding the importance of using === as compare to ==

---

   1. 5 == '5' //true    why? Because it do
   type conversion whereas in case with
   ===    5 === '5'//false because '5' is a string as compare to number 5.
   2. '\t\r\n' == 0 //true     this lack of transitivity is alarming and cause
   lot of errors. 
   3. Use JsLint ...it will help writing better JS code keep your code safe
   from this kind of issues.
   4. Moreover their is a performance penalty for using == when you are
   comparing number with a string.

---

In my test it turns out that there is little practical performance difference between == and ===. While the strict operator is marginally faster (roughly 10%) in most browsers when combined with explicit type conversion, such as a === +b, the only real performance gains will come from avoiding type conversion entirely. Converting a string to an integer for comparison with another integer is significantly slower (up to 10x) than simple comparing two integers. You should never allow integers to be stored as strings internally, as the type conversion will incur a performance penalty.

While that was the basic takeaway from the numbers, I did find one interesting outlier when testing with Firefox. In Firefox, the comparison a === +b is about 20x slower than the equivalent a == b when a is an integer and b is a string integer. This result seems suspicious to me, and nothing similar occurred in any other browser. Oddly, when the Firebug script debugger is turned on, this result changes, and a === +b becomes about 10% faster than the other. I'm not sure what to make of this result, but it does serve as a reminder that integers should always be stored in numbers, not in strings.

Answer 4

The "===" is means "exactly equals", as in the value is the same, as is the type. So ...

var x = 5;
if (x === 5) {
    alert("This will happen");
} else {
    alert ("This won't");
}

It's rarely used.

The reduce function is likely the Array.prototype.reduce() method, which is used to apply a function to values in an array sequentially (sort-of). So, in this usage it is applying the 'counter' function to everything in the array, which will count the # of zeros in the array and return that.

Answer 5

see other answer about ===.
reduce it built in JS function which uses like "foreach", its moving on every elemnt in the array.
it start with the inital value, which in your case its zero, and then call to counter() and on the first element.
it check it, and return total(which is zero)+ 1 if the element is 0, after the returned value will be the "total" for the 2nd element in the array and so on....
in conclusion: the reduce call to counter on every element of the array,doing the test and adding its value to the (n-1)st element's returned value;

Answer 6

=== is strictly equal, both sides have to be of the same type and be equal. This is used to avoid the comparison of 2 unequal types (usually boolean false and a number 0)

Answer 7

=== is the identity operator, it's like ==, but does not perform type conversion.

this function appears to count the number of zeros in an array and return the count.

• I assume that reduce() acts like Array.prototype.reduce

Answer 8

=== is the same as == except it doesn't cast variables

0 == '0' -> true
0 === '0' -> false

reduce isn't a built in function, but what it certainly does is run counter on each element of the array.

so for each element of the array the element is checked to be 0 and if it is the total is incremented.