Introduction
Javascript is a powerful programming language especially in web development that is used to create and control dynamic website content, i.e. anything that moves, refreshes, or otherwise changes on your screen without requiring you to manually reload a web page. During the last 5 years, Javascript is becoming famous because of its simplicity and many features it has and also many packages out there. So without further ado let's dive right into it.
1. String to a number
Now you can easily convert a string to a number by just only using+ the sign. Unlike the old method, using the + operator is much cleaner and easier.
my_string = "123";
console.log(+my_string);
// 123
my_string = "amazing";
console.log(+my_string);
// NaN
Please note that it only works with string numbers as you can see in the example above.
2. A number to a string
You can convert a number to a string in a simpler way without using the JavaScript built-in toString() method.
Have a look at this:
let converted_number = 5 + "";
console.log(converted_number);
// 5
console.log(typeof converted_number);
// string
3. Get unique values
We can extract unique values from an array i.e removing duplicate values in an array by simply using the Set object and Spread operator.
let array_values = [1, 3, 3, 4, 5, 6, 6, 6,8, 4, 1]
let unique_values = [...new Set(array_values )];
console.log(unique_values );
// [1,3, 4, 5, 6, 8]
4. Replace all
We usually know string. replace method replaces on the first occurrence. In any case, regular expressions in Javascript can be used to replace certain content on strings.
In our example, we'll use global regex /g to replace all occurrences of a string.
let replace_string = "Visit stunnitysoft. stunnitysoft is a software company";
console.log(replace_string.replace(/stunnity/, "Micro"));
// "Visit Microsoft. stunnitysoft is a software company"
console.log(replace_string.replace(/stunnity/g, "Micro"));
// "Visit Microsoft. Microsoft is a software company"
5. Optional Chaining
The optional chaining operator (?.) permits reading the value of a property located deep within a chain of connected objects without having to expressly validate that each reference in the chain is valid.
- Taken from MDN DOCS
Let's consider the expression
a?.b.
This expression evaluates to a.b if a is not null and not undefined, otherwise, it evaluates to undefined.
You can also chain this multiple times like a?.b?.c
If a is undefined ornull, then this expression evaluates to undefined
Else if b is undefined or null, then this expression evaluates to undefined
Else this evaluates to a.b.c
obj.val?.prop
obj.val?.[expr]
obj.arr?.[index]
obj.func?.(args)
6. Nullish Coalescing Operator
The nullish coalescing operator (??) is a logical operator that returns its right-hand side operand when its left-hand side operand is null or undefined, and otherwise returns its left-hand side operand.
Taken from MDN DOCS
Consider the expression a ?? b. This evaluates to b if a is null or undefined, otherwise, it evaluates to a
7. Logical AND (&&) and Logical OR (||) Operators
Logical AND (&&) Operator
Let's say we have the following expression where b and c are expressions.
b && c
This will be evaluated to the value of c only if bis truthy, otherwise, it will be evaluated to the value ofb.
- If b is falsy, then the expression c is not even going to be evaluated.
- This is called short-circuit evaluation.
- This is very useful while using React.
Logical OR (||) Operator
Let's say we have the following expression where b and c are expressions. b || c
This will be evaluated to the value of b if b is truthy, otherwise, it will be evaluated to the value of c.
- Short-circuit evaluation happens here too.
- If b is truthy, then the expression c is not even going to be evaluated.
- This is also used often in React.
8. Using length to resize and emptying an array
In javascript, we can override a built-in method called length and assign it a value of your choice.
let array_values= [1, 2, 3, 4, 5, 6, 7, 8];
console.log(array_values.length);
// 8
array_values.length = 5;
console.log(array_values.length);
// 5
console.log(array_values);
// [1, 2, 3, 4,5]
Emptying an array
let array_values= [1, 2, 3, 4, 5, 6, 7,8];
console.log(array_values.length);
// 8
array_values.length = 0;
console.log(array_values.length);
// 0
console.log(array_values);
// []
Note: Setting the length to 0 is not advisable as it can lead to a memory leak. In order to clean objects in an array from memory, they need to be explicitly removed.
This was too long but thank you for holding on until the last line 😊, I hope this article was helpful, and if so please share it to other people who can find it useful. Feel free to give a suggestion or shoot me a message on C4TBT