Merge pull request #14 from AzharAli-github/main

AzharAli-github · web-flow · commit 34c2a0177be7 · 2023-01-07T10:49:49.000+05:00
Main
diff --git a/JavaScript/Intermediate/8.Errors-Try and Catch(14)/css/style.css b/JavaScript/Intermediate/8.Errors-Try and Catch(14)/css/style.css
@@ -0,0 +1,22 @@
+body {
+    display: flex;
+    justify-content: center;
+    min-height: 97vh;
+}
+
+.InpForm {
+    border: 1px solid black;
+    display: flex;
+    flex-direction: column;
+    width: 30%;
+    align-self: center;
+    padding: 30px 20px;
+    line-height: 30px;
+}
+
+.InpForm button {
+    width: 20%;
+    display: flex;
+    justify-content: center;
+    align-self: center;
+}
diff --git a/JavaScript/Intermediate/8.Errors-Try and Catch(14)/index.html b/JavaScript/Intermediate/8.Errors-Try and Catch(14)/index.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Errors</title>
+    <link rel="stylesheet" href="css/style.css">
+</head>
+
+<body>
+    <div class="InpForm">
+        <h2>JavaScript try catch</h2>
+        <p>Please input a number between 5 and 10:</p>
+        <input id="demo" type="text"><br>
+        <button type="button" onclick="myFunction()">Test Input</button>
+        <p id="p01"></p>
+    </div>
+    <script src="js/script.js"></script>
+</body>
+
+</html>
diff --git a/JavaScript/Intermediate/8.Errors-Try and Catch(14)/js/script.js b/JavaScript/Intermediate/8.Errors-Try and Catch(14)/js/script.js
@@ -0,0 +1,20 @@
+// let Inpt = document.querySelector('#demo');
+// let button = document.querySelector('.button');
+// let message = document.querySelector('#message')
+
+function myFunction() {
+    const message = document.getElementById("p01");
+    message.innerHTML = "";
+    let x = document.getElementById("demo").value;
+    try {
+        if (x.trim() == "") throw "is empty";
+        if (isNaN(x)) throw "is not a number";
+        x = Number(x);
+        if (x > 10) throw "is too high";
+        if (x < 5) throw "is too low";
+    } catch (err) {
+        message.innerHTML = "Input " + err;
+    } finally {
+        document.getElementById("demo").value = "";
+    }
+}
diff --git a/JavaScript/Intermediate/9.Scope(15)/index.html b/JavaScript/Intermediate/9.Scope(15)/index.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Scope</title>
+</head>
+
+<body>
+    <h1>There are Three Types of Scope</h1>
+    <h2>1.Block Scope</h2>
+    <h2>2.Function Scope</h2>
+    <h2>3.Global Scope</h2>
+    <h3>(Open console and JS file for better Understanding )
+    </h3>
+    <script src="js/script.js"></script>
+</body>
+
+</html>
diff --git a/JavaScript/Intermediate/9.Scope(15)/js/script.js b/JavaScript/Intermediate/9.Scope(15)/js/script.js
@@ -0,0 +1,37 @@
+/* There are three type of Scope:
+1.Block Scope
+2.Golbal Scope
+3.Functional Scope
+
+Two main scopes let and const which are block scope were introduced after ES6
+
+*/
+
+// First we will discuss Block Scope
+
+var a = 2;
+console.log(a);
+
+let b = 3;
+console.log(b);
+
+const c = 4;
+console.log(c);
+
+
+// Now we will discuss about Functional Scope
+
+function Scope() {
+    let d = 3; //In functional scope the variable are declared inside the function and cannot be accessed outside
+    console.log(d);
+}
+
+// Global Scope
+
+let e = 9; // In Global Scope variables are Global they can accessed inside a function and anywhere in the Program
+
+function Display() {
+    console.log(e);
+}
+console.log(e);
+// Do not try to use Global Scope Unless you intend because your global variables and functios can overwrite the window
