Javascript Fundamentals

0
1254

Today we are going to start an introduction to Javascript and JQuery. It is used to do some processing in a webpage. In this tutorial we will learn Javascript fundaments that will be explained in detail in further tutorials.
Let’s start with an introduction to Javascript.

  • What is Javascript?
    • Javascript was originally created by Netscape and was called ECMAscript.
    • Javascript is the main scripting language of the Web and can be executed by all types of web browsers.
    • Javascript runs on the client as opposed to the server.
    • Javascript is different from Java. It has nothing to do with Java programming language.
  • Uses of Javascript?
    • Javascript is used for the following things :
      • HTML Form Validation – to validate input elements for email, phone number etc.
      • Event Handling – to perform some action on an element we can use javascript libraries such as JQuery that contain various functions and events such as click, hover etc.
      • Javascript powers HTML5 features.
      • Using javascript we can also provide searching and autocomplete feature on the webpage.
      • Animations.
      • JQuery, Ajax and other libraries are all written in javascript.
  • Adding Javascript to an HTML page:
    • We can add a javascript code to an HTML page using

      tags.
    • These tags can be placed in head section as well as in body section.
    • We can add the javascript code to HTML page in two ways:
      • Write the javascript code directly in the script tags in HTML page
      • We can attach a separately written javascript (.js) file to the HTML page.

      Let’s see an example.

    • Here, the statement “inline Javascript goes here” inside the tags indicates the actual code written in javascript. It is called inline here, because the code will be written within HTML page.
    • The next statement, indicates that the externally written javascript file named “myscript.js” is attached to the HTML page to perform various actions.
  • Javascript Variables:
    • Variables in any language are the placeholders that can store different datatype values in it.
    • There are rules to define a variable.
    • Variables should start with a letter.
    • Variables are case sensitive
    • Declaration of an empty variable x is shown below:
    • Here var is a keyword used to declare a variable.
    • Declaration of variables with assignment of a value is shown below:
    • Here, two variable declaration statements are shown above.
    • The two statements are one and the same, i.e. they will do exactly the same work of declaring a variable y with value 4 assigned to it.
    • From this you might have understood that var keyword is not compulsory. We can declare variable without var keyword also.
  • Javascript Arrays:
    • Array is just a variable that holds more than one values.
    • Variables have a property to hold a single value. But if you want to store more values under a single variable, you can definitely use arrays.
    • Declaration of arrays is shown below:
    • If you want to store values in this array, you can store it as follows:
    • Array index starts from zero(0).
    • You can assign values as shown above at every index.
    • Next way of declaring array along with the assignment of values is shown below:
    • This creates an array of cars with values assigned to it as parameters.
  • Javascript Loops:
    • Loops are used to run the same code over and over until a certain condition is met.
    • The loops in javascript are shown below:
      • For Loop: It loops through a block of code a number of times. You usually know the number of times.
      • While Loop: It loops through a block of code until a condition is true. You usually don’t know the number of times.
      • For In Loop: It loops through array object values.
      • Do—While Loop: It is same as While loop, only it checks the condition at the last. It is not used frequently.
  • Javascript Loop Syntax:
    • Here, we will see syntaxes of for loop and while loop to get an idea of the loops.
      1. For Loop:
        • In for loop, the initialization, condition check and increment/decrement is done in a single statement.
        • document.write(); is a command that is used to print the output on the screen.
        • The loop will repeat 5 times, since the condition will remain true until i=4.
      2. While Loop:
    • For while loop, we need to first initiate the variable before starting the loop.
    • Then the condition is checked, if condition is true the given statements in the curly braces are executed.
    • The output of both the above loops will be:
      number0
      number1
      number2
      number3
      number4

  • Javascript Functions:
    • A function is a block of code that runs when it is called.
    • It is mostly used to reduce the length and complexity of the program.
    • If a program requires same code to be written in most of the places, we can write function for it once and call it wherever required, thus reducing the programmer’s work.
    • Syntax for creating a function:
    • The function is defined with a keyword function followed by a function name and paranthesis.
    • Whatever statements present inside the opening and closing curly braces form the body of the function.
    • The function is not executed unless it is called.
    • Syntax for calling a function:
    • Calling a function is very simple. Just write the function name with paranthesis.
    • A function can have parameters also.
  • Javascript Objects:
    • Everything in javascript is an object.
    • Some built in objects are: String, Date, Array, Function, etc.
    • Objects have properties or characteristics.
    • In javascript properties can be accessed as follows:
    • An example is shown below:
    • Here, x is equal to 5 as it is equal to the length property of the “greeting” variable.

    Thus we finished with an overview of Javascript Fundamentals. We will study each topic in detail in further tutorials.

LEAVE A REPLY

Please enter your comment!
Please enter your name here