freeCodeCamp/use-destructuring-assignment-with-the-rest-operator-to-reassign-array-elements.english.md at 80d66a98089f246483d0218d0f068b4e26db4116

gaspersic/freeCodeCamp

Fork 0

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

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

import-a-default-export.english.md

mutate-an-array-declared-with-const.english.md

prevent-object-mutation.english.md

set-default-parameters-for-your-functions.english.md

understand-the-differences-between-import-and-require.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-pass-an-object-as-a-functions-parameters.english.md

use-destructuring-assignment-with-the-rest-operator-to-reassign-array-elements.english.md

use-export-to-reuse-a-code-block.english.md

use-getters-and-setters-to-control-access-to-an-object.english.md

use-the-rest-operator-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-simple-fields.english.md

write-higher-order-arrow-functions.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

formattingConversion

math-challenges

requiresTests

schema

test

.babelrc

.editorconfig

.eslintignore

.eslintrc

.npmignore

.prettierrc

.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

repack.js

unpack.js

unpacked.css

unpacked.js

unpackedChallenge.js

utils.js

docs

guide

mock-guide

tools

.editorconfig

.eslintignore

.eslintrc

.gitattributes

.gitignore

.node-inspectorrc

.prettierrc

.snyk

.travis.yml

.vcmrc

CODE_OF_CONDUCT.md

CONTRIBUTING.md

LICENSE.md

README.french.md

README.italian.md

README.md

docker-compose-shared.yml

docker-compose.yml

lerna.json

netlify.toml

package-lock.json

package.json

sample.env

Aditya d9c6a13741 [Tests] ES6: Use Destructuring Assignment with the Rest Operator (#34303 )

2018-11-22 22:27:16 +09:00

2.6 KiB

Raw Blame History

id, title, challengeType

id	title	challengeType
587d7b8a367417b2b2512b4c	Use Destructuring Assignment with the Rest Operator to Reassign Array Elements	1

Description

In some situations involving array destructuring, we might want to collect the rest of the elements into a separate array. The result is similar to Array.prototype.slice(), as shown below:

const [a, b, ...arr] = [1, 2, 3, 4, 5, 7];
console.log(a, b); // 1, 2
console.log(arr); // [3, 4, 5, 7]

Variables a and b take the first and second values from the array. After that, because of rest operator's presence, arr gets rest of the values in the form of an array. The rest element only works correctly as the last variable in the list. As in, you cannot use the rest operator to catch a subarray that leaves out last element of the original array.

Instructions

Use destructuring assignment with the rest operator to perform an effective Array.prototype.slice() so that arr is a sub-array of the original array source with the first two elements omitted.

Tests

tests:
  - text: <code>arr</code> should be <code>[3,4,5,6,7,8,9,10]</code>
    testString: assert(arr.every((v, i) => v === i + 3) && arr.length === 8,'<code>arr</code> should be <code>[3,4,5,6,7,8,9,10]</code>');
  - text: <code>Array.slice()</code> should not be used.
    testString: getUserInput => assert(!getUserInput('index').match(/slice/g), '<code>Array.slice()</code> should not be used.');
  - text: Destructuring on <code>list</code> should be used.
    testString: getUserInput => assert(getUserInput('index').match(/\s*\[\s*,\s*,\s*\.\.\.\s*arr\s*\]\s*=\s*list\s*/g), 'Destructuring on <code>list</code> should be used.');

Challenge Seed

const source = [1,2,3,4,5,6,7,8,9,10];
function removeFirstTwo(list) {
  "use strict";
  // change code below this line
  const arr = list; // change this
  // change code above this line
  return arr;
}
const arr = removeFirstTwo(source);
console.log(arr); // should be [3,4,5,6,7,8,9,10]
console.log(source); // should be [1,2,3,4,5,6,7,8,9,10];

Solution

const source = [1,2,3,4,5,6,7,8,9,10];
function removeFirstTwo(list) {
  "use strict";
  // change code below this line
  const [, , ...arr] = list;
  // change code above this line
  return arr;
}
const arr = removeFirstTwo(source);

2.6 KiB Raw Blame History