10 Topics from ES6 you should know to be a web developer

Abdul Basir
3 min readNov 3, 2020

1.Var Declaration and Hoisting:

what is hoisting? when we declare any variable or function name. JavaScript makes this declaration top of the scope we call. This system is called as hoisting.

things to know: when we use var keyword we can use it before initialize which was used es5. but in es6 let and const keyword cannot be used before initialize or you will get an error.

2. Block Level Declaration:

In ES6 we use let and const to declare a variable instead of var keyword. var keyword was global usage. that mean if we declarer a variable using var keyword we can use that variable anywhere. but let and const has block scope behavior. that means we cannot if we declare a variable inside a function using let and const we cannot acces that outside of the function.

3.Arrow function:

Look at the photo and try to defined the difference between the normal function and arrow function. arrow function makes code more clean and easy.

if the picture both three will return the same value. First one is before es6 and other two in es6 arrow function.

4. spread operator:

spread operator is nothing but three dot sign (…). But It’s work is so powerful. let we have an array like: const odd = [1, 3, 5, 7, 9] and another array like: const even = [2, 4, 6, 8, 10] . Now if we want to add both array elements into an single array then what can we do? we can do nothing but spread operator will do everything. like this: const number = […odd, …even] ;

now console log number and you will see all the elements.

this is the simple magic or spread operator. we will look more magic later.

5. function default parameter:

do you know about the default value of function parameter? let’s declare a function then describe. const add = (a, b) => return a + b;

the default value of a and b are undefined so we need to set set value when we declare the function or get an error. like this: add(3, 5) // 8

we can also set the default value like this: const add = ( a=2, b=3) => return a+ b;

now we need to just declare the function to get value like this: add() //5

we can override the default value like this: add(3, 5) //8

6. null and undefined

These two data types always make us in trouble. There are nine total data types and every types has different world. Like string is a data type it can be any name, or any description . we cannot specify the amount of string value because it’s infinity. But null and undefined data type has only there own value. Null data type has only value null and undefined data types has only value undefined.

7. Comments

There are few thing we should remember when writing comments into code. Comments in code are so useful for both or coder and reader. comments help us to remember code and easily recap. remember:

  1. do not make comment as a description. try to make comment with few word.
  2. try to avoid making comment inside any function. rather comment before defining function.
  3. if you think there in no need comment then please avoid it.

8. Classes

This is new feature in ES6. We can create a class with declaring the keyword class. and class has only one method name constructor.to know about class constructor we need to know about this keyword. class isn’t object. actually class is template of object. Using class we can make object easily.

9. cross browser testing

There are another ugly thing in web developer is cross browser testing. It is impossible that our code will run perfectly in all browsers in the world. The modern browser has too much animation application but the old browser doesn’t support that. So we need write code in this way where every user can be satisficed .To do this we need to check our web application in different useful browsers modern and old version.

10. Summery of this article

I have tried to write simply some topics which you need to learn deeply as a react developer. Hopefully I will write an article for every topic and then it will be more fun and enjoyable.

--

--

Abdul Basir

Front end web developer. I love to learn and share my learning knowledge with everyone