What is Javascript?

Javascript (often called JS) is high-level, dynamic, untyped and interpreted programming language. HTML, CSS and JS are the three core technologies of world web production. This language supports object-oriented programming, imperative and functional programming. It has an API for working with text, arrays, dates and regular expressions, but does not include any I/O, such as networking, storage, or graphics facilities, relying for these upon the host environment in which it is embedded.

Although there are similarities in syntax and standard libraries between Javascript and JS, these are two fairly different languages with fairly different purposes and different structural design. Javascript is used to program the behavior of web pages, make web pages dynamic, run a function when a button is clicked and also allows us to retrieve data from a database and what not!

Why do we need it?

The main use of Javascript is that it allows you to make things happen in the user’s browser without sending messages back and forth to the server. There are a variety of reasons why you might want to do this.

For example, sending a message to the server and getting a reply is a relatively long process: it is almost always a noticable time lag, and can take many seconds. Doing something directly in the browser can be much faster. So if, for example, you want to give the user an “invalid data” message of some sort, it can be much faster if it comes from Javascript.

Some merits of Javascript are as follows.

Javascript is quite easy to implement. You just need to put your code in the HTML document and tell the browser that it is Javascript.
Javascript allows you to create highly responsive interfaces that improve the user experience and provide dynamic functionality, without having to wait for the server to react and show another page.
Javascript can load content into the document if and when the user needs it, without reloading the entire page — this is commonly referred to as Ajax.
Javascript can test for what is possible in your browser and react accordingly — this is called Principles of unobtrusive Javascript or sometimes defensive Scripting.
Javascript can help fix browser problems or patch holes in browser support — for example fixing CSS layout issues in certain browsers.

How to use it?

Basics of Javascript

There’s a few ways to try out Javascript, and when learning it’s best to try them out to see what works for you. But first, how does Javascript relate to HTML and CSS?

Mostly, Javascript runs in your web browser alongside HTML and CSS, and can be added to any web page using a script tag. The script element can either contain Javascript directly (internal) or link to an external resource via a src attribute (external).

A browser then runs Javascript line-by-line, starting at the top of the file or script element and finishing at the bottom (unless you tell it to go elsewhere).

Internal

You can just put the Javascript inside a script element:

<script>
    alert("Hello, world.");
</script>

External

An external Javascript resource is a text file with a .js extension.

To add a Javascript file to your page, you just need to use a script tag with a src attribute pointing to the file. So, if your file was called script.js and sat in the same directory as your HTML file, your script element would look like this.

<script src="script.js"></script>

Using REPLs

We can even install node and use that as an REPL (Read-Evaluate-Print-Loop) and for running scripts in bash or zsh. We can also use the browser’s in-built console where we can run JS commands.

Variables

Storing data so we can use it later is one of the most important things when writing code. Fortunately, Javascript can do this! If it couldn’t, it’d be pretty useless.Variables can be used to store strings and numbers .

Some examples are as follows.

var name = "Tom";
var age = 20;

Conditionals

The `if` statement

It is very simple and is similar to most programming languages you would know: if some logic (the condition) is true, run a block of code. The most simple if statement looks something like this.

if (10 > 5) {
    // Run the code in here
}

The `if-else` statement

The if-else form of an if statement is used to run an alternative piece of code if the conditional is not true. The code in the if block below will be ignored, for example - only the code in the else block will be run.

if (43 < 2) {
    // Run the code in here
} else {
    // Run a different bit of code
}

The `if-else if-else` statement

The if-else if-else statement is similar to the if-else statement except for the fact that it can multiple conditions and run that block whose condition yeilds true after evaluation.

var marks = 75, grade;
if (marks > 90) {
    grade = 'A';
}
else if (marks > 80 && marks <= 90) {
    grade = 'B';
}
else {
    grade = 'C';
}

Note: && is the and operator, which is the same in most programming languages.

Looping

Loops are a way of repeating the same block of code over and over. Two of the most common loops are while loops and for loops.

`while` loop

A while loop repeats a block of code while a condition is true.

var i = 1;
while (i < 10) {
    alert(i);
    i = i + 1;
}
// i is now 10

`for` loop

A for loop is similar to an if statement, but it combines three semicolon-separated pieces information between the parentheses: initialization, condition and a final expression.

for (var i = 1; i < 10; i++) {
    alert(i);
}

Functions

Functions are reusable blocks of code that carry out a specific task. To execute the code in a function you call it. A function can be passed arguments to use, and a function may return a value to whatever called it.

To create a function, use the function keyword. You then list the arguments in parentheses, and then supply a block that contains the function’s code. Here’s a function that adds two numbers.

var add = function (a, b) {
    return a + b;
};

Objects (also called JSON as in JavaScript Object Notation)

Javascript objects are like a real life objects; they have properties and abilities. A Javascript object is, in that sense, a collection of named properties and methods - a function.

An object can be stored in a variable, and the properties and methods accessed using the dot syntax.

Variables can hold objects, and creating an object is done using a special syntax signified by braces.

var jedi = {
    name: "Yoda",
    age: 899,
    talk: function () { alert("another... Sky... walk..."); }
};

In this object jedi we created, we can access the elements using the . (dot) operator or like arrays as follows.

console.log (jedi.name); // prints "Yoda"
console.log (jedi['age']); // prints 899

Arrays

In JavaScript, you create an array using the array-literal syntax.

var emptyArray = [];
var shoppingList = ['Milk', 'Bread', 'Beans'];

Miscellaneous

You have got a headstart, now go on try these links and get a clear idea about JS and how to work with it.

You’re done with JS. You’re now one step closer to building amazing Web Applications.

Oh, and here is the list of all in-built Javascript functions that you can use to build your fucntions.

sounak98/javascript.org