JavaScript core concepts

1. Primitive values

primitive values are the values that can not be altered meaning they are immutable. it is crucial not to confuse primitive values with variable assigned a primitive value. Even a variable assigned value can not change the existing primitive value but it will assign a new value.

example of primitive values:

1. String
2. Boolean
3. Number
4. Symbol
5. BigInt
6. Null
7. Undefined

2. Error handlings (try…catch)

To find errors in your in code, you can use the (try…catch) syntax. this syntax will help you find your error and give the details of it. (try…catch) syntax has two main blocks. (try) and (catch).

so this is how it works:

1. first your code in try{…} will be executed.
2. if they didn’t find any errors in try{…} then they will ignore catch{err} and reach the end of try{…}.
3. if they found errors then the try{…} execution will be stopped and in catch{err} they will have an object in where the error name and message will be given.

3. Coding style

To make your code look a bit neat and understandable, you need to remember these coding styles to make your code better organized.

1. Curly brackets

keep in mind when adding curly brackets write it on the same line as the keyword and put a space before the opening bracket.

2. line length

No one is fond of reading a one line long horizontal line, it is a good practice to split it into separate strings. you can discuss with your fellow team on how many words would you like on one line.

3. Indents

indentation makes your code look neat and readable. there are two types of indents:

1. horizontal indents- horizontal indents are made by using the tab key or by adding 2 or 4 spaces. a great advantage of spaces is that you have a more flexible arrangement of indents than tab key.
2. vertical indents- to make your code readable, you can split a single function into logical parts

4. semi-colon

A semi-colon should be provided after each statement. In JavaScript semi-colons can possibly not be given but that increase it’s risk for getting an error. so the best practice is to use semi-colons after statements.

4. Comments

Comments can be single line (//) or multiple line (/*…*/). we usually use comments to write how and why the code works but some people use it in the wrong way, they try to write “what is going on in the code” which is not the right way like the code should be clear enough to read without the comment.

there is a great rule about that : “if the code is so unclear that it requires a comment, then maybe it should be rewritten instead”.

what are good comments then? you can provide high-level overview of components. you can describe the architecture there is a special language UML which builds high-level architecture diagrams for explaining the code and a special syntax JSdoc to document a function.

5. Cross browser testing

Cross browser testing is a method in which it helps your created work be viewed in a number of websites. it is important for you that your projects work perfectly for users despite the browsers, devices and tools they are using.

you need to keep in mind that your project works not only in the browsers you are using but browser which are older and does not support the latest features of the language used.

your projects should be accessible to the different devices from latest to cheap tablets, laptops and TV. also people who with disabilities, they use screen readers and some people use only keyboard no mouse.

6. why does cross browser issues occur

cross browsers issues happen for few reasons. first there differences in each browser. different browsers implements things differently as back in the days it use to be very common but now it’s a lot less. browsers can have bugs too so that is another problem

not all browsers support the same technology features like others especially older browsers which are frozen does not support the latest features. if you want to use a new JavaScript feature the old browsers won’t support so you have to change and use an old syntax of JavaScript.

7. The workflow for testing and bug fixes on a project it can be broken down to roughly four phases

Initial planning

you will first have several meetings with the site owner , client or someone you are building the site for in which you discuss what the website should be, functionality and content needed. what is the due date? how should it look like. these things take an important role in cross browser testing.

once you got all the features to use and a brief description on how the website will look. it’s now time to start researching on what browser / devices will your target audiences be using on this site. you should start looking at which countries the site will be serving etc.

8.Cross browser development

you need to get the functionality working as close as possible in all requested browsers. which involves writing different code paths for different browser or using a library that involves a single bit of code which does different things in the background depending on what the browser supports.

accept the fact that not all functionality will work on all browsers and you can provide an acceptable solutions for them. this issue is unavoidable because of the restrictions the devices have.

accept that your browsers won’t work in some older browser. this is okay as long as the client is fine with it.

9. Let declarations

the let declaration is same as the syntax var. you can replace a “var” with “let” to declare a variable. as let declaration are not hoisted at the top. you will have to first place the let declaration in the block so that it is available to the entire block

10. Constant declarations

you can also write variables ECMAScript 6 with const declarations syntax. const declarations are constant meaning it can not be changed once set. so every const variable must be initialized on declaration. if the variable is not initialized then you will most likely receive an error