What are the essential JavaScript skills required for Lightning Web Components?

Overview

Hi Everyone, In the world of web development, JavaScript is the powerhouse that brings interactivity and dynamism to your applications. When it comes to building Lightning Web Components (LWC), a modern web standard framework developed by Salesforce, having a good hold of JavaScript not only expedite your work but also help you to understand the LWC framework. In this blog post, we’ll explore the essential JavaScript concepts you need to master to create effective and efficient Lightning Web Components.

Null over Undefined

var name; //name is undefined as JavaScript interpreter/compiler internally assign it.
var name = null; //recommended to assign null

Object

var obj = {“demo”}
var obj1 = Object.create(obj);//ref of obj will be passed to obj1

Dot vs Array fetching from object
var object = {
“full name” : “abc”,
“name” : “cde”,
“age” : 23
}
In this , if requirement is to fetch full name then
object.full name will not solve our problem
object[“full name”] this way we can do and its also recommended one.

Convert object to string
JSON.stringify(obj);

String to Object
JSON.parse(str);

Typeof

typeof (typeof 1)
typeof (“number”)// will return from above line as typeof 1 is number
string// will return string as typeof(‘number’) is string

typeof(null)
object

Number data type

In JavaScript, there is no distinction between float and double data types as you might find in some other programming languages.

var num = 32.11
//NaN is also a Number
//Infinity is also a Number
Number(null)//0
Number(“hello”)//NaN
Number(1)//true
Number(false)//false
Number([])//0
Number([“34”])//34
Number(“23″,”44”)//NaN

Let and Var

Variables declared by let are only available inside the block where they’re defined. Variables declared by var are available throughout the function in which they’re declared. We can dive into the code sample share below to get more clarity.

var a = 5;
console.log(a); // 5
{
var a = 3;
console.log(a); // 3
}
console.log(a); // 3
let a = 5;
console.log(a); // 5
{
let a = 3;
console.log(a); // 3
}
console.log(a); // 5

Miscellaneous

100+’str’ //100str

100+null+20+world
//number of 100+number of null+number 20+str
//120world

100+200+undefined+”hey”
NaNhey

var arr =[“1″,”2″,”3″,”4″,”5”];
var newarr = arr.slice(1,3);// new arr [“2″,”3”]
//arr is not changes, just a copy is made

var arr =[“1″,”2″,”3″,”4″,”5”];
arr.join(‘-‘);
“1-2-3-4-5”

I hope you find this post useful! Catch you in the next content.
And thank you for being an awesome reader.
Share and grow together !!

If you have any doubts you can comment down below, I will try to reply ASAP.

Also keep visiting us, for more such content!