Today we try to know about some interesting javaScript subject

• Truthy and falsy in JavaScript
• JavaScript Equal Operator == vs ===
• JavaScript Null vs Undefined
• JavaScript map, filter, reduce and find

Let’s go….

Truthy and falsy in JavaScript

The purpose of this article is to help me and perhaps yourself differentiate between true, truthy, false, and falsy in JavaScript.

The values true and false are booleans. The simple (often called primitive) data types in JavaScript are: numbers, strings, booleans (true or false), null and undefined. Remember to always write these two keywords — true and false — in lowercase. JavaScript is case sensitive.

With the use of certain operators, true is treated like 1 and false like 0. In your console, you can verify this.

Truthy and falsy are what we use to determine the result of a conditional expression. They are what we use to determine its result, they are not the result.

Here is what is falsy in JavaScript:

• false
• null
• undefined
• The empty string ‘’
• The number 0
• The number NaN (yep, ‘Not a Number’ is a number, it is a special number)

Everything else is truthy, and that includes Infinity (which is another special number, like NaN), and all Object objects and Array objects, empty or not.

JavaScript Equal Operator == vs ===

Javascript has two equality comparison operator — double equals “==” and triple equals “===”. Both are used to compare equality of two values and most of the time both operator returns the same result until both values are not the same data type.

Let us first discuss double equals “==” aka loose equality, in loose equality, first it converts into command type, and then it compares equality.
Example :

Triple equal “===” aka strictly equality, in strict equality, it does not perform any data type conversion, if both values are not the same type, it returns a false value.
Example :

In both examples, double equal “==”, it first converts the string ‘10’ and number 10 in the same common type and then it compares, so it returns True. But in triple equal “===”, it founds both values are different type and it simply returns False

JavaScript Null vs Undefined

Understanding the difference between null and undefined

Introduction

Null and Undefined are both data types in JavaScript.

Undefined is a variable that has been declared but not assigned a value.

Null as an assignment value. So you can assign the value null to any variable which basically means it’s blank.

So by not declaring a value to a variable, JavaScript automatically assigns the value to undefined. However, when you assign null to a variable, you are declaring that this value is explicitly empty.

JavaScript will never automatically assign the value to null. That must be done by you in your code.

Let’s get some more info on these.

Typeof Null and Undefined

We see here that the type of null is an object but the type of undefined is undefined.

Comparison Using Abstract and Strict Equality

Since these are different data types, if we compare them with strict equality ===, we get false.

But if we compare them with abstract equality ==, we get true.

So JavaScript does consider these to be relatively equal since they both represent an empty value.

So if you need to check if a value is either null or undefined, you can check for abstract equality and compare it to either null or undefined. Both will return the same result.

JavaScript map, filter, reduce, find

Those are 3 really powerful array functions:

• map returns an array with the same length,
• filter as the name implies, it returns an array with fewer items than the original array
• reduce returns a single value (or object)
• find returns the first items in an array that satisfies a condition

map, filter and reduce were introduced in ES5, so you can safely use them as implemented in every browser for years.

find was introduced in ES6/ES2015.

They offer a more declarative approach, rather than an imperative approach (describe what should happen, not write every tiny bit of processing that should happen)

Execute something on every element with map

A loop would look like this:

With a declarative approach, you tell JavaScript to perform something on every element using:

This generates a new array, without editing the original one (what we call immutability)

Since we use a single function in the map callback function, we can rewrite the sample as:

Finding a single element in the array

Sometimes you need to look for a specific item in the array and return it.

This is how you would do so with a loop:

Here is the non-loop version, using find() (ES6+):

Here is the same functionality using filter() (ES5+):

For learning purposes (does not make much sense in practice), here is the same functionality using reduce():

filter() and reduce() will iterate over all the array items, while find() will be faster.

Iterate over an array to count the property of each item

Use reduce() to get a single value out of an array. For example sum the items content.value property:

using a loop:

can be written as