JavaScript introduction for the Beginners

JavaScript is the most commonly used scripting language, created for making html-pages live. It is a high-level, dynamic, lightweight, and interpreted programming language. It is  used commonly in combination with HTML and CSS.

Most modern browsers support JavaScript. Programs written in this language are called scripts. These scripts can be either embedded into HTML page directly (inline) or as an external script file.

JavaScript was developed by Brendan Eich in 1995 while working for Netscape Communications Corporation. The language was initially called Mocha, then LiveScript and eventually JavaScript. It has the language specification called ECMAScript.

Generally, JavaScript is used to add dynamic function to HTML. It can do things that HTML cannot do and even can change the HTML dynamically. Furthermore, it can manipulate the HTML itself.

Running JavaScript

JavaScript cannot run on its own. The browser is responsible for running the code. When an HTML page containing JavaScript is requested, the script is sent to the browser and the browser then executes it.

It can be added to HTML in 2 ways.

a. Directly (Inline)

<html>
<head>
<title>Inline Example</title>
<script type=’text/javascript’>
// Code goes here
</script>
</head>

b. External File (linked from HTML page)

<head>
<script language=“javascript” src=“script.js”>
</script>
</head>

JavaScript Variables

JavaScript variables are containers for storing data values. The variables are untyped and declared with the var keyword as follows:

var a = 1;
var title = “Hello JS”;

JavaScript Functions

A function is a chunk of instructions grouped together to perform a particular task.

<script language=“text/javascript”>
function showMessage(parameters) {
// Group of code to perform a task
}
</script>

Events

JavaScript is event-driven and can react on HTML events. Example of some common events: onClick, onChange, onLoad, onMouseOver, onMouseOut, onKeyDown, etc. Event Handlers to handle user input, user actions as well as browser actions.

<html>
<head>
<script language=“javascript”>
function sayHello() {
alert(‘Hello’);
}
</script>
</head>
<body>
<button onclick=”sayHello()”>Say Hello</button>
</body>
</html>

This is all much for today. I will write on some cool topics in upcoming posts.

Thank you for reading my post.

 

Leave a Reply