Function Parameters
Function with Return Value
====================
- A function with return value is used to configure function memory that can handle
the operation and result.
Syntax:
function Name(param)
{
return param;
}
- A function can return any type of value, primitive or non-primitive
Ex:
<script>
function Addition(a,b){
return a + b;
}
function GetProduct(){
return {Name:"TV", Price:56000.44};
}
[Link]("Addition=" + Addition(20,40) + "<br>");
for(var property in GetProduct())
{
[Link](`${property} : ${GetProduct()[property]}<br>`);
}
</script>
- Function can return various values and change the return value according to
situation.
Ex:
<script>
function Print(val){
if(isNaN(val)){
return `Hello ! ${val}`;
} else {
val++;
return val;
}
}
[Link](Print(22));
</script>
- Functions with return value are mostly used in designing services.
toUpperCase()
toLowerCase()
SentenceCase()
Ex:
<script>
function SentenceCase(str)
{
var firstChar = [Link](0);
var restChars = [Link](1);
return [Link]() + [Link]();
}
var msg = "weLCOMe tO javaScriPt";
[Link](SentenceCase(msg));
</script>
Ex: Captcha
<!DOCTYPE html>
<html>
<head>
<title>Login</title>
<link rel="stylesheet"
href="../node_modules/bootstrap-icons/font/[Link]">
<style>
dd {
margin-bottom: 10px;
}
</style>
<script>
function Captcha(){
var a = [Link]() * 10;
var b = [Link]() * 10;
var c = [Link]() * 10;
var d = [Link]() * 10;
var e = [Link]() * 10;
var f = [Link]() * 10;
return `${[Link](a)} ${[Link](b)} ${[Link](c)} $
{[Link](d)} ${[Link](e)} ${[Link](f)}`;
}
function LoginClick(){
var username = [Link]("UserName").value;
var password = [Link]("Password").value;
var msg = [Link]("msg");
fetch("../data/[Link]")
.then(function(response){
return [Link]();
})
.then(function(users){
for(var user of users)
{
if([Link]==username && [Link]==password) {
[Link]("<h2>Login Success</h2>");
} else {
[Link]= "Invalid User Name / Password";
}
}
})
}
function bodyload(){
[Link]("code").innerHTML = Captcha();
}
function GetNewCode(){
[Link]("code").innerHTML = Captcha();
}
</script>
</head>
<body onload="bodyload()">
<fieldset>
<legend>User Login</legend>
<dl>
<dt>User Name</dt>
<dd><input type="text" id="UserName"></dd>
<dt>Password</dt>
<dd><input type="password" id="Password"></dd>
<dt>Verify Code <button onclick="GetNewCode()"><span class="bi bi-
arrow-clockwise"></span></button> </dt>
<dd id="code"></dd>
<dd><input type="text" size="6"></dd>
</dl>
<button onclick="LoginClick()">Login</button>
</fieldset>
<h2 id="msg" align="center"></h2>
</body>
</html>
Function Closure
- A function can be defined in another function.
- The members of outer function are accessible to inner function.
- But the members of inner function are not accessible to outer.
- Closure is a technique where inner function can share its members to outer
function.
Ex:
<script>
function Outer(){
var msgOuter = "<b>Message from Outer Function<b>";
function Inner(){
return "Message from Innner" + "<br>" + msgOuter;
}
return Inner();
}
[Link](Outer());
</script>
Function Recurrsion
----------------------------
- Recurrion is a technique of calling a function with in the function.
- It is used to create macros and batch jobs.
Ex:
<script>
function Factorial(n){
if(n<=1)
{
return 1;
} else {
return n * Factorial(n-1);
}
}
[Link](`6 Factorial is ${Factorial(6)}`);
</script>
Anonymous Function
- Function without name is known as anonymous function.
- Anonymous functions are used in "Call Back".
Ex:
<script>
(function(){
[Link]("Welcome to JavaScript");
})();
</script>
Ex:
<script>
var product = function(){
return {Name:"TV", Price: 4600}
}
[Link](product().Name);
</script>
Arrow Functions
----------------------
