Custom Metadata Types vs Custom Settings vs Custom Labels 💬 In plain words: Three lookalikes: Custom Metadata = configuration that DEPLOYS with your code (best for app settings). Custom Settings = org/user-specific values, changeable at runtime (hierarchy type is great for bypass switches). Custom Labels = translatable text for the UI. 📌 Example: API endpoint URLs per environment → Custom Metadata (deploys with code, sandbox vs prod values). A 'Bypass_Automation__c' checkbox an admin flips during data load → hierarchy Custom Setting. The word 'Submit' translated to Hindi → Custom Label. 🎬 Real-Life Example: The Fee Table Trapped Inside Code Skyline charges a different delivery fee per city. Apex needs those rates on every booking. The Old/Bad Way: if (city == 'Delhi') fee = 50. Else if (city == 'Mumbai') fee = 65. … Every rate change is a code change, a test run, and a deployment. Why this is bad: Business data is trappe...
Introduction:
Welcome to Part 1 of our blog series on useful JavaScript methods in Lightning Web Components (LWC). In this article, we will explore some dynamic working code examples that showcase the power and flexibility of JavaScript in LWC development. These methods will help you enhance the functionality and user experience of your LWC applications. So, let's dive in!
1. Array.map():
The Array.map() method is used to create a new array by iterating over an existing array and performing a transformation on each element. It takes a callback function as an argument and returns a new array with the transformed elements. Here's an example that demonstrates how to use Array.map() in LWC:
// JavaScript code in LWC
// Sample data
const numbers = [1, 2, 3, 4, 5];
// Mapping array elements
const transformedNumbers = numbers.map((number) => number * 2);
console.log(transformedNumbers);
// Output: [2, 4, 6, 8, 10]
2. Array.filter():
The Array.filter() method allows you to create a new array by filtering out elements from an existing array based on a condition. It takes a callback function that evaluates each element and returns a Boolean value. Here's an example that demonstrates how to use Array.filter() in LWC:
// JavaScript code in LWC
// Sample data
const numbers = [1, 2, 3, 4, 5];
// Filtering even numbers
const evenNumbers = numbers.filter((number) => number % 2 === 0);
console.log(evenNumbers);
// Output: [2, 4]
3. Array.reduce():
The Array.reduce() method allows you to reduce an array to a single value by performing an operation on each element. It takes a callback function and an initial value as arguments. The callback function receives an accumulator and the current element, and returns the updated accumulator. Here's an example that demonstrates how to use Array.reduce() in LWC:
// JavaScript code in LWC
// Sample data
const numbers = [1, 2, 3, 4, 5];
// Calculating the sum of numbers
const sum = numbers.reduce((accumulator, number) => accumulator + number, 0);
console.log(sum);
// Output: 15
Conclusion:
In this first part of our blog series on useful JavaScript methods in LWC, we explored the Array.map(), Array.filter(), and Array.reduce() methods. These methods provide powerful ways to transform, filter, and reduce arrays in LWC applications. By leveraging these methods, you can enhance the functionality and flexibility of your LWC components. Stay tuned for the upcoming parts of this series where we'll cover more useful JavaScript methods!
We hope you found this article helpful. If you have any questions or suggestions, please feel free to leave a comment below.