Clue Mediator

Essential Global Methods in JavaScript: A Friendly Guide

📅January 9, 2025

JavaScript provides a set of powerful global methods that help you manipulate data, parse numbers, and even decode or encode strings. In this guide, we’ll walk through some of the most commonly used global methods and show you how they work with clear, easy-to-understand examples.

Understanding Global Methods in JavaScript

  1. URI Encoding and Decoding Methods
  2. Number Parsing and Validation
  3. Other Useful Global Methods

1. URI Encoding and Decoding Methods

These methods help you encode and decode URIs or URI components. They are essential for working with URLs and ensuring proper encoding.

  • decodeURI(): Decodes a URI by replacing escape sequences with their corresponding characters.

    let encoded = "Hello%20World";
    console.log(decodeURI(encoded)); // Output: "Hello World"
    
  • decodeURIComponent(): Decodes a URI component (similar to decodeURI() but works for individual parts of a URI).

    let encoded = "name%3DJohn%26age%3D30";
    console.log(decodeURIComponent(encoded)); // Output: "name=John&age=30"
    
  • encodeURI(): Encodes a URI by replacing characters that are not allowed in a URI with their encoded counterparts.

    let uri = "Hello World!";
    console.log(encodeURI(uri)); // Output: "Hello%20World%21"
    
  • encodeURIComponent(): Encodes a URI component by replacing characters that are not allowed in the component.

    let component = "name=John&age=30";
    console.log(encodeURIComponent(component)); // Output: "name%3DJohn%26age%3D30"
    

2. Number Parsing and Validation

These methods are commonly used for parsing strings into numbers or checking if values are valid numbers.

  • isFinite(): Determines whether a value is a finite, legal number.

    console.log(isFinite(100)); // Output: true
    console.log(isFinite(Infinity)); // Output: false
    
  • isNaN(): Checks if a value is NaN (Not-a-Number).

    console.log(isNaN("Hello")); // Output: true
    console.log(isNaN(100)); // Output: false
    
  • Number(): Converts a value to a number.

    console.log(Number("123")); // Output: 123
    console.log(Number("Hello")); // Output: NaN
    
  • parseFloat(): Parses a string and returns a floating-point number.

    console.log(parseFloat("3.14abc")); // Output: 3.14
    
  • parseInt(): Parses a string and returns an integer.

    console.log(parseInt("100px")); // Output: 100
    

3. Other Useful Global Methods

  • eval(): Evaluates a string and executes it as code. While powerful, it should be used carefully due to security risks.

    let code = "let x = 10; x + 5";
    console.log(eval(code)); // Output: 15
    
  • escape(): Encodes a string, escaping characters that are not safe to be used in URLs (note: it's deprecated).

    let str = "Hello World!";
    console.log(escape(str)); // Output: "Hello%20World%21"
    
  • unescape(): Decodes a string that was encoded with escape().

    let encoded = "Hello%20World%21";
    console.log(unescape(encoded)); // Output: "Hello World!"
    

Conclusion

Global methods in JavaScript are incredibly useful when you need to manipulate data or handle URIs and numbers. Whether you're working with encoding, decoding, or validating data, these methods can make your code cleaner and more efficient. Keep these methods in your toolkit, and you’ll be able to handle all kinds of data processing tasks.

"Code is like a puzzle, and every global method is a piece that helps you complete the picture."