- JavaScript Strings
- Example
- Example
- Example
- String Length
- Example
- Escape Character
- Example
- Example
- Example
- Breaking Long Code Lines
- Example
- Example
- Example
- Example
- JavaScript Strings as Objects
- Example
- Complete String Reference
- Awesome Javascript One-Liners to Look Like a Pro
- JavaScript — split string by new line character
- 1. Problem overview
- 2. Problem solutions
- 2.1. Universal new lines splitting example
- 2.2. Alternative new lines splitting example using \R equivalent
- 2.3. Microsoft Windows new lines splitting example
- 2.4. Unix/Linux new lines splitting example
- 2.5. The classic Mac OS/OS-9 new lines splitting example
- See also
- Alternative titles
JavaScript Strings
JavaScript strings are for storing and manipulating text.
A JavaScript string is zero or more characters written inside quotes.
Example
You can use single or double quotes:
Example
You can use quotes inside a string, as long as they don’t match the quotes surrounding the string:
Example
let answer1 = «It’s alright»;
let answer2 = «He is called ‘Johnny'»;
let answer3 = ‘He is called «Johnny»‘;
String Length
To find the length of a string, use the built-in length property:
Example
Escape Character
Because strings must be written within quotes, JavaScript will misunderstand this string:
The string will be chopped to «We are the so-called «.
The solution to avoid this problem, is to use the backslash escape character.
The backslash ( \ ) escape character turns special characters into string characters:
| Code | Result | Description |
|---|---|---|
| \’ | ‘ | Single quote |
| \» | « | Double quote |
| \\ | \ | Backslash |
The sequence \» inserts a double quote in a string:
Example
The sequence \’ inserts a single quote in a string:
Example
The sequence \\ inserts a backslash in a string:
Example
Six other escape sequences are valid in JavaScript:
| Code | Result |
|---|---|
| \b | Backspace |
| \f | Form Feed |
| \n | New Line |
| \r | Carriage Return |
| \t | Horizontal Tabulator |
| \v | Vertical Tabulator |
The 6 escape characters above were originally designed to control typewriters, teletypes, and fax machines. They do not make any sense in HTML.
Breaking Long Code Lines
For best readability, programmers often like to avoid code lines longer than 80 characters.
If a JavaScript statement does not fit on one line, the best place to break it is after an operator:
Example
You can also break up a code line within a text string with a single backslash:
Example
The \ method is not the preferred method. It might not have universal support.
Some browsers do not allow spaces behind the \ character.
A safer way to break up a string, is to use string addition:
Example
You cannot break up a code line with a backslash:
Example
JavaScript Strings as Objects
Normally, JavaScript strings are primitive values, created from literals:
But strings can also be defined as objects with the keyword new :
Example
Do not create Strings objects.
The new keyword complicates the code and slows down execution speed.
String objects can produce unexpected results:
When using the == operator, x and y are equal:
When using the === operator, x and y are not equal:
Note the difference between (x==y) and (x===y) .
Comparing two JavaScript objects always returns false.
Complete String Reference
For a complete String reference, go to our:
The reference contains descriptions and examples of all string properties and methods.
Awesome Javascript One-Liners to Look Like a Pro
 in your program? This Javascript code easily creates the array in only one line.</p><pre>If you use a plus sign in place of minus, you can get an array with the next seven days. And it doesn’t have to be only the dates of the last week. You can get the dates of the 7 days before/after any date by replacing Date.now() with it.</pre><p>Note that 86400000 used here is the number of milliseconds in a day.</p><p>Capitalize a String</p><p>Even though Javascript doesn’t provide a built-in capitalize method, writing our own method to capitalize a string takes only one line.</p><p>Remove Duplicates in an Array</p><p>We know that sets in Javascript only store unique items. We can use this behavior to our advantage to remove duplicate items in an array. However, it only works with arrays storing primitive data. So you’d have to write a multiline solution to remove duplicates in arrays storing objects. But, still, it’s a quite decent method to remove duplicates in simple scenarios.</p><p>Arrays in JS are awesome, to learn more, check these 15 must known JavaScript array methods .</p><p>Round Decimals to a Certain Number of Decimal Places</p><p>Rounding decimals to a fixed number of decimal points is a tricky business in Javascript. Even though the built-in toFixed() method can easily do this conversion, it gives weird results in some cases because of the way floating-point arithmetics work.</p><p>To avoid this unexpected behavior in our code, we can represent the numbers in exponential notation and use Math.round() to get the decimal rounded to a given number of decimal places.</p><p>Generate a Random ID</p><p>This simple function generates a random ID using Math.random(). Since Math.random() doesn’t guarantee that all the generated numbers are unique, this method is not 100% secure to use in production. But there’s no harm in using it during development to quickly get an ID to complete the implementation and test the app.</p><p>Check if the User Has Scrolled to the Bottom of the Page</p><p>If you want to display/execute something when the user scrolls to the bottom of the page, use this to find whether the user is currently at the bottom.</p><p>Toggle Display of an Element</p><p>You can easily toggle between hiding and displaying an element with the single line method.</p><p>Generate a Random Hex Color</p><p>This method generates a random hex code using Math.random() and padEnd(). Use this whenever you want to display a random color in your program.</p><p>Scroll to the Top of the Page</p><p>You can scroll to the top of the page in Javascript using scrollTo() method. It accepts the X and Y coordinates of the position Javascript should scroll to. So when we pass zero to X and Y, it scrolls to the top of the page.</p><p>Get the Number of Days between Two Days</p><p>In this single-line implementation, you should convert the two days into time-based representation and then find their difference. You can then divide it by the number of milliseconds in a day to get the number of days.</p><p>Clear All Cookies</p><p>You can clear all the cookies stored by the application by setting their expiry date to a date that has already passed. So if you set the expiry date to the first date in the Javascript time system, the system automatically expires the cookie. And you can clear the data stored in cookies along with the previous step.</p><p>Strip HTML from Text</p><p>When accepting user inputs and in other use cases, you might want to strip any HTML elements in the text you process. With the help of DOMParser, this is only one line.</p><p>Detect Dark Mode</p><p>Finally, if you want to detect whether the user has enabled dark mode in their browser, use this one-line solution.</p><p>Final Words…</p><p>In this post, we gave you 15 one-line Javascript solutions to problems that we commonly encounter in frontend development. I hope you found these solutions interesting. And don’t forget to use them to reduce the number of lines in your code. Or even to look cool!</p><p>If you liked what you saw, please support my work!</p><p>I’m a software engineering student who loves web development. I also have a habit of automating everyday stuff with code. I’ve discovered I love writing about programming as much as actual programming.</p><p>I’m extremely lucky to join the Live Code Stream community as a writer and share my love for programming with others one article at a time.</p><p>Ready to ++ Your Development Career?</p><p>Thousands of other developers from companies like Google, Meta, Siemens, freelancers and entrepreneurs are already learning with me.</p><p><a href=)
Источник
JavaScript — split string by new line character
Gigadude
In this article, we’re going to have a look at the problem of how to split string to separate lines in JavaScript.
Note: by default in JavaScript \n newline character should be used, but modern applications exchange information with external endpoints that forces programmers to deal with different cases — this article provides quick solutuioins for the problem.
// ONLINE-RUNNER:browser; var string = 'line 1\n' + 'line 2'; var lines = string.split(/\r?\n/); // Note: the above solution was inspired with new line characters that are used on MacOS, Linux and Windows.
Alternative quick solutions
// ONLINE-RUNNER:browser; var string = 'line 1\r\n' + // \r\n - used as new line symbol 'line 2\n' + // \n - used as new line symbol 'line 3'; var lines = string.split(/\r\n|\n\r|\n|\r/); // split by: \r\n \n\r \n or \r console.log(lines); // array items: line 1, line 2, line 3// ONLINE-RUNNER:browser; var string = 'line 1\r\n' + // \r\n - used as new line symbol 'line 2\n' + // \n - used as new line symbol 'line 3'; // https://dirask.com/posts/JavaScript-R-equivalent-in-RegEx-D9a2rD // var lines = string.split(/\u000D\u000A|[\u000A\u000B\u000C\u000D\u0085\u2028\u2029]/); console.log(lines); // array items: line 1, line 2, line 3Look at below problem description and examples to see how it works in practice.
1. Problem overview
Different operating systems have different newline symbols.
There are a few most commonly used new line separations:
| \n | Multics, Unix and Unix-like systems (Linux, macOS, FreeBSD, AIX, Xenix, etc.), BeOS, Amiga, RISC OS, and others. |
| \r\n | Atari TOS, Microsoft Windows, DOS (MS-DOS, PC DOS, etc.), DEC TOPS-10, RT-11, CP/M, MP/M, OS/2, Symbian OS, Palm OS, Amstrad CPC, and most other early non-Unix and non-IBM operating systems. |
| \r | Commodore 8-bit machines (C64, C128), Acorn BBC, ZX Spectrum, TRS-80, Apple II series, Oberon, the classic Mac OS, MIT Lisp Machine and OS-9 |
| \n\r | Acorn BBC and RISC OS spooled text output. |
2. Problem solutions
2.1. Universal new lines splitting example
It is possible to propose some universal regular expression that lest to get a very good splitting result.
It is necessary to use \r\n|\n\r|\n|\r as a pattern.
Go to this article to see details and runnable example.
2.2. Alternative new lines splitting example using \R equivalent
Some modern regular expression implementations provide \R predefined character class,
e.g. Java, Notepad++, etc.
Most JavaScript engines don't support \R yet - so, it is required some trick.
Go to this article to see details and runnable example.
2.3. Microsoft Windows new lines splitting example
// ONLINE-RUNNER:browser; var string = 'line 1\r\n' + 'line 2\r\n' + 'line 3\r\n' + 'line 4\r\n' + 'line 5'; var lines = string.split('\r\n'); console.log(lines);Systems: Atari TOS, Microsoft Windows, DOS (MS-DOS, PC DOS, etc.), DEC TOPS-10, RT-11, CP/M, MP/M, OS/2, Symbian OS, Palm OS, Amstrad CPC, and most other early non-Unix and non-IBM operating systems.
2.4. Unix/Linux new lines splitting example
// ONLINE-RUNNER:browser; var string = 'line 1\n' + 'line 2\n' + 'line 3\n' + 'line 4\n' + 'line 5'; var lines = string.split('\n'); console.log(lines);Systems: Multics, Unix and Unix-like systems (Linux, macOS, FreeBSD, AIX, Xenix, etc.), BeOS, Amiga, RISC OS, and others.
2.5. The classic Mac OS/OS-9 new lines splitting example
// ONLINE-RUNNER:browser; var string = 'line 1\r' + 'line 2\r' + 'line 3\r' + 'line 4\r' + 'line 5'; var lines = string.split('\r'); console.log(lines);Systems: Commodore 8-bit machines (C64, C128), Acorn BBC, ZX Spectrum, TRS-80, Apple II series, Oberon, the classic Mac OS, MIT Lisp Machine and OS-9.