First Step into JavaScript — Part 3

Vishnu
The Startup
Published in
5 min readJan 12, 2019

Here we are going to learn more about Conditional Statements, loops, and functions in JavaScript. To Check the previous article go here.

Javascript basics 3 designed by Vishnu

Conditional Statements:

Consider the Phone store example from the values and types. If the store manager is asking you whether you need a Screen protector for your mobile then it is 10.33. For this, the store manager asked you to make a decision. For this, you may first consult the current state of cash in your wallet or your bank account to purchase the Screen protector. But this is obviously the Yes or No answer.

var bank_Balance = 400;
var screen_Protector = 245;
if(screen_Protector <= bank_Balance)
{
console.log("Then Purchase the Screen protector")
}
else
{
console.log("No money so don't buy it");
}

The if statement requires an expression in between the parentheses ( )that can be treated as either true or false. In this program, we provided the expression screen_Protector <= bank_Balance, which indeed will either evaluate to true or false depending on the amount in the bank_Balancevariable. You can even provide an alternative if the condition isn’t true, called an else clause.

As we discussed in “Values & Types” earlier, values that aren’t already of an expected type are often coerced to that type. The if statement expects a boolean, but if you pass it something that's not already, coercion will occur.

Loops:

When there is a long waiting list of customers who need to buy the phone from the store employee. While there are still people on the list then she just needs to keep serving to the next customer in the queue.

Repeating certain action until certain condition fails is the job of the programming loops, loops can take different from, but they satisfy the basic behaviors.

A Loop includes a test condition as well as a block. Each time the loop block executes, that’s called Iteration.

For example, the while loop and the do..while loop forms illustrate the concept of repeating a block of statements until a condition no longer evaluates to true:

while(noOfCustomers > 0)
{
console.log("Welcome to the Store");
noOfCustomers = noOfCustomers-1;
}
//versusdo
{
console.log("Welcome to the store");
noOfCustomers = noOfCustomers-1;
}
While(noOfCustomers > 0);

The only practical difference between these loops is whether the conditional is tested before the first iteration (while) or after the first iteration (do..while).

In either form, if the conditional tests as false, the next iteration will not run. That means if the condition is initially false, a while loop will never run, but a do..while loop will run just the first time.

We can use JavaScript’s break statement to stop a loop. Also, we can observe that it’s awfully easy to create a loop that would otherwise run forever without a breaking mechanism.

var i = 0;
While(true) // this while loop will run forever
{
if((i <=9) === false) // to stop the loop we use condition.
{
break;
}
console.log(i);
i = i + 1;
}
// 0 1 2 3 4 5 6 7 8 9

To write the above code better, Though while and do while does that work, there is another syntactic form called a For loop for just this purpose.

for(var i=0; i<=9; i++)
{
console.log(i);
}
// 0 1 2 3 4 5 6 7 8 9

The For loop has three clauses, the Initialization clause ( var i = 0 ), the conditional clause ( i≤9 ) and the update clause( i++ ). So if you are going to do counting with your loop Iterations, For loop is the easier form to understand and write the looping concepts.

Functions:

The phone store employee probably doesn’t carry around a calculator to figure out the taxes and final purchase amount. That’s a task she needs to define once and reuse over and over again. Odds are, the company has a checkout register (computer, tablet, etc.) with those “functions” built in.

Similarly, your program will almost certainly want to break up the code’s tasks into reusable pieces, instead of repeatedly repeating yourself repetitiously (pun intended!). The way to do this is to define a Function.

A Function is generally a named section of the code that can be called to perform the code inside it each time.

function printPrice()
{
console.log ("Total is " price.toFixed(2));
}
var price = 12500;
printPrice(); //Total is 12500

Functions can optionally take arguments (aka Parameters ) — values you pass in. They can optionally return a value as well.

function printPrice(price)
{
console.log("The total is " price.toFixed(2));
}
function currencyAdder()
{
return "Rs" + amount.toFixed(2);
}
printPrice(10); // The total is 10;
var amount = 20;
amount = currencyAdder(); // Rs 20

Another one example for the loops

function printPrice(price)
{
price = price + 20;
return;
}
printPrice(20);
console.log(The return value is + printprice(20));

Scope:

Let’s take the phone example, If you ask a certain Phone model to the store employee and that she doesn’t have in the store. She has access to her Store. You need to go search for other Store’s to purchase that mobile.

Programming has a term for this concept. It’s called Scope. In Js, each function has its own scope. The scope is basically a collection of variables as well as the rules for how those variables are accessed by name. The only code inside that function can access that function’s scoped variables.

A variable name has to be unique within the same scope — there can’t be two different a variables sitting right next to each other. But the same variable name a could appear in different scopes.

function one()
{
var a = 10;
console.log(a);
}
function two()
{
var a= 20;
console.log(a);
}
one(); // 10
two(); // 20

Also, a scope can be nested inside another scope

function out(){
var a = 1;
function in(){
var b = 2;
console.log(a + b); // 3
}
in();
console.log(a); // 1
}
out();

Happy Coding!

If you like this article then don’t forget to clap. Thanks for the time and effort.

I am Vishnu, a Self-taught Developer/Designer working in a Product development Startup called Customerlabs. We are thriving to create a Digital Marketing Infrastructure and making Digital Marketers life easy on the go. If you are a digital marketer or working in a Startups then do please check us out here.

This story is published in The Startup, Medium’s largest entrepreneurship publication followed by +409,714 people.

Subscribe to receive our top stories here.

--

--

Vishnu
The Startup

Building something cool on Internet | Educator | Entrepreneur | Ex-Product Design @customerlabs — I just live one day at a time.