JavaScript: The Important Basics

In this weird world of technology people often get confused how does a website work? What all things should I be aware of? So we are here to help you. Most of the content on web is developed with the help of JavaScript. JavaScript is really becoming popular these days with the coming of ECMAScript2015 and ECMAScript 2016, for this reason, some beginners learning React and Angular and are also trying to tackle more modern JavaScript syntax at the same time. If you're new to both, it can be confusing as to "what is JavaScript and what are its important features". This document should serve as a primer to help you get up-to-speed on JavaScript syntax that we feel matters the most for learning React as well as Angular.

JavaScript is a cross-platform, object-oriented scripting language used to make webpages interactive (e.g., having complex animations, clickable buttons, popup menus, etc.). Also JavaScript is the base of all the modern day frameworks out there in the world.

Semicolons

The official guidelines say that JS uses a semi colon to terminate a statement. The ECMAScript spec describes how, if a statement is not explicitly terminated with a semicolon, sometimes a semicolon will be automatically inserted by JavaScript engine.
Examples of using semicolons in JS

Variables: var, let, and const

JavaScript has had var since the beginning which is related to how JavaScript's scope works.
Scope in JavaScript works a little different from some other languages and sometimes can be hard to manage with the way function scoping works. "Block Scope" can be easier to understand and manage which is why JavaScript got let, and const in ES2015. Here's a quick rundown of how all three work:
var doesn’t have a scope.

let and const both have block scope wherein let can be reassigned but const cannot be reassigned.

String Literals

Strings in JavaScript can made with single or double quotes. But when you make strings this way, you can't have multiline unless you manually add new lines. Template literals (sometimes referred to as Template Strings) allow us to do multiline in a much cleaner way. Template Literals use the back-tick instead of a single or double quote.

Another benefit is string interpolation (making strings from variables)

Expressions vs Statements and Declarations

An expression is any valid set of literals, variables, operators, that evaluates to a single value. The value may be a number, a string, or a logical value. Conceptually, there are two types of expressions: those that assign a value to a variable, and those that simply have a value.
Statements are used in JavaScript to control its program flow. Unlike properties, methods, and events, which are fundamentally tied to the object that owns them, statements are designed to work independently of any JavaScript object.
Creating a variable in JavaScript is called "declaring" a variable. You declare a JavaScript variable with the var keyword: var carName; After the declaration, the variable has no value (technically it has the value of undefined).

Functions

Arrow Functions - also called “fat arrow” functions, from CoffeeScript, are a more concise syntax for writing function expressions. They utilize a new token, =>, that looks like a fat arrow. Arrow functions are anonymous and change the way this binds in functions.
Arrow functions make our code more concise, and simplify function scoping

Object Destructuring

Object Destructuring is a way to take an object and to pull out its internal properties into variables outside of the object:

Array Destructuring

Array Destructuring works almost the same as Object Destructuring but with square-brackets instead of curly-braces:

Important Array Functions

Here are some common array methods and functions to be familiar with:

isArray(): Check whether an object is an array.

map(): Map takes an array, iterates over it with a function and whatever the function returns will be the replacement value for the item we're currently on:

reduce(): Reduce is similar to map; in that it iterates over an array but the end result is just one value instead of replacing all the values in the array:

filter(): Filter gives us a new array with the same values, but only if the iterator function returns true:

find(): Find is similar to Filter but instead of returning an array, only the first item to get true returned from the iterator function is returned from Find:

As with any language, there's lots of different ways to program the same task so these are the major JavaScript syntax people should be aware about and in the coming future we will work on how these syntaxes will be used in other framework like angular or react so follow up with us. I hope you enjoyed this read!

About Amlgo Labs : Amlgo Labs is an advanced data analytics and decision sciences company based out in Gurgaon and Bangalore, India. We help our clients in different areas of data solutions includes design/development of end to end solutions (Cloud, Big Data, UI/UX, Data Engineering, Advanced Analytics and Data Sciences) with a focus on improving businesses and providing insights to make intelligent data-driven decisions across verticals. We have another vertical of business that we call - Financial Regulatory Reporting for (MAS, APRA, HKMA, EBA, FED, RBI etc) all major regulators in the world and our team is specialized in commonly used regulatory tools across the globe (AxiomSL Controller View, OneSumX Development, Moody’s Risk, IBM Open Pages etc).We build innovative concepts and then solutions to give an extra edge to the business outcomes and help to visualize and execute effective decision strategies. We are among top 10 Data Analytics Start-ups in India, 2019 and 2020.

Please feel free to comment or share your views and thoughts. You can always reach out to us by sending an email at info@amlgolabs.com or filling a contact form at the end of the page.