Best books to learn JavaScript

I would suggest using following JavaScript books for different learners.

If you are a beginner in JavaScript, the book A Smarter Way to Learn JavaScript will be perfect for you. The author of the book teaches the JavaScript in a unique way.

Most interestingly, this book helps you to learn JavaScript doing practical exercises, which is powerful and helpful for a beginner.

If you are looking for intermediate or advanced JavaScript learning, the book Eloquent JavaScript will be excellent. After reading each few chapters, you will get the project that needs to be done for actual learning.

This book has also chapters about latest technologies like Node.js, Canvas, and Web-socket related to JavaScript.

Other than that, the resources from Mozilla Developer Network can be useful, for example, if you would like to know about querySelector() method, you would just type querySelector mdn on google, most probably the top link from a result will be the resource you need.

Takeaway

After so many years of experience in programming, I could say with surety that practical knowledge would not come only by reading the book and online resources, for that you need to use what you have learned, it would not gain until your brain fight to solve the problem by coding in your favorite editor.

Difference between undefined and null in JavaScript

Every JavaScript programmer uses the undefined and null in their programming career, but do we really know the difference between them.

Today I put some light on differences between undefined and null and which one we should use when we programming?

Definition

Variable undefined means it has been declared but did not assign real value yet(eg: string, number, boolean and object). This also means the value does not exist before the scope, for example,

var color; 
console.log(color);

With above code, we are trying to access the declared variable which has no value, so as a result, color is undefined.

Variable null (var country = null) means it has no values, if you go deeper this means it has 'no object values'. After initializing the variable with null, it expects from the program that 'country' will hold the object at later.

Javascript throws the variable/property is undefined,

When you try to access the variable which is declared but did not associate any value,

var name;
console.log(name); // name is undefined

If you explicitly assign the undefined value

var name = undefined;

When you try to access the object’s property which is not defined yet,

var mycar = {color:'red'}
if(mycar.name==undefined){
    console.log(mycar.name) // mycar.name is undefined 
}

When the function does not return anything, sum contains undefined in the following case,

var sum = function (){console.log(2+2)};

When a function is defined with parameters but it invokes without the arguments,

function subtract(val1, valu2){ console.log(val1 + val2)}

after invoking subtract(3), val2 is undefined in above function.

The variable seems to null,

When you explicitly assign a null value to variable or property of the object,

var mycar = null; and var office.employee=null;

When browser tries to access the element which is not available in DOM,

var firstElem = document.getElementById('header');

the element with the id 'header' is not available in the browser, so firstElem is null.

When I use undefined?

If we need to check undefined against variable explicitly, for example, one scenario could be

where a variable is not undefined but it might be the null, following statement could be used

if(name !== undefined ){
    // this is being executed even when name = null;
}

When I use null?

If we want to check the variable is undefined, 'no object values', or element is null, then we use null, for example, we issue the query to check the DOM existence.

var header = document.querySelector('#header');

From above code,  we can validate if the header has something by checking header is null or not.

Conclusion

With null and undefined, it seems we are checking the same thing (no values) with two different approaches, so which one we should pick?. I want to go with null because it can be used to check for both null and undefined of the variable, whereas other is used to check undefined only.

Below condition is true if the variable(name) is not undefined and is not null.

if(name != null){
  // this is executed when variable name has anything but undefined and null
}