JavaScript: Function()
A Simplified introduction to JavaScript function()
As someone who loves learning new things, and practicing a lot, one of my decisions is to share and document what I'm learning as much as I can. if you're someone like me who also love learning then I'm pretty sure you will gain one or two things from the blog. As part of my learning and sharing journey in JavaScript, this will be the very first part in which we will be looking at the JavaScript function block.
I'm very sure that you might have read a lot of articles and Docs about the javascript function, or probably some YouTube videos from some experts, but one thing I love doing while learning is simplifying things for myself as much as I can, and that's what I want to share with you here.
What is a Function?
JavaScript functions are blocks of reusable code that perform a specific task when called. Think of a function as a water dispensing machine that has two buttons one for hot water and the other for cold water, when any of the buttons are pressed the machine brings out the water base on the button pressed, How either of the water is produced is none of our concern, all that we want is to perform the instruction given to. This is precisely how the javascript function works, they perform a specific task we ask them to perform when we call them, just like when we press the water dispenser button.
Things to know
There are some attributes to be included while defining javascript functions, which are listed below:
Function: This is the keyword used when declaring a function.
functionName: This is the name you want to give to your function. The function will be referenced with the name.
Parameters: These are optional, comma-separated values enclosed in parentheses. They act as placeholders for data you can pass into the function.
function Body: The block of code enclosed in curly braces
{}
that contains the instructions to be executed when the function is called.Arguments: These are the values you pass to the function when calling it. They match the parameters defined in the function declaration.
Here is an example:
I know it's quite challenging and confusing to know the differences between declaring a variable and a function as a newbie, that is why I curated a list of the differences between them.
Differences Between Variable And Function
- Purpose and Usage:
Variable Declaration:
Variables are used to store and manage data, such as numbers, strings, objects, or functions.
Variables hold values that can be accessed, updated, and used in various parts of your code.
Function Declaration:
Functions are used to define reusable blocks of code that can perform specific tasks or operations.
Functions are invoked (called) to execute the code they contain. They can also accept inputs (parameters) and return outputs (values).
Syntax
Variable Declaration:
Variables are declared using the
var
,let
, orconst
keyword, followed by the variable name.
Function Declaration:
Functions are declared using the function
keyword, followed by the function name, parentheses for parameters (if any), and curly braces for the function body.
Parameters and Return Values:
Variable Declaration:
- Variables do not have parameters or return values. They simply store data.
Function Declaration:
Functions can have parameters, which are variables that receive values when the function is called. They can also have a
return
statement to send a value back to the caller.
Conclusion:
If you made it to this point I'm very sure you would have learnt one or two things today on javascript function. In conclusion, JavaScript functions are the building blocks of dynamic and interactive web development. They allow developers to encapsulate sets of instructions, making code reusable, organized, and easier to maintain.