JavaScript trim() Function – Leading and Trailing Whitespace

Definition and Usage

The trim() function returns a new string with whitespace removed from both ends of the given string.

Features

Whitespace characters (Space, Tab,  , and others) and newline characters (such as LF and CR) are treated as whitespace.
The function removes whitespace from both ends of the given string and returns a new copy without modifying the original string.
Whitespace in the middle of the string is preserved.
Even if there is no whitespace at one end or at both ends of the string, the function still returns a new string.
Because the function only returns a value, the original string remains unchanged.

Whitespace: When characters are arranged in sequence, characters that provide space between other characters are referred to as whitespace characters.
Whitespace characters include the space inserted by pressing the Space bar and the tab inserted by pressing the Tab key.   is an HTML special character (entity) that represents a non-breaking space, which does not cause a line break.
A newline character refers to a character that moves text to a new line when the Enter key is pressed. LF (Line Feed) and CR (Carriage Return) describe different ways of handling newline characters.

Basic Example

JavaScript

const originalString = "   Welcome! Nice to meet you!  ";
const trimString = originalString.trim();

/* Spaces inside the string are preserved.
   The original string is not modified; only a new string is returned. */
console.log(trimString); // Output: "Welcome! Nice to meet you!"

/* 👇 The original string remains unchanged. */
console.log(originalString); // Output: "   Welcome! Nice to meet you!  "

Syntax

str is the string to which the trim() function is applied.
This function is intended for strings only. Calling it on a value of any other data type will result in a TypeError.

Parameters

None.

Return value

Returns a new string with whitespace removed from both ends of the original string. The original string is not modified in the process.

Things to Keep in Mind

The trim() function is a method that can only be used on strings. If you attempt to call this method on a value that is not a string, a TypeError will be thrown. Such a call is not a valid operation.

JavaScript

const number = 17;

try {
    let result = number.trim(); // TypeError occurs here
    console.log(result);
} catch (error) {
    console.error(error); // TypeError: number.trim is not a function
}

In the code above, trim() is being called on a number, which causes a TypeError. To prevent this, ensure that the value is a string before calling trim(), or convert it to a string as needed.

Exploring Methods for Removing Leading and Trailing Whitespace

The trim() function is widely used to return a new string with whitespace removed from both ends of a string. In addition, let's look at how to use the replace() function with regular expressions for similar purposes.

Using the `replace()` Function with Regular Expressions

Additional Explanation
The replace() function for strings searches for a specific part of a string and replaces it with another string. Using a specific string or a regular expression pattern, it searches within the original string, and the matched part is replaced with the desired string and returned.

Here, we will see how to use a regular expression pattern to remove whitespace from both ends of a string.

In general, if your goal is simply to remove whitespace, it is recommended to use the trim() function, as it is intuitive and performs well. However, in special situations where a more precise pattern is required, using a regular expression can also be a valid choice.