Scribd Logo
Upload

Welcome to Scribd!

  • Cs 3548 4 Js

    Uploaded by

    GSM Xairix
    6 views16 pages
    1. The document provides an introduction to JavaScript (JS), covering topics such as how and where JS is used, basic syntax, functions, arrays, objects, conditional statements, and loops. 2. JS is the programming language of the web and is used to make web pages interactive by dynamically changing HTML content, styles, and hiding/showing elements. 3. JS code can be inserted directly in HTML using <script> tags or referenced externally, and is made up of variables, operators, expressions, and comments following specific syntax rules.

    Original Description:

    Original Title

    cs-3548-4-js

    Copyright

    © © All Rights Reserved

    Available Formats

    PPTX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    1. The document provides an introduction to JavaScript (JS), covering topics such as how and where JS is used, basic syntax, functions, arrays, objects, conditional statements, and loops. 2. JS is the programming language of the web and is used to make web pages interactive by dynamically changing HTML content, styles, and hiding/showing elements. 3. JS code can be inserted directly in HTML using <script> tags or referenced externally, and is made up of variables, operators, expressions, and comments following specific syntax rules.

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    6 views16 pages

    Cs 3548 4 Js

    Uploaded by

    GSM Xairix
    1. The document provides an introduction to JavaScript (JS), covering topics such as how and where JS is used, basic syntax, functions, arrays, objects, conditional statements, and loops. 2. JS is the programming language of the web and is used to make web pages interactive by dynamically changing HTML content, styles, and hiding/showing elements. 3. JS code can be inserted directly in HTML using <script> tags or referenced externally, and is made up of variables, operators, expressions, and comments following specific syntax rules.

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 16

    Web Systems & Technologies

    CS-3548
    Prepared By:
    Junaid Hassan
    Lecturer at UOS M.B.Din Campus
    junaidte14@gmail.com
    Topics:
    Introduction to JAVASCRIPT (JS)
    Intro to JS:
    1. Programming language of HTML and Web
    2. Front end development language
    3. Used to change the layout of web page
    dynamically
    4. Used to add interactivity in web page
    Intro to JS:
    1. JS can change HTML content
    2. JS can change HTML styles (CSS)
    3. JS can hide HTML elements
    4. JS can show HTML elements
    Where & How to use JS:
    1. <script> tag is used to define JS
    2. JS can be placed inside <head> tag or inside
    <body> tag
    3. Another way to define JS is to add JS code in
    external file and then reference it inside web
    page
    JS Example:
    <p id="demo">A Paragraph</p>
    <button type="button" onclick="myFunction()">Try it</button>

    <script>
    function myFunction() {
    document.getElementById("demo").innerHTML = "Paragraph
    changed.";
    }
    </script>
    JS Output:
    1. document.getElementById("demo").innerHTML = 5 + 6;
    2. document.write(5 + 6);
    3. window.alert(5 + 6);
    4. console.log(5 + 6);
    5. <button onclick="document.write(5 + 6)">Try it</button>
    JS Syntax:
    1. JS code lines are separated by semicolon (;)
    2. JS veriables are defined using ‘var’ keyword
    3. JS operators (+, -, *, /)
    4. JS expression is a combination of values, variables, and
    operators, which computes to a value
    5. JS comments (//, /* */)
    6. JS and CamelCase (In JS variables are defined in CamelCase
    e.g firstName etc.)
    JS Functions:
    1. Block of code to perform some task
    2. We have to call that function to perform that task
    3. They avoid repetetion of code
    4. We can use a function multiple times in our code
    5. var x = myFunction(4, 3);
    6. function myFunction(p1, p2) {
    return p1 * p2;
    }
    JS Arrays:
    1. A special variable which can hold multiple values at a time
    2. var items = [“item1", “item2", “item3"];
    3. var items = [
    “item1",
    “item2",
    “item3"
    ];
    4. var items = new Array(“item1", “item2", “item3");
    JS Objects:
    1. Objects are also like variables but they contain multiple
    values
    2. Objects contain properties + methods
    3. Properties are pairs of ‘name’ and ‘value’
    4. Methods are functions
    5. var person = {firstName:"John", lastName:"Doe", age:50,
    eyeColor:”blue”, fullName: function(){return this.firstName
    + “ ” + this.lastName;}};
    6. person.firstName, person[‘firstName’]
    7. person.fullName();
    JS Conditional Statements:
    1. Conditional statements are used to perform an action based
    on a condition
    2. If statement, else, if else, switch statements
    3. if (condition1) {
    block of code to be executed if condition1 is true
    } else if (condition2) {
    block of code to be executed if the condition1 is false and condition2 is
    true
    } else {
    block of code to be executed if the condition1 is false and condition2 is
    false
    }
    JS Conditional Statements:
    1. Switch statement is used to perform different actions based
    on different cases
    2. switch(expression) {
    case n:
    code block
    break;
    case n:
    code block
    break;
    default:
    code block
    }
    JS Loops (For, For/In):
    1. Loops can execuste a block of code a number of times
    2. for (i = 0; i < 5; i++) {
    text += "The number is " + i + "<br>";
    }
    3. For/In loop is used to iterate through the properties of an object
    4. var person = {fname:"John", lname:"Doe", age:25};
    var text = "";
    var x;
    for (x in person) {
    text += person[x];
    }
    JS Loops (While, do/while):
    1. While loop, loops through a block of code as long as the condition is true
    2. while (i < 10) {
    text += "The number is " + i;
    i++;
    }
    3. In do/while loop, block of code will be executed at least once even if the
    condition is false.
    4. do {
    text += "The number is " + i;
    i++;
    }
    while (i < 10);
    References:
    http://w3schools.com/js

    You might also like