DEV Community

loading...
Cover image for Top 10 basic things about JavaScript

Top 10 basic things about JavaScript

chayan profile image chayan999 ・5 min read

1.Variables
Top 10 basic things about JavaScript
JavaScript is declared using three keywords for variables.
they are let, const, or var.
let/var
The let keyword is used to declare variables in JavaScript. The var keyword can also be used to declare variables, but the key difference between them lies in their scopes. var is function scoped while let is block scoped
Consider the example below:
var
function func() {
// a is known here but not defined.
console.log('value of x here: ', x)
{
var a = 10;
a = a + 5;
}
// a is still known here and has a value.
console.log('value of x after for block: ', x)
}
// a is NOT known here.
func()
let
let apple = "yellow"

if (apple === "yellow"){
let apple = "red"
console.log(apple)
}
console.log(apple)
Using let

apple is declared as "yellow" and redeclared as "blue" . Inside the if block. However, as the output shows, the apple declared inside the if block has scope within that block only. Outside this block, the original apple variable set to "yellow" is available.

Using var
Conversely, in the code that uses var, redeclaration of apple to "bred" inside the if block, also changes the apple declared to "red". This is because variables declared with var are defined globally, regardless of block scope.

2.Operators
+, -, *, / and % In JavaScript this symbol is no is operator. It has a unique Work function. In general this operator work function is similar to general math. In some cases this operator places different roles.
You can use ++ and -- to increment and decrement respectively. These can be used as a prefix or postfix operators.
The + operator also does string concatenation:
'hello' + ' world'; // "hello world"

  • Multiply two numeric operands. / Divide left operand by right operand. % Modulus operator. Returns remainder of two operands. ++ Increment operator. Increase operand value by one. -- Decrement operator. Decrease value by one.

JavaScript also have Comparison Operators
Example
== Compares the equality of two operands without considering type.
=== compares equality of two operands with type.
!= Compares inequality of two operands.

Checks whether left side value is greater than right side value. If yes then returns true otherwise false.
< hecks whether left operand is less than right operand. If yes then returns true otherwise false.
= Checks whether left operand is greater than or equal to right operand. If yes then returns true otherwise false.
<= Checks whether left operand is less than or equal to right operand. If yes then returns true otherwise false.
3.Objects

Object is a non-primitive data type in JavaScript. It is like any other variable, the only difference is that an object holds multiple values in terms of properties and methods. Properties can hold values of primitive data types and methods are functions.
In JavaScript, an object is a standalone entity because there is no class in JavaScript. However, you can achieve class like functionality using functions. We will learn how to treat a function as a class in the advance JavaScript section.
In JavaScript, an object can be created in two ways:
Object literal
Object constructor

Object literal
The object literal is a simple way of creating an object using { } brackets. You can include key-value pair in { }, where key would be property or method name and value will be value of property of any data type or a function. Use comma (,) to separate multiple key-value pairs.
var persone= { name: ‘rahul, age: 24, class: 11};
Object Constructor
The second way to create an object is with Object Constructor using new keyword. You can attach properties and methods using dot notation. Optionally, you can also create properties using [ ] brackets and specifying property name as string.

var person = new Object(); // Attach properties and methods to person object person.firstName = "Rahul";
person["lastName"] = "Gupta";
person.age = 25;

4.Array
An array is a special type of variable, which can store multiple values using special syntax. Every value is associated with numeric index starting with 0. The following figure illustrates how an array stores values.
An array in JavaScript can be defined and initialized in two ways, array literal and Array constructor syntax.
Array Literal
Array literal syntax is simple. It takes a list of values separated by a comma and enclosed in square brackets.

var = [Abdur, Kamal, Dayal, Here];
Array Constructor
You can initialize an array with Array constructor syntax using new keyword.
The Array constructor has following three forms.
var arrayName = new Array();

var arrayName = new Array(Number length);

var arrayName = new Array(Abdur, Kamal, Dayal, Here);
5.Functions
JavaScript provides functions similar to most of the scripting and programming languages.
In JavaScript, a function allows you to define a block of code, give it a name and then execute it as many times as you want.
A JavaScript function can be defined using function keyword.
The following example shows how to define and call a function in JavaScript.

function ShowMessage() {
alert("Hello World!");
}
ShowMessage();
Function Parameters
A function can have one or more parameters, which will be supplied by the calling code and can be used inside a function. You can pass less or more arguments while calling a function.

function ShowMessage(firstName, lastName) {
alert("Hello " + firstName + " " + lastName);
}
ShowMessage("Abdur", "Rahman");
ShowMessage("Jony", "Das");
6.Anonymous Function
JavaScript allows us to define a function without any name. This unnamed function is called anonymous function. Anonymous function must be assigned to a variable.
Example: Anonymous Function
var showMessage = function (){
alert("Hello World!");
};
showMessage();
var sayHello = function (firstName) {
alert("Hello " + firstName);
};
showMessage();
sayHello("Rana");
7.Recursive functions
JavaScript allows you to call functions recursively. This is particularly useful for dealing with tree structures, such as those found in the browser DOM.
function countChars(element) {
if (element.nodeType == 3) { // TEXT_NODE
return elememt.nodeValue.length;
}
var count = 0;
for (var i = 0, child; child = element.childNodes[i]; i++) {
count += countChars(child);
}
return count;
}

8.indexOf in Arrays
The indexOf method takes one argument which is the element. Then it returns the index of the first element it finds in the array which satisfies. This means that even if there are two matches in your array, indexOf will only return one result. The result is the first occurrence in the array.

onst zoo = ['Monkey', 'Horse', 'Dog', 'Bear', 'Fox', 'Dog']; // Skyler just arrived!
const spencersIndex = zoo.indexOf('Dog'); // === 2 same as before

// We start searching after
const skylersIndex = zoo.indexOf('dog', spencersIndex + 1);
// skylersIndex === 5

9.Math floor()
In JavaScript, floor() is a function that is used to return the largest integer value that is less than or equal to a number. In other words, the floor() function rounds a number down and returns an integer value. Because the floor() function is a static function of the Math object, it must be invoked through the placeholder object called Math.
Math.floor(number);
console.log(Math.floor(32.65)); // 32

10.Math ceil()
In JavaScript, ceil() is a function that is used to return the smallest integer value that is greater than or equal to a number. In other words, the ceil() function rounds a number up and returns an integer value. Because the ceil() function is a static function of the Math object, it must be invoked through the placeholder object called Math.
Math.ceil(number);

Discussion (0)

Forem Open with the Forem app