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
debugging
catch-arguments-passed-in-the-wrong-order-when-calling-a-function.english.md
catch-missing-open-and-closing-parenthesis-after-a-function-call.english.md
catch-misspelled-variable-and-function-names.english.md
catch-mixed-usage-of-single-and-double-quotes.english.md
catch-off-by-one-errors-when-using-indexing.english.md
catch-unclosed-parentheses-brackets-braces-and-quotes.english.md
catch-use-of-assignment-operator-instead-of-equality-operator.english.md
prevent-infinite-loops-with-a-valid-terminal-condition.english.md
understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md
use-caution-when-reinitializing-variables-inside-a-loop.english.md
use-the-javascript-console-to-check-the-value-of-a-variable.english.md
use-typeof-to-check-the-type-of-a-variable.english.md
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-quality-assurance
07-scientific-computing-with-python
08-data-analysis-with-python
09-information-security
10-coding-interview-prep
11-machine-learning-with-python
12-certificates
portuguese
russian
spanish
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
lib.js
md-translation.js
package-entry.js
package-lock.json
package.json
utils.js
cypress
docs
search-indexing
tools
utils
.editorconfig
.eslintignore
.eslintrc.json
.gitattributes
.gitignore
.gitpod.yml
.node-inspectorrc
.npmrc
.prettierignore
.prettierrc
.snyk
.travis.yml
.vcmrc
CODE_OF_CONDUCT.md
CONTRIBUTING.md
Dockerfile.tests
HoF.md
LICENSE.md
README.md
SECURITY.md
change_volumes_owner.sh
cypress-install.js
cypress.json
docker-compose-shared.yml
docker-compose.tests.yml
docker-compose.yml
jest.config.js
lerna.json
package-lock.json
package.json
sample.env
freeCodeCamp/curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md

78 lines
3.1 KiB
Markdown
Raw Normal View History

---
id: 587d7b83367417b2b2512b37
title: Understanding the Differences between the freeCodeCamp and Browser Console
challengeType: 1
isHidden: false
forumTopicId: 301193
---
## Description
<section id='description'>
fix(curriculum): update debugging challenge (fcc vs browser console) (#36703) * fix: debugging-challege+difference-in-consoles * fix: grammar * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com> * fix/remove-comments-for-first-test
2019-08-30 17:31:57 -05:00
You may have noticed that some freeCodeCamp JavaScript challenges include their own console. This console behaves a little differently than the browser console you used in the last challenge.
The following challenge is meant to highlight the main difference between the freeCodeCamp console and your browser console.
When you run ordinary JavaScript, the browser's console will display your <code>console.log()</code> statements the exact number of times it is called.
The freeCodeCamp console will print your <code>console.log()</code> statements a short time after the editor detects a change in the script, as well as during testing.
The freeCodeCamp console is cleared before the tests are run and, to avoid spam, only prints the logs during the first test (see the note below for exceptions).
If you would like to see every log for every test, run the tests, and open the browser console. If you prefer to use the browser console, and want it to mimic the freeCodeCamp console, place <code>console.clear()</code> before any other <code>console</code> calls, to clear the browser console.
**Note:** `console.log`s inside functions are printed to the freeCodeCamp console whenever those functions are called, this can help debugging functions that are called during testing.
</section>
## Instructions
<section id='instructions'>
First, use <code>console.log</code> to log the <code>output</code> variable. Then, use <code>console.clear</code> to clear the browser console.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: You should use <code>console.clear()</code> to clear the browser console.
fix(curriculum): update debugging challenge (fcc vs browser console) (#36703) * fix: debugging-challege+difference-in-consoles * fix: grammar * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com> * fix/remove-comments-for-first-test
2019-08-30 17:31:57 -05:00
testString: const removeJSComments = code.replace(/\/\*[\s\S]*?\*\/|\/\/.*$/gm, ''); const noSpaces = removeJSComments.replace(/\s/g, ''); assert(noSpaces.match(/console.clear\(\)/));
- text: You should use <code>console.log()</code> to print the <code>output</code> variable.
fix(curriculum): update debugging challenge (fcc vs browser console) (#36703) * fix: debugging-challege+difference-in-consoles * fix: grammar * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com> * fix/remove-comments-for-first-test
2019-08-30 17:31:57 -05:00
testString: const noSpaces = code.replace(/\s/g, ''); assert(noSpaces.match(/console\.log\(output\)/));
```
</section>
## Challenge Seed
<section id='challengeSeed'>
<div id='js-seed'>
```js
fix(curriculum): update debugging challenge (fcc vs browser console) (#36703) * fix: debugging-challege+difference-in-consoles * fix: grammar * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com> * fix/remove-comments-for-first-test
2019-08-30 17:31:57 -05:00
// Open your browser console.
let output = "Get this to log once in the freeCodeCamp console and twice in the browser console";
fix(curriculum): update debugging challenge (fcc vs browser console) (#36703) * fix: debugging-challege+difference-in-consoles * fix: grammar * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com> * fix/remove-comments-for-first-test
2019-08-30 17:31:57 -05:00
// Use console.log() to print the output variable.
// Run the tests to see the difference between the two consoles.
// Now, add console.clear() before your console.log() to clear the browser console, and pass the tests.
```
</div>
</section>
## Solution
<section id='solution'>
```js
fix(curriculum): update debugging challenge (fcc vs browser console) (#36703) * fix: debugging-challege+difference-in-consoles * fix: grammar * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com> * fix/remove-comments-for-first-test
2019-08-30 17:31:57 -05:00
// Open your browser console.
let output = "Get this to log once in the freeCodeCamp console and twice in the browser console";
fix(curriculum): update debugging challenge (fcc vs browser console) (#36703) * fix: debugging-challege+difference-in-consoles * fix: grammar * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com> * fix/remove-comments-for-first-test
2019-08-30 17:31:57 -05:00
// Use console.log() to print the output variable.
console.clear();
fix(curriculum): update debugging challenge (fcc vs browser console) (#36703) * fix: debugging-challege+difference-in-consoles * fix: grammar * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com> * Update curriculum/challenges/english/02-javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console.english.md Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com> * fix/remove-comments-for-first-test
2019-08-30 17:31:57 -05:00
console.log(output);
// Run the tests to see the difference between the two consoles.
// Now, add console.clear() before your console.log() to clear the browser console, and pass the tests.
```
</section>