A Comprehensive Guide to JavaScript Global Methods and Properties

• Aug 18, 2023

JavaScript, the dynamic and versatile scripting language that powers the web, comes equipped with an array of global methods and properties. These tools empower developers to handle data, manipulate values, and interact with the browser environment effectively. In this article, we'll explore and demystify some essential JavaScript global methods and properties.

Decoding and Encoding URLs

decodeURI() and decodeURIComponent()

• decodeURI() is your go-to function for decoding complete Uniform Resource Identifiers (URIs) that have been previously encoded.
• decodeURIComponent() is used for decoding specific URI components, such as query parameters.

Example:

const encodedURI = 'https%3A%2F%2Fwww.example.com%2Fpage%3Fparam%3Dvalue';
const decodedURI = decodeURI(encodedURI);
console.log(decodedURI);
const encodedComponent = 'param%3Dvalue%26other%3Ddata';
const decodedComponent = decodeURIComponent(encodedComponent);
console.log(decodedComponent);

encodeURI() and encodeURIComponent()

• encodeURI() ensures that URIs are encoded, making them safe for inclusion in web addresses.
• encodeURIComponent() is used for encoding specific URI components, such as query parameters.

Example:

const originalURI = 'https://www.example.com/page?param=value&other=data';
const encodedURI = encodeURI(originalURI);
console.log(encodedURI);
const originalComponent = 'param=value&other=data';
const encodedComponent = encodeURIComponent(originalComponent);
console.log(encodedComponent);
    

Numeric Operations and Evaluations

eval()

• eval() is a double-edged sword. It evaluates and executes strings as JavaScript code, providing a powerful tool for dynamic execution.

Example:

const result = eval('2 + 2');
console.log(result);

Infinity and NaN

• Infinity represents positive or negative infinity, commonly used in mathematical calculations.
• NaN, or "Not-a-Number," is used to indicate an undefined or unrepresentable value resulting from invalid arithmetic.

Example:

console.log(1 / 0);
console.log(Infinity - 1);
console.log('abc' / 2);    

Numeric Conversions and Parsing

Number(), parseFloat(), and parseInt()

• Number() converts an object's value to a numeric representation.
• parseFloat() parses strings and returns floating-point numbers.
• parseInt() converts strings to integers with an optional radix (base).

Example:

const strNumber = '42';
const num = Number(strNumber);
const floatStr = '3.14';
const parsedFloat = parseFloat(floatStr);
const intStr = '42';
const parsedInt = parseInt(intStr);    

Type Conversion and Undefined Values

String() and undefined

• String() converts an object's value to its string representation.
• undefined indicates a variable that has been declared but not assigned a value.

Example:

const num = 42;
const strNum = String(num);
let undefinedVar;
console.log(undefinedVar);
    

Deprecated Methods: escape() and unescape()

• escape() and unescape() are deprecated. Instead, opt for their modern counterparts: encodeURI(), encodeURIComponent(), decodeURI(), and decodeURIComponent().

Example:

// Deprecated approach
const deprecatedStr = 'Hello, World!';
const escapedStr = escape(deprecatedStr);
const unescapedStr = unescape(escapedStr);
// Modern approach
const modernStr = 'Hello, World!';
const encodedStr = encodeURIComponent(modernStr);
const decodedStr = decodeURIComponent(encodedStr);    

Embrace these JavaScript global methods and properties to master data manipulation, conversions, and interactions with the browser. Keep in mind that while some of these tools grant immense power, they should be used with care, especially functions like eval(). Happy coding and exploring the vast world of JavaScript!