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
es6
compare-scopes-of-the-var-and-let-keywords.english.md
complete-a-promise-with-resolve-and-reject.english.md
create-a-javascript-promise.english.md
create-a-module-script.english.md
create-an-export-fallback-with-export-default.english.md
create-strings-using-template-literals.english.md
declare-a-read-only-variable-with-the-const-keyword.english.md
explore-differences-between-the-var-and-let-keywords.english.md
handle-a-fulfilled-promise-with-then.english.md
handle-a-rejected-promise-with-catch.english.md
import-a-default-export.english.md
mutate-an-array-declared-with-const.english.md
prevent-object-mutation.english.md
reuse-javascript-code-using-import.english.md
set-default-parameters-for-your-functions.english.md
use--to-import-everything-from-a-file.english.md
use-arrow-functions-to-write-concise-anonymous-functions.english.md
use-class-syntax-to-define-a-constructor-function.english.md
use-destructuring-assignment-to-assign-variables-from-arrays.english.md
use-destructuring-assignment-to-assign-variables-from-nested-objects.english.md
use-destructuring-assignment-to-assign-variables-from-objects.english.md
use-destructuring-assignment-to-extract-values-from-objects.english.md
use-destructuring-assignment-to-pass-an-object-as-a-functions-parameters.english.md
use-destructuring-assignment-with-the-rest-parameter-to-reassign-array-elements.english.md
use-export-to-share-a-code-block.english.md
use-getters-and-setters-to-control-access-to-an-object.english.md
use-the-rest-parameter-with-function-parameters.english.md
use-the-spread-operator-to-evaluate-arrays-in-place.english.md
write-arrow-functions-with-parameters.english.md
write-concise-declarative-functions-with-es6.english.md
write-concise-object-literal-declarations-using-object-property-shorthand.english.md
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
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
search-indexing
tools
utils
.editorconfig
.eslintignore
.eslintrc.json
.gitattributes
.gitignore
.gitpod.yml
.node-inspectorrc
.prettierignore
.prettierrc
.snyk
.travis.yml
.vcmrc
CODE_OF_CONDUCT.md
CONTRIBUTING.md
Dockerfile.tests
LICENSE.md
README.md
SECURITY.md
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/es6/prevent-object-mutation.english.md

105 lines
2.5 KiB
Markdown
Raw Normal View History

---
id: 598f48a36c8c40764b4e52b3
title: Prevent Object Mutation
challengeType: 1
forumTopicId: 301207
---
## Description
<section id='description'>
As seen in the previous challenge, <code>const</code> declaration alone doesn't really protect your data from mutation. To ensure your data doesn't change, JavaScript provides a function <code>Object.freeze</code> to prevent data mutation.
Once the object is frozen, you can no longer add, update, or delete properties from it. Any attempt at changing the object will be rejected without an error.
```js
let obj = {
name:"FreeCodeCamp",
review:"Awesome"
};
Object.freeze(obj);
obj.review = "bad"; // will be ignored. Mutation not allowed
obj.newProp = "Test"; // will be ignored. Mutation not allowed
console.log(obj);
// { name: "FreeCodeCamp", review:"Awesome"}
```
</section>
## Instructions
<section id='instructions'>
In this challenge you are going to use <code>Object.freeze</code> to prevent mathematical constants from changing. You need to freeze the <code>MATH_CONSTANTS</code> object so that no one is able to alter the value of <code>PI</code>, add, or delete properties.
</section>
## Tests
<section id='tests'>
```yml
tests:
- text: Do not replace <code>const</code> keyword.
testString: getUserInput => assert(getUserInput('index').match(/const/g));
- text: <code>MATH_CONSTANTS</code> should be a constant variable (by using <code>const</code>).
testString: getUserInput => assert(getUserInput('index').match(/const\s+MATH_CONSTANTS/g));
- text: Do not change original <code>MATH_CONSTANTS</code>.
testString: getUserInput => assert(getUserInput('index').match(/const\s+MATH_CONSTANTS\s+=\s+{\s+PI:\s+3.14\s+};/g));
- text: <code>PI</code> equals <code>3.14</code>.
testString: assert(PI === 3.14);
```
</section>
## Challenge Seed
<section id='challengeSeed'>
<div id='js-seed'>
```js
function freezeObj() {
'use strict';
const MATH_CONSTANTS = {
PI: 3.14
};
// change code below this line
// change code above this line
try {
MATH_CONSTANTS.PI = 99;
} catch(ex) {
console.log(ex);
}
return MATH_CONSTANTS.PI;
}
const PI = freezeObj();
```
</div>
</section>
## Solution
<section id='solution'>
```js
function freezeObj() {
'use strict';
const MATH_CONSTANTS = {
PI: 3.14
};
// change code below this line
Object.freeze(MATH_CONSTANTS);
// change code above this line
try {
MATH_CONSTANTS.PI = 99;
} catch(ex) {
console.log(ex);
}
return MATH_CONSTANTS.PI;
}
const PI = freezeObj();
```
</section>