Common and very Important Terms to Learn in JavaScript Course Training

JavaScript, first known as livescipt, is programming language that turns web pages into application. It is a programming language with rich interface which is used to manipulate contents of html pages and allow users to interact. One of the main advantage of JavaScript is that it can provide user feedback instantly and can improve user experience by preventing unnecessary processing. One of the major strengths of it is that it does not require expensive development tools, we can start it with simple text editor such as notepad or sublime text.

Common and very Important Terms to Learn in JavaScript Course Training

If you are attain JavaScript course then learning the most common terms are necessary for the understanding of this language. So, I am explaining all the important terms which I have collected out with the help of Mr. Ravi Sir who is my faculty in this JavaScript training institute.

1. Variables

The first term which one should understand in their classes of JavaScript is variable as other programming languages don’t offer variables. Variables can be defined as named containers that are used to store data values. The process of storing values in variable is called variable initialization and the process of creating a variable is called ‘declaring’ a variable. JavaScript variables are case sensitive, ‘name’ and ‘Name’ are two different variables.

For example:

var name = ‘ali’;
var age= 24; //from this example, age is name of variable that hold the data regarding age.

*we can even declare a variable without value and that variable is known as undefined variable.

For example:

var person;

All JavaScript variables are identified with unique name and these names are called identifiers and identifiers can as short as ‘x’ and ‘y’ or descriptive like ‘age’, name’, etc.

The scope of variable is the region in our programme where it is define and JavaScript variable have two scopes only i.e. local and global variable.

• Local variable: that variable which is visible only within a function where it is defined
• Global variable:  that variable which has global scope and can be defined anywhere in the JS.

We can declare as many variables as we want in one statement separated by comma

var person = “john”, age = “24” ;

2. Operators

Operators in JavaScript are one of the important terms which you can not ignore during your advanced JavaScript training. They perform various primary tasks such comparing and assigning of values along with the process of arithmetic operations. 4+5=9 here 4, 5 are the operands and + is operator. There are some types of operators in JavaScript which are given below.

• Arithmetic operators: these operators are used to perform arithmetic operations on numbers

Operators	Descriptions
‘+’	Addition operator which is used to add two operands
‘*’	Multiplication operator that multiplies two operands
‘/’	divides two operands
‘%’	Modulus-  that gives remainder
++	Increments the number
—	Decrements the number

• Comparison operator – comparison operators are used in logical statements to determine equality or difference between values or variables.

Operators	Descriptions
‘==’	Equal inspects if the value of two operands are uniform or they are unequal.
‘!=’	Not equal inspects if the value of two operands are alike or not, if the values of both operand are not equal then the condition become true.
‘<’	Less than checks if left operand is less than the value of right operand
‘>’	Greater than checks if  value of left operand is greater than the value of right operand
>=	Greater than or equals to Checks if value of left operand is greater or equal to the value of right operand
<=	Less than or equals to Checks if value of left operand is less or equal to the value of right operand

• String operators – when used on strings + operator is known as concatenation operator.
• Assignment operators –  (=)These operator are used to assign values to variables.

var x= 5; // here x holds the value 5 as it is assigned to it.

There are many other assignment operators e.g. +=, -=, *= etc.

• Logical operators –  JavaScript also supports logical operators and they are && logical, | | logical, or ! Logical not
• Bitwise operators
• Conditional operator
• Typeof operator

3. Strings

JavaScript strings are used to storing and manipulating text. Strings are primitive values created from the literals and they can be defined as objects also

For instance,

var myAge = "12"; // string approach
var myAge =  new Number (12); // this is object approach

Strings can be written in double or single quotes but there are some sentences that already contains quote and it must be difficult for JavaScript to understand them so to avoid misunderstanding we use backslash escape character {\}

4.  Arrays

Arrays are also of the essential topics of JavaScript course which are the list of things and these things can be anything for ex – list of colors list of fruits or even list of lists. JavaScript offers a range of arrays.

Literal array

var fruits = ['kiwi', 'guava', 'banana'];
// array are written in [] these brackets and items inside that is separated through comma

fruits[0];
// here [0]is the index number of kiwi and this code will access kiwi.

Condensed array

var fruits = new Array('kiwi', 'guava', 'banana');
fruits[0]; // kiwi

Associative array

var colors = new Array();
colors['border'] = 'red';
colors['background'] = 'green';
colors['border'];
//red *in this particular type we have keys rather than having index numbers *

Multidimensional arrays

var colors = ['red', ['green', 'blue']];
colors[1][1];
// In this we have an array inside array and this code will be used when we want to access the color blue that resides inside the another array.

5. Methods

As we all know JavaScript is an object-based language and object has certain properties and methods that goes hand in hand with them. A method is a set of commands that influence the property of object. Don’t ignore methods while JavaScript training.

For example

<script type="text/JavaScript">
     alert("\"hello\"have a nice day");
</script>

Alert is method under window object that shows the dialog box with message in the window

prompt() is another method under window object that prompts the user for information.

Now we see methods of array and strings:

Suppose let’s take a variable

var fruits = ['kiwi', 'guava', 'banana']; 

• .length – this method measures the length of the array

alert(fruits. length);//3

*length is a property and made through variables whereas methods are formed through functions are have parentheses()*

• .pop– this picks the last value from the array and deletes that particular value

alert(fruits.pop()); // the result will be [‘kiwi’ , ‘guava’]

• .push() – this adds the value in the end of the array

alert(fruits.push(apple)); // the resultant array will be [‘kiwi’ , ‘guava’ , ‘apple’]

• .unshift() – it also adds the value but in the beginning of the array and returns the new length of array.

alert(fruits. Unshift(mango));// this will lead to [  ‘mango’ ,‘kiwi’ , ‘guava’ , ‘apple’]

• .shift ()– this deletes the initial value of the  resultant array

alert(fruits. shift(mango));// this will lead to [ ‘kiwi’ , ‘guava’ , ‘apple’]

• .slice() – this method is used to slice out a piece from array.

alert(fruits. slice(0,2));// this will results in [‘guava’] *here 0 and 2 are both index value of the data and in above value 0 is the index value of kiwi and 2 represents apple so when I entered 0 and 2 it deleted those two and give result as [‘guava’]*

• .join() –  this method is used in joining multiple elements of an array into string.

6. Conditions

Conditionals are control structure which are used to make decision. These conditionals are used when we need to adopt one from given set of paths and IF is the main conditional statement. The IF statements are executed only if the condition in IF statement is true otherwise else statement is executed in case of false situation. According to experts conditions should be taken as a serious topic by a JavaScript beginner during his training.

Following are the forms of conditionals

• if conditional
• if …. else conditional
• if … else if … conditional.

For example

function myFunc(){                 
    var age = prompt('enter your age');
        if (age >= 18) {
           var conf = confirm(you want to proceed);
           if (conf == true) {
               alert('you are eligible to vote');
           }else{
               alert('you might not be eligible to vote');
           }
     }
}

For example

If the value of variable is blue change it to red otherwise change it to green.

var color= “blue”;
if( color == blue ){
     color = “red”;
}else{
     color = “green”;
}

7. Loops

To get our scripts actually do something we need some control structure like conditionals, loops are also control structure that is used to repeat statement more than once. Loops are handy in that case where we  want to run the same code over and over again, each time with a different value.

• for – loops which is used when we want to execute group of statement for specific number of time  for example

<p id="demo"></p>
<script>
  var text = "";
  var i;
  for (i = 0; i < 5; i++) {
     text += "The number is " + i + "<br>";
  }
  document.getElementById("demo").innerHTML = text;
</script>

Output

The number is 0

The number is 1

The number is 2

The number is 3

The number is 4

• for/in – loops through the properties of an object.
• while – while loop is used when we want to execute set of statements until the condition is satisfied.
• do/while – also loops through a block of code while a specified condition is true.

8. Functions

Function is a block of code that is designed to perform a particular set of tasks and it perform that specific task only when it is called or invoked. A beginner who just started attaining JavaScript course training should have an insight understanding on functions. At function is defined with the function keyword, followed by a name, followed by parentheses (). Function names can contain letters, digits, underscores, and dollar signs (same rules as variables) The parentheses may include parameter names separated by commas functions are useful as they are handy as they are coded once and used many times.

A JavaScript function can have optional return statement. Return statement is written at the end of the function to stop the execution of that particular function.

In earlier JavaScript function definition was not allowed (except in top level global code) but JavaScript1.2 allows the function definitions be nested within other function but it poses a restriction that particular function may not reside /appear inside loops or conditionals.

For example

function myfunc(){
     alert(‘hello’);
}
myfunc();

9. Regular Expression and Validation

Regular expressions are object that describes the sequence and pattern of character.

A regular expression is an object that describes a pattern of characters. The JavaScript RegExp class represents regular expressions, and both String and RegExp define methods that use regular expressions to perform powerful pattern-matching and search-and-replace functions on text. A regular expression could be defined with the RegExp() constructor.

Syntax:

var pattern = new RegExp(pattern, attributes);

Pattern: It describes and defines the pattern of regular expression.

Attributes: A string containing any of the “g”, “i”, and “m” attributes that specify global, case-insensitive, and multiline matches, respectively.

These g, i, m, are modifiers, which are used to simply the way of the work

Brackets are other important thing in regular expression as they are used for finding range of characters.

Regular expressions are often used with 2 strings methods: search() and replace()

search() – it searches for a match and returns the positive of the match

replace() – it return the modified string where pattern is replaced

Validation using RegExp

JavaScript as offers a quick user feedback it become necessary to validate whether the provided information is as per required needs or not. Validation is required normally when client has entered all the necessary information and pressed the submit button and JavaScript provides way to validate the data. Validation serves two purposes

Example – phone number validation:

function phonenumber( inputtxt )
{
     var phoneno = /^[0-9]{3}[-. ]?[0-9]{3}[-. ]?[0-9]{4}$/;
     if( inputtxt.value.match(phoneno) )
     {
          return true;             
     }
     else             
     {                         
          alert("enter a valid phone number.");        
          return false;             
     }
}

10. Literals

Literals are the explicit storage. It is the value that is stored and the value is written exactly as it meant to be interpreted.

 var myAge = 12; \\ this stored value is literal

 Common type of literals are:

• Number literal – var age = 25;
• String literal – var name = ‘admec’;
• Boolean literal – var booked = true;
• Array literal – var colors = [‘red’, ‘green’, ‘blue’];
• Object literal – var book = {‘title’:’The Igninted Minds’, ‘author’:’APJ Kalam’, ‘price’:’Rs. 250’};

11. DOM – Document Object Model

Every web page resides into a browser and when web page is loaded, the browser creates a Document Object Model of the page. The DOM is a API that allows access and modification of all document content that are standardized under W3C. This W3C DOM defines methods and allows scripts to manipulate. This allows programmes and scripts to dynamically access and update the content structure and style of document.

It is separated into 3 parts:

1. Core DOM – core DOM model is for all document types.
2. XML DOM – XML DOM supports XML documents
3. HTML DOM – it is suitable for HTML documents. It is standard object model and programming interface for HTML

Note: Here I would like to point one important point also. Angular and React these are two very famous frameworks of JavaScript. They offer DOM manipulation also where Angular uses regular DOM while React uses virtual DOM concept.

12. JSON – JavaScript Object Notation

JSON is a format provided for structuring data. It usually transfers data between server and web pages. It is light weight data interchange format. This JSON is built on 2 structures.

• A collection of name/value
• Ordered list of values i.e.  data is sequence, vector list or as an array

13. API

API is set of functions that allows creation of application which access the features or data of an operating system application or other service. It allows two software to talk to each other and it also specifies how components should interact. It provides set of routines protocols that allow users to build software application.

Very basic examples of API which I have for you are HTML5 APIs. HTML has introduced few JavaScript enabled APIs in its recent version and they are:

• Canvas – to create animation and graphics on runtime
• Drag & Drop – enables drag and drop functionality in html pages
• Geolocation – gives you altitude and longitude to trace the geolocation
• Audio and Video – to develop high level music and video players app

14. Event and Event Handling

When a JavaScript interacts with html content and browser loads that page after an interaction by the visitor or web apge, it is called event a significant part of your JavaScript course training. Event are things that happen to HTML elements. Events are part of DOM and every html element contains a set of events which can trigger JavaScript code. Developers use these events to execute JavaScript coded responses. 

Events	Occurs when	Event Handling
click	User clicks on form element or link	onClick
change	User changes value of text, text area or select elements	onChange
focus	User gives focus on element	onFocus
blur	User removes input focus form element	onBlur

These are some common events listed above in the table

An event handler is software that processes actions such as keystrokes and mouse movements event handlers are used to make content dynamic

15. Statements

Programs are list of instructions carry out by computers, and these instructions are called statements. JavaScript consists of statements there can single statement or multiple statements separated by a comma (,).

Types of statements

 a. Control flow statements 

This category includes following statements

• Break
• Continue
• If..else 
• Throw

b. Declaration statements – that includes var , let , const

c. Function and classes

d. Iterations which includes all loops

16. Popup

JavaScript offers 3 kinds of popup which includes:

• ALERT DAILOG BOX
  Alert dialog box is frequently used when we want to give a warning message. It is displayed using a method alert().
• CONFIRM DAILOG BOX
   confirm dialog box is used when we need user’s consent on any option in and that particular case we use confirm box.
• PROMPT DAILOG BOX
  when we want user input we uses prompt box as it helps us to interact with user.it is displayed using a method called prompt().

17. Compiler

JavaScript is an interpreted language not a compiled one and it requires to be compiled before running. A source code is passes through a program called compiler which translates the bytecode for understanding and execution. 

18. Instance and Instantiation

Instance is an object in memory and the process of using it is called instantiation. A class is a blueprint from which objects are created and instance is a single and unique unit of a that class.

19. Booleans

Booleans are type of data type which have only two values i.e. true or false or yes or no. they are used to represent true conditions.

20. Primitives and Reference Values

A variable can hold one of two value types: primitive values or reference values. A property can reference an object or a primitive. Primitives are values, they have no properties and objects are aggregations of properties.

• Primitive values are data that are stored on the stack (static memory allocation).
• Primitive value is stored directly in the location that the variable accesses.
• Reference values are objects that are stored in the heap (dynamic memory allocation).
• Reference value is stored in the variable location is a pointer to a location in memory where the object is stored.
• Primitive types include Undefined, Null, Boolean, Number, String, Symbol (new in ES6).

21. Data Types

The most basic and important characteristic of programming language is the kind of data types that it supports. Data types are the values that are stored and manipulated according to the user’s wish. To ensure its operation on variables we must know the type of data and JavaScript. Such data types play important roles along with JavaScript and this make necessary to learn these data types very seriously in Javascript course training classes.

JavaScript allows us to work on these primitive data types

• Numbers: 123,456,789,12.3,0.5
• Strings: “john”
• Booleans: true or false, yes or no.
• Null
• Undefined
• Object

JavaScript also provide us two trivial data types that are used to store single value and these data types are null and undefined.

22. Objects, Properties, and Methods

JavaScript is an object-oriented language that has capability of storing information, of storing object inside another and also can write one function that works in different ways. Objects are composed of attributes.

Objects are similar like variables but they can store too many values.

For example:

var person= {name: ‘aman’, age: ‘24’};

• Properties

Object properties are variables that are used internally in the object. As we know objects are composed of attributes. If that attribute holds a function in it then that is method of the object otherwise the attribute is considered to be a property of object.

If we consider above example again

var person= {name: ‘aman’, age: ‘24’};

Property	Property value
Name	aman
Age	24

• Methods

Methods are function that supports the object to do something. We should understand the difference between a function and a method. On one hand where function is standalone unit of statement, method is attached to an object on the other hand and method is referred with the help of *this* keyword. They are useful for everything from displaying content to perform arithmetic operations.

For example:

var person = {
     name: 'aman',
     run: function (){
          return this.name + “ runs very fast”;
     }
}

Output: console.log(person.run());// aman runs very fast

Thus, we can say JavaScript is an effective, versatile and easy language that can be used to provide the dynamism in static HTML pages. It appears to be one of the major language in web industry that provide benefits in large number of ways.

About Author: Hi, I’m Bhumika Arora, pursuing Multimedia Master course from ADMEC. My main motive to write on this topic was to explore the JavaScript in-depth. I hope my efforts will be beneficial for you to grasp this versatile language in a better way.

There are many other JavaScript blogs which you can explore to have an insight understanding on the basics and fundamentals of JavaScript. Share your views on this blog in the below given comment box.