JavaScript: Getting started

JavaScript: Getting started

June 16, 2019

JavaScript is used to create client-side dynamic pages. JavaScript is an object-based scripting language which is lightweight and cross-platform.

Javascript First Program:

console.log("Welcome to Stately World");

Tools For JavaScript Programming

There are some tools including frameworks, debuggers, text editors, etc. that will help you code efficiently using JavaScript.

Text Editors

You can use  Sublime Text, Notpad++, Visual Code, etc as a text editor.

Browser

You can use any browser for Javascript program. I am listing some browser name below.

  1. Google Chrome
  2. Firefox
  3. Microsoft Edge

Display output in JavaScript

JavaScript can “display” data in different ways:

  1. console.log('Hello World');
  2. document.write()
  3. window.alert()

Getting an element in Javascript:

* getElementByID()
* getElementsByClassName()
* getElementsByTagName()
* querySelector() + querySelectorAll()

Creating things in the documents

* createElement()
* createAttribute()

Example: Multidimensional Array

var activities = [
		    ['Work', 9],
		    ['Eat', 2],
		    ['Commute', 2],
		    ['Play Game', 2],
		    ['Sleep', 7]
		];

		activities.push(['Study',2]);							

for (var i = 0; i < activities.length; i++)
{

	console.log(i);

    var percentage = ((activities[i][1] / 24) * 100).toFixed();
    
    activities[i][2] = percentage + '%';
}

console.log(activities.join('\n'));


// loop the outer array
for (var i = 0; i < activities.length; i++) 
{
    // get the size of the inner array
    var innerArrayLength = activities[i].length;
    // loop the inner array
    for (var j = 0; j < innerArrayLength; j++)
    {
        console.log('[' + i + ',' + j + '] = ' + activities[i][j]);
    }
}

Object.keys, values, entries

For plain objects, the following methods are available:

Object.keys(obj) – returns an array of keys.
Object.values(obj) – returns an array of values.
Object.entries(obj) – returns an array of [key, value] pairs.