Learn about Es6.

JavaScript ES6 brings new syntax and new awesome features to make your code more modern and more readable. It allows you to write less code and do more. ES6 introduces us to many great features. Let’s introduce some things-

Block-Level Declarations:

Block-level declarations are those that declare variables that are inaccessible outside of given block scope. Block scopes are created:

1. Inside of a function.
2. Inside of a block (indicated by the { and } characters).

Block scoping is how many C-based languages work, and the introduction of block-level declarations in ECMAScript 6 is intended to bring that same flexibility (and uniformity) to JavaScript.

Var && Const:

const is a new keyword in ES6 for declaring variables. const is more powerful than var. Once used, the variable can’t be reassigned. In other words, it’s an immutable variable except when it used with objects.

This is really useful for targeting the selectors. For example, when we have a single button that fires an event, or when you want to select an HTML element in JavaScript, use const instead of var. This is because var is ‘hoisted’. It’s always preferable to use const when don’t want to reassign the variable. The value of const never be changed but the var will.

Let declarations:

This syntax is the same as var syntax. We can basically replace var syntax with syntax let. The variable value is declared using let instead of var, the declaration isn't hoisted to the top of the function definition, and the variable value is destroyed once execution flows out of the if block. If the condition evaluates to false, then the value is never declared or initialized.

Block Binding in loops:

In a certain area where developers most want block-level scoping of variables is within for loops, where the throw-away counter variable is meant to be used only inside the loop. When the loop is complete, the variable is destroyed and is no longer accessible elsewhere. If you write var into the for loop it will run But let /const will catch an error. Because it’s the system of block binding.

Emerging best practices for block-bindings:

We all know practice makes a man perfect. While ECMAScript 6/ES6 was in development, there was widespread belief you should use let by default instead of var for variable declarations. Many JavaScript developers, let behaves exactly the way they thought var should have behaved, and so the direct replacement makes logical sense. In this case, you would use const for variables that needed modification protection. The current best practice for block bindings is to use const by default and only use let when you know a variable's value needs to change. This ensures a basic level of immutability in code that can help prevent certain types of errors.

Crossbrowser Testing introduction:

Cross-browser testing is the practice of making sure that the websites and web apps we create work across an acceptable number of web browsers. As a web developer, it is our responsibility to make sure that not only do our projects work, but they work for all your users, no matter what browser, device, or additional assistive tools they are using. Make the web work for everyone provides a more useful perspective on the different browsers people use, their market share, and related cross-browser compatibility issues. You can use those browsers for testing:

• Firefox Developer Edition
• Edge Insider Preview
• Safari Technology Preview
• Chrome
• Opera Developer etc.

Functions:

Functions are an important part of any programming language, and prior to ES6, JavaScript functions hadn’t changed much since the language was created. In a few time, it gets its priority more. Let’s discuss some valuable things about Functions:

Function with default parameter values:

In ECMAScript 5 and earlier, you would likely use the following pattern to create a function with default parameters values:

function makeRequest(url, timeout, callback) {

timeout = timeout || 4000;
callback = callback || function() {}; }

In this example, both timeout and callback are actually optional because they are given a default value if a parameter isn't provided. There is a flaw with this approach, in that a valid value for timeout might actually be 0, but this would replace it with 4000 because 0 is false. In that case, a safer alternative is to check the type of argument using ‘typeOf’, as in this example:

function makeRequest(url, timeout, callback) {

timeout = (typeof timeout !== “undefined”) ? timeout : 4000;
callback = (typeof callback !== “undefined”) ? callback : function() {}; }

The Spread operator:

Closely related to the rest parameters is the spread operator. While rest parameters allow you to specify that multiple independent arguments should be combined into an array, the spread operator allows you to specify an array that should be split and have its items passed in as separate arguments to a function. Consider the Math. max() method, which accepts any number of arguments and returns the one with the highest value. Here's a simple use case for this method:

let roll1 = 50,
roll2 = 72;

console.log(Math.max(roll1, roll2));

// 72

Turning a Pre-ES6 Function into an Arrow Function:

You could consider functions as a sort of recipe where you store useful instructions to accomplish something you need done in your program, like performing an action or returning a value. By calling your function, you execute the steps included in your recipe, and you can do so every time you call that function without needing to rewrite the recipe again and again.

Here’s a standard way to declare a function and then call it in JavaScript:

// function declaration
function HiStranger() {
return ‘Hi, stranger!’
}

// call the function
HiStranger()

You can also write the same function as a function expression, like this:

const HiStranger = function () {
return ‘Hi, stranger!’
}

Client Caching:

Client catches help limit the data cost incurred by the user by keeping commonly referenced data locally. The client often requests data that may not be large but is indeed continuously needed.

Server Caching:

Server caching helps limit the cost incurred by the server and its underlying systems. Many requests made by clients can either be responded to using the same data or responded to using parts of the same requests made by others.