I have a few suggestions for optimizing your code.
Since ES6 came out it is considered best practice to declare variables as const
. It is also a good practice to declare your variables at the top of your script. For example you are selecting the element #ddlApplicationType
everytime you loop over your array. That is not necessary. Just select it once at the top of your script and reuse it as often as you want in your code by referencing the variable const selectApplicationType
. If you know that you are going to reassign a variable you can use the let
keyword. Like I did in the $.each
function. temp
gets reassigned everytime the $.each
loops over it. I declared it inside this function because it is a temporarly used variable and will never be needed in the global scope.
When using DOM elements you should check if they exist first. For example if you have multiple pages and a DOM element referenced in your code is missing all the following code will break.
In the example below I used string literals. I think it makes the code a bit more readable. I hope I could help you.
const AppType = [
['All'],
['API'],
['AWS'],
['Web']
];
const selectApplicationType = $("#ddlApplicationType")
if (selectApplicationType.length > 0) {
$.each(AppType, (index, AppType) => {
let temp = `<option value="${AppType}">${AppType}</option>`
selectApplicationType.append(temp)
})
} else {
console.log(`Element #ddlApplicationType is missing`)
}