Write Clearer JavaScript: Why You Shouldn't Call These Objects as Functions

What it does

• These objects are designed to provide properties and methods, not to be invoked directly.
• Prevents you from calling certain built-in JavaScript objects as functions.

Why it's important

• It improves code clarity and avoids potential runtime errors.
• Calling these objects as functions results in errors because they lack the necessary internal functionality to act as functions.

Which objects are affected

• Intl (introduced in ECMAScript 2018): Offers functions for internationalization (e.g., formatting dates, numbers, currencies).
• Atomics (introduced in ECMAScript 2017): Provides functions for low-level atomic operations on shared memory.
• Reflect: Offers functions for reflecting on and manipulating objects (introduced in ECMAScript 2015).
• JSON: Used for JavaScript Object Notation serialization and deserialization (e.g., JSON.parse, JSON.stringify).
• Math: Provides mathematical constants and functions (e.g., Math.PI, Math.sin).

Example of a violation

// Incorrect (trying to call Math as a function)
Math(); // This will throw a TypeError

How to fix it

• For example, instead of Math(), use Math.random() to generate a random number.
• Use the object's properties or methods directly.

• You can also explicitly enable it in your ESLint configuration file:
• The no-obj-calls rule is included in the "eslint:recommended" configuration preset, so it's likely already enabled if you're using ESLint with that preset.

{
  "rules": {
    "no-obj-calls": "error"
  }
}

---

Incorrect Code (Calling Built-in Objects as Functions)

// Trying to call Math as a function (throws a TypeError)
var result = Math();

// Trying to call JSON as a function (throws a TypeError)
var data = JSON();

// Trying to call Reflect as a function (throws a TypeError in ES2015+)
var value = Reflect();

// Trying to call Atomics as a function (throws a TypeError in ES2017+)
var operation = Atomics();

// Trying to call Intl as a function (throws a TypeError in ES2018+)
var formattedDate = Intl();

// Using Math properties and methods
var randomValue = Math.random();  // Generates a random number
var PI = Math.PI;                   // Accessing the PI constant

// Using JSON methods
var jsonData = JSON.parse('{"name": "Alice"}');  // Parsing JSON string
var jsonString = JSON.stringify({ name: "Bob" });  // Stringifying an object

// Using Reflect methods (ES2015+)
var objectProperty = Reflect.get({ x: 10 }, 'x');  // Getting a property value

// Using Atomics methods (ES2017+)
var atomicResult = Atomics.add(sharedArray, index, value);  // Performing an atomic operation

// Using Intl methods (ES2018+)
var formatter = new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' });
var formattedPrice = formatter.format(123.45);  // Formatting a number as currency

---

1. • If you have a specific use case where calling a built-in object as a function is intentional (though generally discouraged), you can disable no-obj-calls for that particular object in your ESLint configuration.
   • This allows customization but requires careful consideration to avoid introducing errors.

2. Code Clarity
   

   • While not a strict rule, you can emphasize code clarity by:
     • Using descriptive variable names when working with these objects.
     • Adding comments to explain the purpose of accessing properties or methods.
   • These practices improve code readability even without an ESLint rule.

3. Custom ESLint Rules
   

   • For more granular control, you could create a custom ESLint rule that:
     • Checks for specific patterns or function calls that might indicate unintentional attempts to call these objects.
     • This approach requires advanced ESLint knowledge and ongoing maintenance.