Files
.github
api-server
client
config
curriculum
challenges
_meta
arabic
chinese
english
01-responsive-web-design
02-javascript-algorithms-and-data-structures
basic-algorithm-scripting
basic-data-structures
basic-javascript
access-array-data-with-indexes.english.md
access-multi-dimensional-arrays-with-indexes.english.md
accessing-nested-arrays.english.md
accessing-nested-objects.english.md
accessing-object-properties-with-bracket-notation.english.md
accessing-object-properties-with-dot-notation.english.md
accessing-object-properties-with-variables.english.md
add-new-properties-to-a-javascript-object.english.md
add-two-numbers-with-javascript.english.md
adding-a-default-option-in-switch-statements.english.md
appending-variables-to-strings.english.md
assignment-with-a-returned-value.english.md
build-javascript-objects.english.md
chaining-if-else-statements.english.md
comment-your-javascript-code.english.md
comparison-with-the-equality-operator.english.md
comparison-with-the-greater-than-operator.english.md
comparison-with-the-greater-than-or-equal-to-operator.english.md
comparison-with-the-inequality-operator.english.md
comparison-with-the-less-than-operator.english.md
comparison-with-the-less-than-or-equal-to-operator.english.md
comparison-with-the-strict-equality-operator.english.md
comparison-with-the-strict-inequality-operator.english.md
comparisons-with-the-logical-and-operator.english.md
comparisons-with-the-logical-or-operator.english.md
compound-assignment-with-augmented-addition.english.md
compound-assignment-with-augmented-division.english.md
compound-assignment-with-augmented-multiplication.english.md
compound-assignment-with-augmented-subtraction.english.md
concatenating-strings-with-plus-operator.english.md
concatenating-strings-with-the-plus-equals-operator.english.md
constructing-strings-with-variables.english.md
count-backwards-with-a-for-loop.english.md
counting-cards.english.md
create-decimal-numbers-with-javascript.english.md
declare-javascript-variables.english.md
declare-string-variables.english.md
decrement-a-number-with-javascript.english.md
delete-properties-from-a-javascript-object.english.md
divide-one-decimal-by-another-with-javascript.english.md
divide-one-number-by-another-with-javascript.english.md
escape-sequences-in-strings.english.md
escaping-literal-quotes-in-strings.english.md
find-the-length-of-a-string.english.md
finding-a-remainder-in-javascript.english.md
generate-random-fractions-with-javascript.english.md
generate-random-whole-numbers-with-javascript.english.md
generate-random-whole-numbers-within-a-range.english.md
global-scope-and-functions.english.md
global-vs.-local-scope-in-functions.english.md
golf-code.english.md
increment-a-number-with-javascript.english.md
initializing-variables-with-the-assignment-operator.english.md
introducing-else-if-statements.english.md
introducing-else-statements.english.md
iterate-odd-numbers-with-a-for-loop.english.md
iterate-through-an-array-with-a-for-loop.english.md
iterate-with-javascript-do...while-loops.english.md
iterate-with-javascript-for-loops.english.md
iterate-with-javascript-while-loops.english.md
local-scope-and-functions.english.md
logical-order-in-if-else-statements.english.md
manipulate-arrays-with-pop.english.md
manipulate-arrays-with-push.english.md
manipulate-arrays-with-shift.english.md
manipulate-arrays-with-unshift.english.md
manipulating-complex-objects.english.md
modify-array-data-with-indexes.english.md
multiple-identical-options-in-switch-statements.english.md
multiply-two-decimals-with-javascript.english.md
multiply-two-numbers-with-javascript.english.md
nest-one-array-within-another-array.english.md
nesting-for-loops.english.md
passing-values-to-functions-with-arguments.english.md
practice-comparing-different-values.english.md
profile-lookup.english.md
quoting-strings-with-single-quotes.english.md
record-collection.english.md
replace-loops-using-recursion.english.md
replacing-if-else-chains-with-switch.english.md
return-a-value-from-a-function-with-return.english.md
return-early-pattern-for-functions.english.md
returning-boolean-values-from-functions.english.md
selecting-from-many-options-with-switch-statements.english.md
shopping-list.english.md
stand-in-line.english.md
store-multiple-values-in-one-variable-using-javascript-arrays.english.md
storing-values-with-the-assignment-operator.english.md
subtract-one-number-from-another-with-javascript.english.md
testing-objects-for-properties.english.md
understand-string-immutability.english.md
understanding-boolean-values.english.md
understanding-case-sensitivity-in-variables.english.md
understanding-undefined-value-returned-from-a-function.english.md
understanding-uninitialized-variables.english.md
updating-object-properties.english.md
use-bracket-notation-to-find-the-first-character-in-a-string.english.md
use-bracket-notation-to-find-the-last-character-in-a-string.english.md
use-bracket-notation-to-find-the-nth-character-in-a-string.english.md
use-bracket-notation-to-find-the-nth-to-last-character-in-a-string.english.md
use-conditional-logic-with-if-statements.english.md
use-multiple-conditional-ternary-operators.english.md
use-recursion-to-create-a-range-of-numbers.english.md
use-the-conditional-ternary-operator.english.md
use-the-parseint-function-with-a-radix.english.md
use-the-parseint-function.english.md
using-objects-for-lookups.english.md
word-blanks.english.md
write-reusable-javascript-with-functions.english.md
debugging
es6
functional-programming
intermediate-algorithm-scripting
javascript-algorithms-and-data-structures-projects
object-oriented-programming
regular-expressions
03-front-end-libraries
04-data-visualization
05-apis-and-microservices
06-information-security-and-quality-assurance
08-coding-interview-prep
09-certificates
portuguese
russian
spanish
formattingConversion
math-challenges
requiresTests
schema
test
.babelrc
.editorconfig
.npmignore
.travis.yml
CHANGELOG.md
LICENSE.md
commitizen.config.js
commitlint.config.js
create-challenge-bundle.js
getChallenges.js
gulpfile.js
index.js
lib.js
md-translation.js
package-entry.js
package-lock.json
package.json
utils.js
docs
guide
search-indexing
tools
.editorconfig
.eslintignore
.eslintrc.json
.gitattributes
.gitignore
.gitpod.Dockerfile
.gitpod.yml
.node-inspectorrc
.prettierignore
.prettierrc
.snyk
.travis.yml
.vcmrc
CODE_OF_CONDUCT.md
CONTRIBUTING.md
Dockerfile.tests
LICENSE.md
README.french.md
README.italian.md
README.korean.md
README.md
SECURITY.md
azure-pipelines.yml
change_volumes_owner.sh
docker-compose-shared.yml
docker-compose.tests.yml
docker-compose.yml
lerna.json
libcimp_index_js.patch
package-lock.json
package.json
patch_npm_and_install.sh
sample.env
freeCodeCamp/curriculum/challenges/english/02-javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings.english.md

85 lines
3.3 KiB
Markdown
Raw Normal View History

---
id: 56533eb9ac21ba0edf2244b6
title: Escape Sequences in Strings
challengeType: 1
videoUrl: 'https://scrimba.com/c/cvmqRh6'
forumTopicId: 17567
---
## Description
<section id='description'>
Quotes are not the only characters that can be <dfn>escaped</dfn> inside a string. There are two reasons to use escaping characters:<ol><li>To allow you to use characters you may not otherwise be able to type out, such as a carriage returns.</li><li>To allow you to represent multiple quotes in a string without JavaScript misinterpreting what you mean.</li></ol>We learned this in the previous challenge.
<table class="table table-striped"><thead><tr><th>Code</th><th>Output</th></tr></thead><tbody><tr><td><code>\'</code></td><td>single quote</td></tr><tr><td><code>\"</code></td><td>double quote</td></tr><tr><td><code>\\</code></td><td>backslash</td></tr><tr><td><code>\n</code></td><td>newline</td></tr><tr><td><code>\r</code></td><td>carriage return</td></tr><tr><td><code>\t</code></td><td>tab</td></tr><tr><td><code>\b</code></td><td>word boundary</td></tr><tr><td><code>\f</code></td><td>form feed</td></tr></tbody></table>
<em>Note that the backslash itself must be escaped in order to display as a backslash.</em>
</section>
## Instructions
<section id='instructions'>
Assign the following three lines of text into the single variable <code>myStr</code> using escape sequences.
<blockquote>FirstLine<br/>&nbsp;&nbsp;&nbsp;&nbsp;\SecondLine<br/>ThirdLine</blockquote>
You will need to use escape sequences to insert special characters correctly. You will also need to follow the spacing as it looks above, with no spaces between escape sequences or words.
Here is the text with the escape sequences written out.
<q>FirstLine<code>newline</code><code>tab</code><code>backslash</code>SecondLine<code>newline</code>ThirdLine</q>
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: <code>myStr</code> should not contain any spaces
testString: assert(!/ /.test(myStr));
- text: <code>myStr</code> should contain the strings <code>FirstLine</code>, <code>SecondLine</code> and <code>ThirdLine</code> (remember case sensitivity)
testString: assert(/FirstLine/.test(myStr) && /SecondLine/.test(myStr) && /ThirdLine/.test(myStr));
- text: <code>FirstLine</code> should be followed by the newline character <code>\n</code>
testString: assert(/FirstLine\n/.test(myStr));
- text: <code>myStr</code> should contain a tab character <code>\t</code> which follows a newline character
testString: assert(/\n\t/.test(myStr));
- text: <code>SecondLine</code> should be preceded by the backslash character <code>\</code>
testString: assert(/\\SecondLine/.test(myStr));
- text: There should be a newline character between <code>SecondLine</code> and <code>ThirdLine</code>
testString: assert(/SecondLine\nThirdLine/.test(myStr));
- text: <code>myStr</code> should only contain characters shown in the instructions
testString: assert(myStr === 'FirstLine\n\t\\SecondLine\nThirdLine');
```
</section>
## Challenge Seed
<section id='challengeSeed'>
<div id='js-seed'>
```js
var myStr; // Change this line
```
</div>
### After Test
<div id='js-teardown'>
```js
(function(){
if (myStr !== undefined){
console.log('myStr:\n' + myStr);}})();
```
</div>
</section>
## Solution
<section id='solution'>
```js
var myStr = "FirstLine\n\t\\SecondLine\nThirdLine";
```
</section>