Skip to content

Commit 236b3f9

Browse files
[Term Entry] JavaScript Strings: raw() (#7193)
* [Term Entry] JavaScript Strings: raw() * Update content/javascript/concepts/strings/terms/raw/raw.md * Update content/javascript/concepts/strings/terms/raw/raw.md * Update content/javascript/concepts/strings/terms/raw/raw.md * Update content/javascript/concepts/strings/terms/raw/raw.md * Update content/javascript/concepts/strings/terms/raw/raw.md * Update content/javascript/concepts/strings/terms/raw/raw.md * Update content/javascript/concepts/strings/terms/raw/raw.md * Format + Lint ---------
1 parent 9fc825f commit 236b3f9

File tree

1 file changed

+129
-0
lines changed
  • content/javascript/concepts/strings/terms/raw

1 file changed

+129
-0
lines changed
Lines changed: 129 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,129 @@
1+
---
2+
Title: 'raw()'
3+
Description: 'Returns the raw string form of template literals without processing escape sequences.'
4+
Subjects:
5+
- 'Web Development'
6+
- 'JavaScript'
7+
Tags:
8+
- 'Functions'
9+
- 'Methods'
10+
- 'Strings'
11+
CatalogContent:
12+
- 'introduction-to-javascript'
13+
- 'paths/front-end-engineer-career-path'
14+
---
15+
16+
The **`.raw()`** static method is a tag function for template literals that returns the raw string form without processing escape sequences. It allows developers to access the literal characters in a template string, including backslashes and other escape characters, exactly as they were typed in the source code.
17+
18+
The `.raw()` method is particularly useful when working with file paths, regular expressions, or any scenario where escape sequences should be preserved rather than interpreted. It serves as the only built-in template literal tag function in JavaScript and provides functionality similar to raw string literals found in other programming languages.
19+
20+
## Syntax
21+
22+
```pseudo
23+
String.raw(strings)
24+
String.raw(strings, sub1)
25+
String.raw(strings, sub1, sub2)
26+
String.raw(strings, sub1, sub2, /* …, */ subN)
27+
28+
String.raw`templateString`
29+
```
30+
31+
**Parameters:**
32+
33+
- `strings`: A well-formed template literal array object with a `raw` property whose value is an array-like object of strings
34+
- `sub1`, `...`, `subN`: Contains substitution values that replace placeholders in the template literal
35+
36+
**Return value:**
37+
38+
The `.raw()` method returns a string representing the raw string form of the given template literal.
39+
40+
## Example 1: Basic Usage
41+
42+
This example demonstrates the fundamental difference between a regular template literal and `String.raw()`:
43+
44+
```js
45+
// Regular template literal processes escape sequences
46+
const regularString = `Line 1\nLine 2\tTabbed`;
47+
console.log(regularString);
48+
49+
// String.raw() preserves escape sequences
50+
const rawString = String.raw`Line 1\nLine 2\tTabbed`;
51+
console.log(rawString);
52+
53+
console.log(rawString.length); // 20 characters including \n and \t
54+
```
55+
56+
This example results in the following output:
57+
58+
```shell
59+
Line 1
60+
Line 2 Tabbed
61+
Line 1\nLine 2\tTabbed
62+
22
63+
```
64+
65+
In this example, the regular template literal interprets `\n` as a newline character and `\t` as a tab character. However, `String.raw()` treats these as literal backslash-n and backslash-t character sequences, preserving them exactly as written.
66+
67+
## Example 2: File Path Handling
68+
69+
This example shows how `String.raw()` simplifies working with Windows file paths that contain backslashes:
70+
71+
```js
72+
// Without String.raw() - requires double escaping
73+
const windowsPath1 = 'C:\\Users\\John\\Documents\\file.txt';
74+
console.log(windowsPath1);
75+
76+
// With String.raw() - no escaping needed
77+
const windowsPath2 = String.raw`C:\Users\John\Documents\file.txt`;
78+
console.log(windowsPath2);
79+
```
80+
81+
This example results in the following output:
82+
83+
```shell
84+
C:\Users\John\Documents\file.txt
85+
C:\Users\John\Documents\file.txt
86+
```
87+
88+
This example demonstrates how `String.raw()` eliminates the need for double-escaping backslashes when working with file paths, making the code more readable and less error-prone.
89+
90+
## Codebyte Example: Regular Expression Patterns
91+
92+
This example illustrates using `String.raw()` to create cleaner regular expression patterns by avoiding double escaping. It compares traditional string-based regex patterns with those created using `String.raw()` for both date and URL matching:
93+
94+
```codebyte/javascript
95+
// Traditional string literal requires escaping backslashes
96+
const regexPattern1 = new RegExp("\\d{4}-\\d{2}-\\d{2}");
97+
98+
// String.raw() eliminates double escaping
99+
const regexPattern2 = new RegExp(String.raw`\d{4}-\d{2}-\d{2}`);
100+
101+
// Both patterns work identically for date strings
102+
const dateString = "2024-03-15";
103+
console.log(regexPattern1.test(dateString));
104+
console.log(regexPattern2.test(dateString));
105+
106+
// Traditional way: URL pattern with double escaping
107+
const urlRegex1 = new RegExp("^https?:\\/\\/[\\w\\-\\.]+\\.[a-z]{2,}(\\/.*)?");
108+
109+
// Using String.raw() to simplify escaping
110+
const urlRegex2 = new RegExp(String.raw`^https?:\/\/[\w\-\.]+\.[a-z]{2,}(\/.*)?`);
111+
112+
const url = "https://example.com/path";
113+
console.log(urlRegex1.test(url));
114+
console.log(urlRegex2.test(url));
115+
```
116+
117+
## Frequently Asked Questions
118+
119+
### 1. When should I use `String.raw()` instead of regular template literals?
120+
121+
Use `String.raw()` when you need to preserve escape sequences exactly as written, such as when working with file paths, regular expressions, or any text that contains backslashes that should not be interpreted as escape characters.
122+
123+
### 2. Can I use `String.raw()` with variable substitution?
124+
125+
Yes, `String.raw()` supports template literal substitution using `${}` syntax. The substituted values are processed normally while escape sequences in the literal parts remain raw.
126+
127+
### 3. Does `String.raw()` work with all escape sequences?
128+
129+
Yes, `String.raw()` preserves all escape sequences including `\n`, `\t`, `\"`, `\'`, `\\`, and Unicode escapes like `\u0041`. None of these are processed or converted.

0 commit comments

Comments
 (0)