Update 11_JS_Functions.html

thenaveensaggam · web-flow · commit cf60cdad0c13 · 2018-04-09T21:22:01.000+05:30
diff --git a/JS_Starter_Template/11_JS_Functions/11_JS_Functions.html b/JS_Starter_Template/11_JS_Functions/11_JS_Functions.html
@@ -6,18 +6,18 @@
     <style>
         body{
             margin: 0;
-            font-family: "Comic Sans MS",sans-serif;
+            font-family: "Comic Sans MS", sans-serif;
         }
         h2{
             background-color: lightgreen;
             text-align: center;
             padding: 10px;
         }
         div{
-            background-color: seagreen;
-            padding: 10px;
+            background-color: orange;
+            color: black;
             text-align: center;
-            color: white;
+            padding: 10px;
         }
     </style>
 </head>
@@ -31,40 +31,110 @@ <h1 id="display"></h1>
 </body>
 
 <script>
-
     //creation of a simple function with no args and execute a function
+    var output = "";
+    //function Declaration / Definition
+    function greet() {
+        output = "Hey! Iam a function";
+        console.log(output);
+        document.getElementById('display').innerHTML  = output;
+    }
 
+    // Function Execution
+    greet();
 
     //creation of a simple function with args
-
+    function greetArgs(name) {
+        output = "Good Morning " + name;
+        console.log(output);
+        document.getElementById('display').innerHTML  = output;
+    }
+    greetArgs("Naveen");
 
     // executing a function with less number of params
-
+    function greetLessArgs(name,age) {
+        output = "Hello! Mr. " + name + " you are " + age + " Years Old!";
+        console.log(output);
+        document.getElementById('display').innerHTML  = output;
+    }
+    greetLessArgs("John");
 
     //executing a function with more number of params
-
+    function greetMoreArgs(name,age) {
+        output = "Hello! Mr. " + name + " you are " + age + " Years Old!";
+        console.log(output);
+        document.getElementById('display').innerHTML  = output;
+    }
+    greetMoreArgs('Smith',35,"Manager");
 
     //function overloading is not possible here
 
-
     // functions with return values
-
+    function greetWithReturn(name) {
+        output = "Good Evening " + name;
+        return output;
+    }
+    var greetMessage = greetWithReturn("Naveen");
+    console.log(greetMessage);
+    document.getElementById('display').innerHTML  = greetMessage;
 
     //function with empty return /no return
-
+    function greetWithEmptyReturn(name) {
+        output = "Hey! " + name;
+        return;
+    }
+    var greetReturn = greetWithEmptyReturn("Naveen");
+    console.log(greetReturn);
+    document.getElementById('display').innerHTML  = greetReturn;
 
     // function Expressions with name and execution
-
+    var greetMsg = function greet() {
+                       output = "I am a Function Expression";
+                       console.log(output);
+                       document.getElementById('display').innerHTML = output;
+                    };
+    greetMsg();
 
     // Anonymous Function Expression and execution
-
+    var greetMe = function() {
+        output = "I am an anonymous Function Expression";
+        console.log(output);
+        document.getElementById('display').innerHTML = output;
+    };
+    greetMe();
 
     // Functions as arguments without args
-
-
+    function greet1() {
+        output = "Iam greet1 Function " ;
+        console.log(output);
+        document.getElementById('display').innerHTML = output;
+    }
+    function greet2() {
+        output = "Iam greet2 Function " ;
+        console.log(output);
+        document.getElementById('display').innerHTML = output;
+    }
+    function greetEngine(fName) {
+        fName();
+    }
+    greetEngine(greet2);
 
     // Functions as arguments with args args
-
+    function greet1Args(name) {
+        output = "Hey! " + name + " Iam from greet1Args Function";
+        console.log(output);
+        document.getElementById('display').innerHTML = output;
+    }
+    function greet2Args(name) {
+        output = "Hey! " + name + " Iam from greet2Args Function";
+        console.log(output);
+        document.getElementById('display').innerHTML = output;
+    }
+
+    function greetArgsEngine(fName,name){
+        fName(name);
+    }
+    greetArgsEngine(greet1Args,"Naveen");
 
     // Functions in Objects and Execution
 
@@ -79,8 +149,9 @@ <h1 id="display"></h1>
      */
 
 
+
     // Default Function Arguments (arguments)
 
 
 </script>
-</html>
+</html>
