Introduction to Javascript :)

Madhav Ganesan - Aug 27 - - Dev Community

History:

It was developed in May 1995 by Brendan Eich in 10 days. It was intially called Mocha, then LiveScript, it finally became JavaScript. Designed for the client-side of websites to add dynamic and interactive elements to static HTML pages. First implemented in Netscape Navigator, the most popular browser at the time. Microsoft quickly adopted JavaScript for Internet Explorer.

Image description

Standards:

Ecma International create standards for technologies. ECMAScript is defined in ECMA-262 for creating a general purpose scripting language. Javascript is a scripting language that is built using ECMAScript specification.

ECMAScript 5 (ES5)

The JavaScript version used in browsers today

ECMAScript 6 (ES6/ES2015)

Sixth edition of the ECMA-262 standard, featuring major changes and improvements. All browsers supports ES5 still now but to get updated with recent improvements in ECMAScript, they use Transpiler. A transpiler converts ES6 code to ES5 code(eg. Babel).ES6 does not run in today’s browsers without transpilation.

JavaScript Components

*ECMAScript: *
Defines the core logic for creating and editing objects, arrays, numbers, etc.

DOM (Document Object Model):
Enables communication with HTML/XML documents (e.g., document.getElementById('id');).

BOM (Browser Object Model):
Hierarchy of browser objects (e.g., location object, history object, form elements)

JavaScript Engines:

Commonly found in web browsers:

V8 in Chrome
SpiderMonkey in Firefox
Chakra in Edge

Paradigms:

Procedural Programming

function greet() {
    console.log("Hello, World!");
}
greet();
Enter fullscreen mode Exit fullscreen mode

Object-Oriented Programming

ES5

function Person(name) {
    this.name = name;
}

Person.prototype.greet = function() {
    console.log(`Hello, my name is ${this.name}`);
};

const person = new Person('Alice');
person.greet(); // Outputs: Hello, my name is Alice
Enter fullscreen mode Exit fullscreen mode

ES6/ES2015

class Person {
    constructor(name) {
        this.name = name;
    }

    greet() {
        console.log(`Hello, my name is ${this.name}`);
    }
}

const person = new Person('Bob');
person.greet(); // Outputs: Hello, my name is Bob
Enter fullscreen mode Exit fullscreen mode

Functional Programming

function greet(name) {
    return `Hello, ${name}`;
}

function processGreeting(fn, name) {
    return fn(name);
}

console.log(processGreeting(greet, 'Charlie'));
Enter fullscreen mode Exit fullscreen mode

Performance

JavaScript is an interpreted language, and its performance depends on the JavaScript engine of the browser or Node.js. Modern JavaScript engines use Just-In-Time (JIT) compilation to optimize performance.

How to Run a JavaScript File

Open a Text Editor and Type JavaScript Code: Write your JavaScript code in a text editor.
Save the File with a .js Extension: Save your file with a .js extension.
Run the Following Commands (Node.js Required):

node filename.js
Enter fullscreen mode Exit fullscreen mode

Type System

Dynamic Typing: Types are checked at runtime, allowing for more flexibility but potentially leading to type-related errors during execution.

Weak Typing: JavaScript is less strict about type rules, allowing implicit type conversions, which can sometimes lead to unexpected behaviors.

Automatic Type Checking: The JavaScript engine performs type checking automatically at runtime.

Abstraction

JavaScript provides a high-level abstraction for interacting with web browsers or Node.js environments, managing memory automatically, and offering easy-to-use APIs for common tasks.

Important Facts

Automatic Memory Management:JavaScript uses automatic garbage collection, which handles memory allocation and deallocation for the programmer.

Usage

Web Development: Widely used for creating interactive and dynamic web pages and applications.

Server-Side Development: Used in server-side programming with Node.js to build scalable and high-performance web servers and applications.

Application Development: Utilized for developing cross-platform applications using frameworks like Electron or React Native.

Game Development: Used for building browser-based games and interactive applications.

Scientific Computing: JavaScript can be used for scientific applications in the browser using libraries like TensorFlow.js or for server-side computations.

Stay Connected!
If you enjoyed this post, don’t forget to follow me on social media for more updates and insights:

Twitter: madhavganesan
Instagram: madhavganesan
LinkedIn: madhavganesan

Acknowledgement

freecodecamp

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .