JavaScript Tips & Tricks For Beginners

Introduction

JavaScript is a lightweight and flexible programming language of the web. It powers the dynamic behavior on most websites. JavaScript is just-in-time compiled programming language. So here are some tips and tricks for JavaScript.

Unique Value Filter on Array

An array is an object that can store multiple values at once. For example,

const array = [1,2,3]

The array is storing 3 values.

Create an Array

Using an array literal

const array1 = ["eat", "sleep"];

Using the new keyword

const array2 = new Array("eat", "sleep");

Now if we want to find unique values then we can use,

const array = [1,1,2,3,6,6,3,1]
const uniArray = [...new Set(array)];
console.log(uniArray);

Output

[1,2,3,6]

Filter Array on condition

let array = ["The","Coding","Master"];
console.log(array.filter(x=>x.length >3));

Output

["Coding", "Master"]

Check item availability in Array

let array = ["The","Coding","Master"];
console.log(array.includes("The"));

Output

true

Truncate Array

let array = [0,1,2,3,4,5];
array.length=3;
console.log(array);

Output

[0,1,2]

Last Item in Array

let a= [0,1,2,3];
console.log(a.slice(-1));

Output

[3]

Join All Item from Array

let arr= ['a','b','c','d'];
console.log(arr.join("-"));

Output

"a-b-c-d"

Converts Array to string

const arr = ['hello','js'];
console.log(arr.toString());

Output

"hello,js"

Concat Array in Array

let arr= ['a','b'];
console.log(arr.concat(['c']));

Output

["a", "b", "c"]

Index Of Item in Array

let arr= ['a','b','c'];
console.log(arr.indexOf('c'));

Output

Last Index Of Item in Array

let arr= ['a','b','a'];
console.log(arr.lastIndexOf('a'));

Output

Manipulate Item in Array

let arr= [1,2,3];
console.log(arr.map(x=>x*2));

Output

[2, 4, 6]

Reverse Array

let arr= [1,2,3];
console.log(arr.reverse());

Output

[3, 2, 1]

Sort Array

let arr= [22,15,13];
console.log(arr.sort());

Output

[13, 15, 22]

Remove last Item in Array

let arr= [22,15,13];
console.log(arr.pop());

Output

Push Item in Array

let arr= [22,15,13];
arr.push(8);
console.log(arr);

Output

[22, 15, 13, 8]

Push Item in Array

let arr= [22,15,13];
arr.push(8);
console.log(arr);

Output

[22, 15, 13, 8]

Remove first Item in Array

let arr= [2,1,3];
arr.shift();
console.log(arr);

Output

[1,3]

Add new Item in Array to beginning

let arr= [2,1,3];
arr.unshift(0);
console.log(arr);

Output

[0, 2, 1, 3]

Get a portion of Array into new Array

const arr = ['q','w','e','r','t',];
const arr1 = arr.slice(1, 3);
console.log(arr1);

Output

["w", "e"]

Add Item in specified way and position in Array

const arr = ['q','w','e','r','t',];
arr.splice(3, 0, "l", "k");
console.log(arr);

Output

["q", "w", "e", "l", "k", "r", "t"]

const arr = ['q','w','e','r','t',];
arr.splice(3, 3, "l", "k");
console.log(arr);

Output

["q", "w", "e", "l", "k"]

Foreach() on Array

let array = ["The","Coding","Master"];
let text="";
array.forEach(myFunction);

console.log(text);
function myFunction(item, index) {
  text += index + ": " + item + " "; 
}

Output

"0: The 1: Coding 2: Master "

Every() on Array

const arr = [32, 33, 16, 40];
console.log(arr.every(check));

function check(item) {
  return item > 18;
}

Output

false

Some() on Array

const arr = [3, 10, 18, 20];

console.log(arr.some(check));
function check(item) {
  return item > 18;
}

Output

true

Convert to Boolean

const t= !0;
const f= !!0;
console.log(t);
console.log(f);

Output

True and False

Convert to String

const val = 3+ "";
console.log(val);

Output

"3"

Convert to Number to local language string

let num = 1234567;
let text = num.toLocaleString("hi-IN");
console.log(text );

Output

12,34,567

In JavaScript, numbers are primitive data types. Unlike in some other programming languages, you don't have to specifically declare for integer or floating values using int, float, etc.

Here is a list of built-in number methods in JavaScript.

Method	Description
isNaN()	determines whether the passed value is NaN
isInteger()	determines whether the passed value is an integer
parseFloat(string)	converts the numeric floating string to floating-point number
toPrecision()	returns a string value for a number to a specified precision
valueof()	returns the numbers value

Convert to Int

let s= "16";
s = +s;
console.log(s);

Output

"16"

Convert Float to Int

const f = 11.5 | 0;
console.log(f);

Output

"11"

Remove last digits

const c = 1553/10| 0;
console.log(c);

Output

"155"

Format number to specified length

let num = 0.1264;
console.log(num.toPrecision(2));
console.log(num.toPrecision(3));

Output

"0.13"
"0.126"

Summary

A short summary of JavaScript's tips and tricks for beginners, including different kinds of JS objects, basic data structures, and how we can play with them as well as use JavaScript to build dynamic web pages and web applications.