17 Interesting JavaScript Tricks

There are many ways to write code but generally the first way for many people is very long and can take you some time. Here is my latest post that will increase your efficiency and productivity when coding JavaScript. JavaScript: Tricks You Should Know The ternary operator Noobs: hungry = ; eat; (hungry == ) { eat = ; } { eat = ; } let true let if true 'yes' else 'no' Pro: hungry = ; eat = hungry == ? : ; const true const true 'yes' 'no' Number to string / string to number Noobs: num = ; s = num.toString(); n = (s); let 15 let // number to string let Number // string to number Pro: num = ; s = num + ; n = +s; let 15 let "" // number to string let // string to number Populating an array Noobs: ( i= ; i () 'hello' 'goodbye' Dynamic properties in objects Noobs: dynamic = ; user = { : }; user[dynamic] = ; let "value" let id 1 "other value" Pro: dynamic = ; user = { : [dynamic] = }; let "value" let id 1 "other value" Read more => 3 Steps to learn a programming language Removing duplicates Noob: array = [ , , , , , , ]; outputArray = []; flag = ; (j = ; let 100 23 23 23 23 67 45 let let false for 0 < ; ++) { ( = < ; ++) { ( [ ] == { = } } ( == { ( [ ]); } = } // = , , ] array.length j for k 0; k outputArray.length k if array j outputArray[k]) flag true; if flag false) outputArray.push array j flag false; outputArray [100, 23 67 45 Pro: array = [ , , , , , , ]; outputArray = (array); const 100 23 23 23 23 67 45 const new Set //outputArray = [100, 23, 67, 45] Array to object Noob: arr = [ , , ]; arrObject = {}; ( i = ; i Complete Guide To Fetch API Object to Array Noob: number = { : , : , }; keys = []; ( numbers numbers) { (number.hasOwnProperty(number)) { keys.push(number); } } let one 1 two 2 let for let in if // key = [ 'one', 'two' ] Pro: number = { : , : , }; key = .keys(numbers); value = .values(numbers); entry = .entries(numbers); let one 1 two 2 let Object // key = [ 'one', 'two' ] let Object // value = [ 1, 2 ] let Object // entry = [['one' : 1], ['two' : 2]] Short circuit conditionals Noob: (docs) { goToDocs(); } if Pro: && docs () goToDocs Read more => "use strict" in JavaScript Use ^ to check if numbers are not equal (a!= ) (a^ ) if 123 // before // NOOBS if 123 // after // PRO Loop over an object age = { : , : }; keys = .keys(age); keys.forEach( age[key]++); .log(age); ( key age){ age[key]++; } .log(age); const Rahul 20 max 16 // Solution 1 - Get 'keys' and loop over const Object => key console // { Rahul: 21, max: 16 } // Solution 2 - for ..in loop for let in console // { Rahul: 22, max: 18 } Object keys are stored in insertion order cosnt obj = { : , : , : , : , }; .log( .keys(obj)); name "Rahul" age 16 address "Earth" profession "Developer" console Object // name, age, address, profession Check if value is an array arr = [ , , ]; .log( arr); .log( .isArray(arr)); const 1 2 3 console typeof // object console Array // true Initialize an array of size n and fill with default values size = ; defaultValue = ; arr = (size).fill(defaultValue); .log(arr); const 5 const 0 const Array console // [0, 0, 0, 0, 0] Truthy and False values False values => , , , , , & . false 0 "" (empty string) null undefined NaN Truthy values => " ", " ", , & ) Values 0 {}(empty object) [](empty array Difference between double equal and triple equal .log( == ); .log( === ); // Double equal - Converts both the operands to the same type and then comapares console 0 'o' // true // Triple Equal - Does not convert t same type console 0 '0' // false Better way to accept arguments {} downloadData(...); ( ) function downloadData url, resourceId, searchTest, pageNo, limit // need to remember the order Simpler way to do: {} downloadData( { : , : , : } ); ( ) function downloadData { url, resourceId, searchTest, pageNo, limit } = {} resourceId 2 url "/posts" searchText "WebDev" null vs undefined null => It is a whereas undefined is not. value null is like an and undefined it not box at all. empty box fn = .log(x); fn( ); fn(); fn( ); const ( ) => x = 'default value' console undefined // default value // default value null // null When null is passed, the default value is . Whereas, when undefined or nothing is passed the default value is taken. not taken Need help in raising funds to buy a Mechanical Keyboard. This pandemic has affected my family badly so can't ask my DAD for it. Donate Me ⚡Thanks For Reading | Happy Coding 🍺 Previously published at https://rahulism.co/2020/11/29/_17-pro-javascript-tricks-you-didnt-know/