Javascript : Program structure

We look forward to going over JS program samples here, and how the entire program is broken down into various parts. In addition, we shall also see how the parts interact with each other, and come together to give output that we desire.

Expressions

• Any fragment of code that produces an output/value is called an expression . For example, these are expressions : 1; true?5+10:5-10;
  • Note : JS doesn't make it compulsory to insert semicolons at the end of every statement like you would need to in C++. Neither can you just skip semi-colons everywhere like you would need in Python. It is required at some places, and at other places it is optional : It wont matter if you keep its fine, otherwise also its fine. ####Bindings or Variables
• All numbers have a predefined value, and are recognised by JS. But what if you want to store some thing like 25? Writing 25 everywhere will be not only too tedious, but also make it hard to write. We can use variables to bind a value, or hold a value with yourself . For example, here ten is a variable

let ten = 10;
console.log(ten * ten);
// . 100

• Keywords are special words that have been reserved for a specific purpose in a language. In the above example, the word let is a keyword. The following are the keywords in JS :

break case catch class const continue debugger default
delete do else enum export extends false finally for
function if implements import interface in instanceof let
new package private protected public return static super
switch this throw true try typeof var void while with yield

• For naming any binding or variable, we can use any of the alphanumeric characters, along with the special character '_' . However, no variable name should start off with a number, special character or should resemble a keyword.

• All these keywords, along with the variables and functions together make up the environment.

Functions

• A function is a piece of program that is wrapped in a value. It can take in inputs (called arguments) , process and then return an expected value. It can also have other "side effects" , such as printing out some value, calling another function, and so on.

• Each function will have both a definition and declaration.

  • Declaration is basically you simply telling JS to make a particular function, and witholding the info on how the function will process your arguments.

function declare();

• Definition on the other hand, will tell JS exactly what your function will do with the input arguments.

function declare(){
     console.log("Hi, I am Param");
}

• Scope : Each variable will have a scope, usually global or local.
  • Global scope indicates that the variable can be used by any function or block of code in our program.
  • Local scope means that the variable is valid only within our code block, for example, inside a function. No code segment outside our function(in the above example) will be able to access a local variable.
  • Note : Nesting of functions is possible, i.e., you can declare functions within functions, code blocks within other code blocks. This means that we can have a lot of local variables and global variable pairs too.

Conditionals

We cant have straight forward control of our program , always. We may often need to check for something, and our answer will be based on if the condition is met or not. In such cases, you have the following conditionals :

• If block :

  • It checks for a condition, and executes a code block if the condition is met, else it will move on.

     if(condition){
         console.log("I am inside the if block");
     }
  

• If-else block :

  • It checks for a condition, and executes a code block if the condition is met, else it will execute another code block.

     if(condition){
         console.log("I am inside the if block");
     }
     else{
         console.log("I am inside else block. Condition is not met");
     }
  

• Else-If ladder :

  • It checks for a condition, and executes a code block if the condition is met, else it will move on, untill a possible condition is met. If none of these are met, there is also an optional default code block that can be executed.

     if(condition){
         console.log("I am inside the if block");
     }
     else if(condition2){
     }
     else if(condition3){
     }
     .
     .
     .
      else{
         console.log("None of the conditions match, hence I am here");
     }
  

• Nested Else-If :

  • It checks for a condition, and executes a code block if the condition is met, else it will move on, untill a possible condition is met. If none of these are met, there is also an optional default code block that can be executed.
  • You can think of this as another representation for the else if ladder.

     if(condition){
         console.log("I am inside the if block");
     }
     else{
       if(condition2){
       }
       else{
          if(condition3){
          .
          .
          .
                      else{
                         console.log("None of the conditions match, hence I am here");
                      }
           }
      }
  

• The switch block :

  • The switch block is an exclusive block that is used when we want to set some condition based on a given variable only.
  • The break keyword is used to differentiate between the different conditions, else it will cascade down and all the statements after the { statement where the variable matched condition } will execute.
  • The default statement will be executed in the event that none of our conditions match.

 switch(expression) {
  case x:
    // code block
    break;
  case y:
    // code block
    break;
  default:
    // code block
}

Looping

Often, in our programs, we may want to execute the same repetitive code block until a certain condition is met. It can be a simple addition or expanded to hundreds of lines of code. For such cases, we have loops to deal with in JS.

• While loop : This loop will keep on being executed as long as the condition is not met.

while (condition) {
  // code block to be executed
}

Here, JS checks the condition first every single time, and then execute the code block.

• Do-While loop : This is very similar to the while loop, and will keep on repeating until the condition is met. However, it is different from the while loop in the way it is executed

Here, JS executes the code block first and then checks the condition. Hence, it will always run for atleast 1 time.

do {
  // code block to be executed
}
while (condition);

• For loop : Often, you may want to run a loop with a given iterator, which counts the number of times the loop is run. The condition can be anything, including based on your iterator. For these purposes, we have the for loop.

for (statement 1; statement 2; statement 3) {
  // code block to be executed
}
Statement 1 is executed (one time) before the execution of the code block.

Statement 2 defines the condition for executing the code block.

Statement 3 is executed (every time) after the code block has been executed.

• Note : You can always suddenly break out of a loop using the break keyword, just like we saw in the switch block above.

Comments

• Comments are written lines of code by the programmer, that are not shown or compiled by JS. These are used to enhance the readability and understanding of the code.
• Another practice done to improve the readability is to indent the code. Ofcourse, JS will compile it the same whether you indent your code or not, but to enhance the readability of the code, divide it into proper segments, we indent the same.

Comments

[Jakub T. Jankiewicz]

It's hard to read your code if there are no indentation. You can use the same as on GitHub 3 backticks and language. it will look like this:

var x = function(y) 
   return y + y;
};

[param-19]

Thanks for the suggestion, I updated it

[Kinanee Samson]

Nice one. Its great to go over the basics again.

[param-19]

Thank you :)