As per the Wikipedia JavaScript is a high-level, interpreted programming language. It's being popular day by day just because twice behavior such as clients side and server side, let's learn some easy and tricky JavaScript core concepts for beginners.
What are the different data type of javascript?
As per the ECMAScript 5 specification, there are 6 different data types in javascript.
Boolean //true/false/ Number //1,1.0 String // 'a', "a" Null // null Undefined // undefined (5 primitive types and 1 non-primitive types)
Object // new Objects()
How to know datatype of a variable in javascript?
By using the keyword 'typeof' you can know the type of a variable, for example-
typeof (1); // number typeof('a'); // string typeof('true'); //boolean typeof(undefined ); //undefined
typeof(null); //
The output of null it's an 'object' but may you think it should be 'null' but 'object' because 'null' is a type has its own value 'object'
Let's do some practice to understand things clearly, run codes below:
Output: true
Reverse it:
Output: true
Value is same for undefined and null with different data type else you can say JavaScript incorrectly reports the type of null as an object.
Try with ===
Output: false
undefined and null are not the same data types that's why === will return false, === in javascript use for strict compare with value and data type.
=== operator checks for the value and datatypes and it will return true only if both are same.
== operator checks only for the value and ignore the data types.
You can explore all the behavior using this URL, I really love it- https://dorey.github.io/JavaScript-Equality-Table/
Move on one more example of 'typeof' in JavaScript.
Output: object
Variable in javascript doesn't have it's own type, it completely depends on the assigned value.
Explaining this point with some more examples, execute below lines of code in your Chrome Developer console.
First, you will get 'number ' after that 'string' means you can change the type of variable in JavaScript dynamically at the run time.
JavaScript also having some magic of values, to know we will now explore 'NaN';
I think it's little silly, we all already know the 'NaN' stands for 'not a number', so what's new?
Do not worry, till some examples. Enter below the line in console:
Output = NaN
I'm again going to repeat is'NaN' not a number, right?
Execute:
Output: number
So, surprising just because 'NaN' Defines a number is not exactly a number. Everything going to be simple, now we are moving to next level with some comparison operators.
Output: false
Output: false
Output: false
Strange?, every similar value returns 'true' in javascript so why 'NaN' compare itself 'false'?
So to clear this we need to do some more with isNaN, as for an example:
Output: true
Let's pass a string instead of 'NaN':
Output: false
Do not confuse try next one:
Output: true
So, NaN not really useful because it may return 'true' or 'false' so be sure before using it. NaN is the only javascript value only in javascript treated unequally to itself.
I have little more example to explain:
Output: undefined
Now we assigned 'NaN' to a variable name 'CT", we can check this variable with a comparison itself:
Output: false
Clearly, 'NaN' having strange property. NaN equal to ANYTHING is always false, even when compared to itself.
Now we have to move on another basic and important topic, we will discuss and learn some crazy facts of JavaScript:
use strict: JavaScript is evaluated in a strict mode when you put 'use script' on the top of scripts. Simply, "use strict" In strict mode, we can't use variables that have not been declared with var first.
Example:
Output: Uncaught ReferenceError: tricksways is not defined
Now again Run above code without "use strict"
Output: 3
It can prevents your code or return errors when "unsafe" actions are try to taken (such as gaining access to a global object).
Why in javascript 'use strict' expressed as a string?
Using "use strict" as a string doesn't add any syntax to JavaScript, yes and therefore it is backwards compatible. The old browsers will ignore it if not able to compile it just because of string, and latest browsers that support EcmaScript 5+ will enter strict mode.
Now we are going to explore 'Scope of a variable':
There are two scope in JavaScript for a variable
We will clear everything in few examples, please do attention.
Start with the first example as below:
Output: 1
Now with little change see the example two:
Output: 1
Here you can see output affected due to 'scope' of a variable. Just because you are passing a copy of a=2, not the actual variable so it will not affect the actual just because first a (a=1) have global scope and second a (a=2) having local scope inside a function foo.
Example:
Let's create an object of 'a' as:
Output: {moo: false}
Now you can see you can't change the value but able to change the property for example 'a' as an object. Confusing? We will do one more example:
Output: {moo: "too"}
We are getting the value of the 'a' which is {moo: "too"} of outer scope, you can't change what it's point too. You can change only property it has as in next example:
Output: {moo: "too", too: "moo"}
I just tried to explain some small and tricky JavaScript behaviors especially for beginners or someone who just want to revise their concepts. Will come with some more exciting tutorial in next article. Till now, thanks for reading.
Feel free to share your feedback.