JavaScript Best Practices Using in Lightning Component

JavaScript is a client side scripting language that runs in a web browser. It has the behavior of functional programming language and concepts of object oriented language.

Javascript Best Practices using Lightning Component.

JavaScript is a client side scripting language that runs in a web browser. It has the behavior of functional programming language and concepts of object oriented language. While developing lightning component, JavaScript will help us develop the components easily. So, the Lightning developer requires JavaScript knowledge to perform various tasks on client side. Let’s discuss some JavaScript useful tips and tricks to use when using JavaScript in Lightning controllers.

1. Type conversion v/s Equality (=== vs ==) 

In JavaScript, we have two different kinds of equality operators (‘===’ and ‘==’). It is a good practice to use ‘===’ instead of ‘ ==’. Because the == operator will compare for equality after doing any necessary type conversions. The ===operator will not do the conversion, so if two values are not the same type === will simply return false. Both are equally quick.

Using the == operator (Equality) 

Text Box

Using the === operator (Identity) 

javascript best practices

2. Avoid Global Variables 

In JavaScript, minimize the use of global variables. Global variables and functions can be overwritten by other scripts. So, all variables used in a function should be declared as local variables. Local variable must be declared with var keyword; otherwise they will become global variables.

3. Undefined vs Null 

JavaScript has additional type which is called “undefined”. undefined means a variable has been declared but has not yet been assigned a value. On the other hand, null is an assignment value. It can be assigned to a variable as a representation of no value.

javascript best practices
javascript best practices

So, the developer must always handle blank, null and undefined.

4. Use JS Lint  

JSLint is a code analysis tool. it takes a JavaScript source and quickly scans for any noticeable issues and errors in your code. It’s returns a message describing the problem and an approximate location within the source.

5.Use Switch Statement to handle multiple conditions 

javascript best practices

The switch statement is used to perform different actions based on different conditions. the switch statement to select one of many blocks of code to be executed.

6. Use Curly Braces  

Most of the developers neglect curly braces and semi colon. So, most browsers will misbehave from the original functionality as people think.

javascript best practices

However, Consider this

Text Box

People think the above would be equivalent to

javascript variable declaration best practices

Unfortunately, here it would be wrong. It means

javascript variable declaration best practices

7. Optimize loops 

If you don’t use loops properly it will hamper your code performance. The common mistake we do in loops is that we read the length attribute of an array at every iteration

javascript variable declaration best practices

In the above statement, every time the loop runs, JavaScript will read the length of the array. You can avoid that by defining the length value outside the loop and in a different variable

Better Way: 

javascript variable declaration best practices

8. Avoid using eval () 

Eval function is called “evil” in JavaScript language. Eval takes a String as a argument and JavaScript compiler executes String as JavaScript on run-time.

The code written in eval is executed at run-time and that makes it a security risk

9. Don’t use JavaScript reserved words 

Don’t use reserved words such as abstract, package, else, false and so on. It will cause you issues when you attempt to run your application. A complete listing of these words can be found at the http://www.w3schools.com/js/js_reserved.asp.

10. Use {} Instead of New Object () 

There are multiple ways to create objects in JavaScript. Perhaps the more traditional method is to use the “new” constructor, like so

javascript best practices

However, this method receives the “bad practice” stamp without being so. Instead, we   can use the much more robust object literal method

javascript best practices

References: 

  1. www.w3schools.com
  2. https://code.tutsplus.com/tutorials/24-javascript-best-practices-for-beginners–net-5399

About MST

At MST Solutions our cornerstone is to adapt, engage and create solutions which guarantee the success of our clients. The talent of our team and experiences in varied business verticals gives us an advantage over other competitors.

Recent Articles

Events in LWC

Introduction to Events  An event that fired by another lightning component or the component itself. Events is nothing but the way component is going to

Read Article »

Work with us.

Our people aren’t just employees, they are key to the success of our business. We recognize the strengths of each individual and allow them time and resources to further develop those skills, crafting a culture of leaders who are passionate about where they are going within our organization.