How to ruin your code (story) ? โ
๐ As i said earlier , when i was beginning with programming i was so foolish to not to follow coding principles like DRY (don't repeat yourself).
๐ One definition was assigned to me , which was "write a program where have to do addition of 2 numbers 3 times"
๐ The code i wrote earlier :
var num1 = propmt("Enter no : ");
var num2 = propmt("Enter no : ");
var res = 0;
res = num1+num2;
console.log(res);
var num3 = propmt("Enter no : ");
var num4 = propmt("Enter no : ");
res = num3+num4;
console.log(res);
var num5 = propmt("Enter no : ");
var num6 = propmt("Enter no : ");
res = num5+num6;
console.log(res);
๐ This does make sense as a beginner , but when you think in terms of performance optimization , speed and quality of code - this doesn't make any sense.
๐ After that i was introduced to concept known as Function
Functions :
๐ According to internet , Functions are one of the fundamental building blocks in JavaScript. A function in JavaScript is similar to a procedureโa set of statements that performs a task or calculates a value, but for a procedure to qualify as a function, it should take some input and return an output where there is some obvious relationship between the input and the output.
๐ To put it more simply and making it clear we'll go to our previous definition of 3 times of addition. so what we can say is that a perfect function is a mechanism to reduce that 3 times repeating code into simple block of code which can work for 3 or 30 or even 300 times depending on logic inside it. function simply means act of writing a reusable code.
Syntax of function
๐ Making a function can be defined in three steps
Function Definition : telling your compiler that there's a function in our program.
Function Body : Block of code to be executed when function gets called.
Function Call : Calling a function simply tells your compiler that execute the code written in function body in respective context.
How does that looks like?
๐ functions takes parameters as input process it in function body and returns
output.
๐ Parameters simply means input values which function is expecting for further process.
๐ Arguments means actual value passed to the respective parameter
๐ Example
// sum is name of function
// num1 and num2 are params
function sum(num1,num2){
// function body
var res = num1+num2;
return res;
}
//2 and 5 are actual arguments
// function call ();
sum(2,5);
// outputs 7
Rules
๐ Name of function should be unique
๐ Function should be defined somewhere in program before calling it
๐ Function may or may not take parameters
๐ Function may or may not return value
๐ Function can take 0 to n number of parameters depending on need
๐ Function can be called multiple times during execution
๐ Example of function without params and return statements
function greet(){
console.log("Good Morning");
}
// can be called n number of times
greet();
greet();
greet();
Let's make it more optimized ๐
๐ We'll take our addition program and turn it into a super optimized code
๐ in app.js
function sum()
{
var num1 = +prompt("Enter no : ");
var num2 = +prompt("Enter no : ");
return num1+num2;
}
//calls function 3 times
for(var i=0;i<3;i++) {
sum();
}
Let me know in comment section if you have any doubt or feedback. it's always worth to give time to thriving developer community :)
Keep Coding โค