fix: use dfn instead of code tag (#36640)

* Use dfn tags

* remove misused <dfn> tags

* Revert "remove misused <dfn> tags"

This reverts commit b24968a968.

* Update curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/fill-in-the-blank-with-placeholder-text.english.md

Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com>

* Make "array" lowercase

Co-Authored-By: Randell Dawson <5313213+RandellDawson@users.noreply.github.com>

* Fix dfn usage

* Address last dfn tags
This commit is contained in:
SomeDer
2019-10-27 15:45:37 -01:00
committed by Randell Dawson
parent 0551a6a57f
commit bfa5c26288
75 changed files with 161 additions and 161 deletions

View File

@@ -8,7 +8,7 @@ forumTopicId: 16158
## Description
<section id='description'>
We can access the data inside arrays using <code>indexes</code>.
We can access the data inside arrays using <dfn>indexes</dfn>.
Array indexes are written in the same bracket notation that strings use, except that instead of specifying a character, they are specifying an entry in the array. Like strings, arrays use <dfn>zero-based</dfn> indexing, so the first element in an array is element <code>0</code>.
<br />
<strong>Example</strong>

View File

@@ -8,8 +8,8 @@ forumTopicId: 16784
## Description
<section id='description'>
There are many <dfn>Comparison Operators</dfn> in JavaScript. All of these operators return a boolean <code>true</code> or <code>false</code> value.
The most basic operator is the equality operator <code>==</code>. The equality operator compares two values and returns <code>true</code> if they're equivalent or <code>false</code> if they are not. Note that equality is different from assignment (<code>=</code>), which assigns the value at the right of the operator to a variable on the left.
There are many <dfn>comparison operators</dfn> in JavaScript. All of these operators return a boolean <code>true</code> or <code>false</code> value.
The most basic operator is the equality operator <code>==</code>. The equality operator compares two values and returns <code>true</code> if they're equivalent or <code>false</code> if they are not. Note that equality is different from assignment (<code>=</code>), which assigns the value at the right of the operator to a variable in the left.
```js
function equalityTest(myVal) {
@@ -21,7 +21,7 @@ function equalityTest(myVal) {
```
If <code>myVal</code> is equal to <code>10</code>, the equality operator returns <code>true</code>, so the code in the curly braces will execute, and the function will return <code>"Equal"</code>. Otherwise, the function will return <code>"Not Equal"</code>.
In order for JavaScript to compare two different <code>data types</code> (for example, <code>numbers</code> and <code>strings</code>), it must convert one type to another. This is known as "Type Coercion". Once it does, however, it can compare terms as follows:
In order for JavaScript to compare two different <dfn>data types</dfn> (for example, <code>numbers</code> and <code>strings</code>), it must convert one type to another. This is known as "Type Coercion". Once it does, however, it can compare terms as follows:
```js
1 == 1 // true
@@ -34,7 +34,7 @@ In order for JavaScript to compare two different <code>data types</code> (for ex
## Instructions
<section id='instructions'>
Add the <code>equality operator</code> to the indicated line so that the function will return "Equal" when <code>val</code> is equivalent to <code>12</code>.
Add the equality operator to the indicated line so that the function will return "Equal" when <code>val</code> is equivalent to <code>12</code>.
</section>
## Tests

View File

@@ -23,7 +23,7 @@ Like the equality operator, greater than operator will convert data types of val
## Instructions
<section id='instructions'>
Add the <code>greater than</code> operator to the indicated lines so that the return statements make sense.
Add the greater than operator to the indicated lines so that the return statements make sense.
</section>
## Tests

View File

@@ -8,7 +8,7 @@ forumTopicId: 16785
## Description
<section id='description'>
The <code>greater than or equal to</code> operator (<code>&gt;=</code>) compares the values of two numbers. If the number to the left is greater than or equal to the number to the right, it returns <code>true</code>. Otherwise, it returns <code>false</code>.
The greater than or equal to operator (<code>&gt;=</code>) compares the values of two numbers. If the number to the left is greater than or equal to the number to the right, it returns <code>true</code>. Otherwise, it returns <code>false</code>.
Like the equality operator, <code>greater than or equal to</code> operator will convert data types while comparing.
<strong>Examples</strong>
@@ -23,7 +23,7 @@ Like the equality operator, <code>greater than or equal to</code> operator will
## Instructions
<section id='instructions'>
Add the <code>greater than or equal to</code> operator to the indicated lines so that the return statements make sense.
Add the greater than or equal to operator to the indicated lines so that the return statements make sense.
</section>
## Tests

View File

@@ -23,7 +23,7 @@ The <dfn>less than</dfn> operator (<code>&lt;</code>) compares the values of two
## Instructions
<section id='instructions'>
Add the <code>less than</code> operator to the indicated lines so that the return statements make sense.
Add the less than operator to the indicated lines so that the return statements make sense.
</section>
## Tests

View File

@@ -8,7 +8,7 @@ forumTopicId: 16788
## Description
<section id='description'>
The <code>less than or equal to</code> operator (<code>&lt;=</code>) compares the values of two numbers. If the number to the left is less than or equal to the number to the right, it returns <code>true</code>. If the number on the left is greater than the number on the right, it returns <code>false</code>. Like the equality operator, <code>less than or equal to</code> converts data types.
The less than or equal to operator (<code>&lt;=</code>) compares the values of two numbers. If the number to the left is less than or equal to the number to the right, it returns <code>true</code>. If the number on the left is greater than the number on the right, it returns <code>false</code>. Like the equality operator, <code>less than or equal to</code> converts data types.
<strong>Examples</strong>
```js
@@ -23,7 +23,7 @@ The <code>less than or equal to</code> operator (<code>&lt;=</code>) compares th
## Instructions
<section id='instructions'>
Add the <code>less than or equal to</code> operator to the indicated lines so that the return statements make sense.
Add the less than or equal to operator to the indicated lines so that the return statements make sense.
</section>
## Tests

View File

@@ -21,7 +21,7 @@ The strict inequality operator (<code>!==</code>) is the logical opposite of the
## Instructions
<section id='instructions'>
Add the <code>strict inequality operator</code> to the <code>if</code> statement so the function will return "Not Equal" when <code>val</code> is not strictly equal to <code>17</code>
Add the strict inequality operator to the <code>if</code> statement so the function will return "Not Equal" when <code>val</code> is not strictly equal to <code>17</code>
</section>
## Tests

View File

@@ -9,7 +9,7 @@ forumTopicId: 18219
## Description
<section id='description'>
You can run the same code multiple times by using a loop.
The most common type of JavaScript loop is called a <code>for loop</code> because it runs "for" a specific number of times.
The most common type of JavaScript loop is called a <code>for</code> loop because it runs "for" a specific number of times.
For loops are declared with three optional expressions separated by semicolons:
<code>for ([initialization]; [condition]; [final-expression])</code>
The <code>initialization</code> statement is executed one time only before the loop starts. It is typically used to define and setup your loop variable.

View File

@@ -8,7 +8,7 @@ forumTopicId: 18247
## Description
<section id='description'>
You can also nest arrays within other arrays, like this: <code>[["Bulls", 23], ["White Sox", 45]]</code>. This is also called a <dfn>Multi-dimensional Array<dfn>.
You can also nest arrays within other arrays, like this: <code>[["Bulls", 23], ["White Sox", 45]]</code>. This is also called a <dfn>multi-dimensional arrray<dfn>.
</section>
## Instructions

View File

@@ -28,7 +28,7 @@ typeof '3' // returns 'string'
## Instructions
<section id='instructions'>
The <code>compareEquality</code> function in the editor compares two values using the <code>equality operator</code>. Modify the function so that it returns "Equal" only when the values are strictly equal.
The <code>compareEquality</code> function in the editor compares two values using the equality operator. Modify the function so that it returns "Equal" only when the values are strictly equal.
</section>
## Tests

View File

@@ -8,14 +8,14 @@ forumTopicId: 18341
## Description
<section id='description'>
<code>Bracket notation</code> is a way to get a character at a specific <code>index</code> within a string.
<dfn>Bracket notation</dfn> is a way to get a character at a specific <code>index</code> within a string.
Most modern programming languages, like JavaScript, don't start counting at 1 like humans do. They start at 0. This is referred to as <dfn>Zero-based</dfn> indexing.
For example, the character at index 0 in the word "Charles" is "C". So if <code>var firstName = "Charles"</code>, you can get the value of the first letter of the string by using <code>firstName[0]</code>.
</section>
## Instructions
<section id='instructions'>
Use <dfn>bracket notation</dfn> to find the first character in the <code>lastName</code> variable and assign it to <code>firstLetterOfLastName</code>.
Use bracket notation to find the first character in the <code>lastName</code> variable and assign it to <code>firstLetterOfLastName</code>.
<strong>Hint</strong><br>Try looking at the <code>firstLetterOfFirstName</code> variable declaration if you get stuck.
</section>

View File

@@ -8,7 +8,7 @@ forumTopicId: 301179
## Description
<section id='description'>
In the previous challenge, you used a single <code>conditional operator</code>. You can also chain them together to check for multiple conditions.
In the previous challenge, you used a single conditional operator. You can also chain them together to check for multiple conditions.
The following function uses if, else if, and else statements to check multiple conditions:
```js
@@ -25,7 +25,7 @@ function findGreaterOrEqual(a, b) {
}
```
The above function can be re-written using multiple <code>conditional operators</code>:
The above function can be re-written using multiple conditional operators:
```js
function findGreaterOrEqual(a, b) {
@@ -35,7 +35,7 @@ function findGreaterOrEqual(a, b) {
}
```
However, this should be used with care as using multiple <code>conditional operators</code> without proper indentation may make your code hard to read. For example:
However, this should be used with care as using multiple conditional operators without proper indentation may make your code hard to read. For example:
```js
function findGreaterOrEqual(a, b) {
@@ -47,7 +47,7 @@ function findGreaterOrEqual(a, b) {
## Instructions
<section id='instructions'>
Use multiple <code>conditional operators</code> in the <code>checkSign</code> function to check if a number is positive, negative or zero. The function should return "positive", "negative" or "zero".
Use multiple conditional operators in the <code>checkSign</code> function to check if a number is positive, negative or zero. The function should return "positive", "negative" or "zero".
</section>
## Tests
@@ -55,7 +55,7 @@ Use multiple <code>conditional operators</code> in the <code>checkSign</code> fu
```yml
tests:
- text: <code>checkSign</code> should use multiple <code>conditional operators</code>
- text: <code>checkSign</code> should use multiple conditional operators
testString: assert(/.+?\s*?\?\s*?.+?\s*?:\s*?.+?\s*?\?\s*?.+?\s*?:\s*?.+?/gi.test(code));
- text: <code>checkSign(10)</code> should return "positive". Note that capitalization matters
testString: assert(checkSign(10) === 'positive');

View File

@@ -7,7 +7,7 @@ forumTopicId: 301189
## Description
<section id='description'>
<code>Off by one errors</code> (sometimes called OBOE) crop up when you're trying to target a specific index of a string or array (to slice or access a segment), or when looping over the indices of them. JavaScript indexing starts at zero, not one, which means the last index is always one less than the length of the item. If you try to access an index equal to the length, the program may throw an "index out of range" reference error or print <code>undefined</code>.
<dfn>Off by one errors</dfn> (sometimes called OBOE) crop up when you're trying to target a specific index of a string or array (to slice or access a segment), or when looping over the indices of them. JavaScript indexing starts at zero, not one, which means the last index is always one less than the length of the item. If you try to access an index equal to the length, the program may throw an "index out of range" reference error or print <code>undefined</code>.
When you use string or array methods that take index ranges as arguments, it helps to read the documentation and understand if they are inclusive (the item at the given index is part of what's returned) or not. Here are some examples of off by one errors:
```js

View File

@@ -11,7 +11,7 @@ If you haven't already figured it out, the issue in the previous challenge was w
This is a small example of a much larger pattern - you call a function on a variable, array, or an object, and the function changes the variable or something in the object.
One of the core principles of functional programming is to not change things. Changes lead to bugs. It's easier to prevent bugs knowing that your functions don't change anything, including the function arguments or any global variable.
The previous example didn't have any complicated operations but the <code>splice</code> method changed the original array, and resulted in a bug.
Recall that in functional programming, changing or altering things is called <code>mutation</code>, and the outcome is called a <code>side effect</code>. A function, ideally, should be a <code>pure function</code>, meaning that it does not cause any side effects.
Recall that in functional programming, changing or altering things is called <dfn>mutation</dfn>, and the outcome is called a <dfn>side effect</dfn>. A function, ideally, should be a <dfn>pure function</dfn>, meaning that it does not cause any side effects.
Let's try to master this discipline and not alter any variable or object in our code.
</section>

View File

@@ -7,7 +7,7 @@ forumTopicId: 301229
## Description
<section id='description'>
<code>Concatenation</code> means to join items end to end. JavaScript offers the <code>concat</code> method for both strings and arrays that work in the same way. For arrays, the method is called on one, then another array is provided as the argument to <code>concat</code>, which is added to the end of the first array. It returns a new array and does not mutate either of the original arrays. Here's an example:
<dfn>Concatenation</dfn> means to join items end to end. JavaScript offers the <code>concat</code> method for both strings and arrays that work in the same way. For arrays, the method is called on one, then another array is provided as the argument to <code>concat</code>, which is added to the end of the first array. It returns a new array and does not mutate either of the original arrays. Here's an example:
```js
[1, 2, 3].concat([4, 5, 6]);

View File

@@ -7,7 +7,7 @@ forumTopicId: 301232
## Description
<section id='description'>
The <code>arity</code> of a function is the number of arguments it requires. <code>Currying</code> a function means to convert a function of N <code>arity</code> into N functions of <code>arity</code> 1.
The <dfn>arity</dfn> of a function is the number of arguments it requires. <dfn>Currying</dfn> a function means to convert a function of N arity into N functions of arity 1.
In other words, it restructures a function so it takes one argument, then returns another function that takes the next argument, and so on.
Here's an example:
@@ -29,7 +29,7 @@ const curried = x => y => x + y
curried(1)(2) // Returns 3
```
This is useful in your program if you can't supply all the arguments to a function at one time. You can save each function call into a variable, which will hold the returned function reference that takes the next argument when it's available. Here's an example using the <code>curried</code> function in the example above:
This is useful in your program if you can't supply all the arguments to a function at one time. You can save each function call into a variable, which will hold the returned function reference that takes the next argument when it's available. Here's an example using the curried function in the example above:
```js
// Call a curried function in parts:
@@ -37,7 +37,7 @@ var funcForY = curried(1);
console.log(funcForY(2)); // Prints 3
```
Similarly, <code>partial application</code> can be described as applying a few arguments to a function at a time and returning another function that is applied to more arguments.
Similarly, <dfn>partial application</dfn> can be described as applying a few arguments to a function at a time and returning another function that is applied to more arguments.
Here's an example:
```js

View File

@@ -10,10 +10,10 @@ forumTopicId: 301240
The FCC Team had a mood swing and now wants two types of tea: green tea and black tea. General Fact: Client mood swings are pretty common.
With that information, we'll need to revisit the <code>getTea</code> function from last challenge to handle various tea requests. We can modify <code>getTea</code> to accept a function as a parameter to be able to change the type of tea it prepares. This makes <code>getTea</code> more flexible, and gives the programmer more control when client requests change.
But first, let's cover some functional terminology:
<code>Callbacks</code> are the functions that are slipped or passed into another function to decide the invocation of that function. You may have seen them passed to other methods, for example in <code>filter</code>, the callback function tells JavaScript the criteria for how to filter an array.
Functions that can be assigned to a variable, passed into another function, or returned from another function just like any other normal value, are called <code>first class</code> functions. In JavaScript, all functions are <code>first class</code> functions.
The functions that take a function as an argument, or return a function as a return value are called <code>higher order</code> functions.
When the functions are passed in to another function or returned from another function, then those functions which gets passed in or returned can be called a <code>lambda</code>.
<dfn>Callbacks</dfn> are the functions that are slipped or passed into another function to decide the invocation of that function. You may have seen them passed to other methods, for example in <code>filter</code>, the callback function tells JavaScript the criteria for how to filter an array.
Functions that can be assigned to a variable, passed into another function, or returned from another function just like any other normal value, are called <dfn>first class</dfn> functions. In JavaScript, all functions are first class functions.
The functions that take a function as an argument, or return a function as a return value are called <dfn>higher order</dfn> functions.
When the functions are passed in to another function or returned from another function, then those functions which gets passed in or returned can be called a <dfn>lambda</dfn>.
</section>
## Instructions

View File

@@ -9,7 +9,7 @@ forumTopicId: 18214
<section id='description'>
So far we have learned to use pure functions to avoid side effects in a program. Also, we have seen the value in having a function only depend on its input arguments.
This is only the beginning. As its name suggests, functional programming is centered around a theory of functions.
It would make sense to be able to pass them as arguments to other functions, and return a function from another function. Functions are considered <code>First Class Objects</code> in JavaScript, which means they can be used like any other object. They can be saved in variables, stored in an object, or passed as function arguments.
It would make sense to be able to pass them as arguments to other functions, and return a function from another function. Functions are considered <dfn>first class objects</dfn> in JavaScript, which means they can be used like any other object. They can be saved in variables, stored in an object, or passed as function arguments.
Let's start with some simple array functions, which are methods on the array object prototype. In this exercise we are looking at <code>Array.prototype.map()</code>, or more simply <code>map</code>.
Remember that the <code>map</code> method is a way to iterate over each item in an array. It creates a new array (without changing the original one) after applying a callback function to every element.
</section>

View File

@@ -8,7 +8,7 @@ forumTopicId: 16003
## Description
<section id='description'>
One of the simplest and most widely known <dfn>ciphers</dfn> is a <code>Caesar cipher</code>, also known as a <code>shift cipher</code>. In a <code>shift cipher</code> the meanings of the letters are shifted by some set amount.
One of the simplest and most widely known <dfn>ciphers</dfn> is a <dfn>Caesar cipher</dfn>, also known as a <dfn>shift cipher</dfn>. In a shift cipher the meanings of the letters are shifted by some set amount.
A common modern use is the <a href="https://en.wikipedia.org/wiki/ROT13" target='_blank'>ROT13</a> cipher, where the values of the letters are shifted by 13 places. Thus 'A' &harr; 'N', 'B' &harr; 'O' and so on.
Write a function which takes a <a href="https://en.wikipedia.org/wiki/ROT13" target='_blank'>ROT13</a> encoded string as input and returns a decoded string.
All letters will be uppercase. Do not transform any non-alphabetic character (i.e. spaces, punctuation), but do pass them on.

View File

@@ -7,7 +7,7 @@ forumTopicId: 301315
## Description
<section id='description'>
A constructor function that inherits its <code>prototype</code> object from a <code>supertype</code> constructor function can still have its own methods in addition to inherited methods.
A constructor function that inherits its <code>prototype</code> object from a supertype constructor function can still have its own methods in addition to inherited methods.
For example, <code>Bird</code> is a constructor that inherits its <code>prototype</code> from <code>Animal</code>:
```js

View File

@@ -7,10 +7,10 @@ forumTopicId: 301317
## Description
<section id='description'>
Think about things people see everyday, like cars, shops, and birds. These are all <code>objects</code>: tangible things people can observe and interact with.
What are some qualities of these <code>objects</code>? A car has wheels. Shops sell items. Birds have wings.
These qualities, or <code>properties</code>, define what makes up an <code>object</code>. Note that similar <code>objects</code> share the same <code>properties</code>, but may have different values for those <code>properties</code>. For example, all cars have wheels, but not all cars have the same number of wheels.
<code>Objects</code> in JavaScript are used to model real-world objects, giving them <code>properties</code> and behavior just like their real-world counterparts. Here's an example using these concepts to create a <code>duck</code> <code>object</code>:
Think about things people see everyday, like cars, shops, and birds. These are all <dfn>objects</dfn>: tangible things people can observe and interact with.
What are some qualities of these objects? A car has wheels. Shops sell items. Birds have wings.
These qualities, or <dfn>properties</dfn>, define what makes up an object. Note that similar objects share the same properties, but may have different values for those properties. For example, all cars have wheels, but not all cars have the same number of wheels.
Objects in JavaScript are used to model real-world objects, giving them properties and behavior just like their real-world counterparts. Here's an example using these concepts to create a <code>duck</code> object:
```js
let duck = {
@@ -19,12 +19,12 @@ let duck = {
};
```
This <code>duck</code> <code>object</code> has two property/value pairs: a <code>name</code> of "Aflac" and a <code>numLegs</code> of 2.
This <code>duck</code> object has two property/value pairs: a <code>name</code> of "Aflac" and a <code>numLegs</code> of 2.
</section>
## Instructions
<section id='instructions'>
Create a <code>dog</code> <code>object</code> with <code>name</code> and <code>numLegs</code> properties, and set them to a string and a number, respectively.
Create a <code>dog</code> object with <code>name</code> and <code>numLegs</code> properties, and set them to a string and a number, respectively.
</section>
## Tests
@@ -32,7 +32,7 @@ Create a <code>dog</code> <code>object</code> with <code>name</code> and <code>n
```yml
tests:
- text: <code>dog</code> should be an <code>object</code>.
- text: <code>dog</code> should be an object.
testString: assert(typeof(dog) === 'object');
- text: <code>dog</code> should have a <code>name</code> property set to a <code>string</code>.
testString: assert(typeof(dog.name) === 'string');

View File

@@ -7,8 +7,8 @@ forumTopicId: 301318
## Description
<section id='description'>
<code>Objects</code> can have a special type of <code>property</code>, called a <code>method</code>.
<code>Methods</code> are <code>properties</code> that are functions. This adds different behavior to an <code>object</code>. Here is the <code>duck</code> example with a method:
Objects can have a special type of property, called a <dfn>method</dfn>.
Methods are properties that are functions. This adds different behavior to an object. Here is the <code>duck</code> example with a method:
```js
let duck = {
@@ -20,13 +20,13 @@ duck.sayName();
// Returns "The name of this duck is Aflac."
```
The example adds the <code>sayName</code> <code>method</code>, which is a function that returns a sentence giving the name of the <code>duck</code>.
Notice that the <code>method</code> accessed the <code>name</code> property in the return statement using <code>duck.name</code>. The next challenge will cover another way to do this.
The example adds the <code>sayName</code> method, which is a function that returns a sentence giving the name of the <code>duck</code>.
Notice that the method accessed the <code>name</code> property in the return statement using <code>duck.name</code>. The next challenge will cover another way to do this.
</section>
## Instructions
<section id='instructions'>
Using the <code>dog</code> <code>object</code>, give it a method called <code>sayLegs</code>. The method should return the sentence "This dog has 4 legs."
Using the <code>dog</code> object, give it a method called <code>sayLegs</code>. The method should return the sentence "This dog has 4 legs."
</section>
## Tests

View File

@@ -7,8 +7,8 @@ forumTopicId: 16804
## Description
<section id='description'>
<code>Constructors</code> are functions that create new objects. They define properties and behaviors that will belong to the new object. Think of them as a blueprint for the creation of new objects.
Here is an example of a <code>constructor</code>:
<dfn>Constructors</dfn> are functions that create new objects. They define properties and behaviors that will belong to the new object. Think of them as a blueprint for the creation of new objects.
Here is an example of a constructor:
```js
function Bird() {
@@ -18,14 +18,14 @@ function Bird() {
}
```
This <code>constructor</code> defines a <code>Bird</code> object with properties <code>name</code>, <code>color</code>, and <code>numLegs</code> set to Albert, blue, and 2, respectively.
<code>Constructors</code> follow a few conventions:
<ul><li><code>Constructors</code> are defined with a capitalized name to distinguish them from other functions that are not <code>constructors</code>.</li><li><code>Constructors</code> use the keyword <code>this</code> to set properties of the object they will create. Inside the <code>constructor</code>, <code>this</code> refers to the new object it will create.</li><li><code>Constructors</code> define properties and behaviors instead of returning a value as other functions might.</li></ul>
This constructor defines a <code>Bird</code> object with properties <code>name</code>, <code>color</code>, and <code>numLegs</code> set to Albert, blue, and 2, respectively.
Constructors follow a few conventions:
<ul><li>Constructors are defined with a capitalized name to distinguish them from other functions that are not <code>constructors</code>.</li><li>Constructors use the keyword <code>this</code> to set properties of the object they will create. Inside the constructor, <code>this</code> refers to the new object it will create.</li><li>Constructors define properties and behaviors instead of returning a value as other functions might.</li></ul>
</section>
## Instructions
<section id='instructions'>
Create a <code>constructor</code>, <code>Dog</code>, with properties <code>name</code>, <code>color</code>, and <code>numLegs</code> that are set to a string, a string, and a number, respectively.
Create a constructor, <code>Dog</code>, with properties <code>name</code>, <code>color</code>, and <code>numLegs</code> that are set to a string, a string, and a number, respectively.
</section>
## Tests

View File

@@ -16,7 +16,7 @@ Animal.prototype.eat = function() {
};
```
This and the next challenge will cover how to reuse <code>Animal's</code> methods inside <code>Bird</code> and <code>Dog</code> without defining them again. It uses a technique called <code>inheritance</code>.
This and the next challenge will cover how to reuse <code>Animal's</code> methods inside <code>Bird</code> and <code>Dog</code> without defining them again. It uses a technique called inheritance.
This challenge covers the first step: make an instance of the <code>supertype</code> (or parent).
You already know one way to create an instance of <code>Animal</code> using the <code>new</code> operator:
@@ -24,7 +24,7 @@ You already know one way to create an instance of <code>Animal</code> using the
let animal = new Animal();
```
There are some disadvantages when using this syntax for <code>inheritance</code>, which are too complex for the scope of this challenge. Instead, here's an alternative approach without those disadvantages:
There are some disadvantages when using this syntax for inheritance, which are too complex for the scope of this challenge. Instead, here's an alternative approach without those disadvantages:
```js
let animal = Object.create(Animal.prototype);

View File

@@ -7,7 +7,7 @@ forumTopicId: 301321
## Description
<section id='description'>
The last challenge introduced a <code>method</code> to the <code>duck</code> object. It used <code>duck.name</code> dot notation to access the value for the <code>name</code> property within the return statement:
The last challenge introduced a method to the <code>duck</code> object. It used <code>duck.name</code> dot notation to access the value for the <code>name</code> property within the return statement:
<code>sayName: function() {return "The name of this duck is " + duck.name + ".";}</code>
While this is a valid way to access the object's property, there is a pitfall here. If the variable name changes, any code referencing the original name would need to be updated as well. In a short object definition, it isn't a problem, but if an object has many references to its properties there is a greater chance for error.
A way to avoid these issues is with the <code>this</code> keyword:

View File

@@ -7,7 +7,7 @@ forumTopicId: 301324
## Description
<section id='description'>
When an object inherits its <code>prototype</code> from another object, it also inherits the <code>supertype</code>'s constructor property.
When an object inherits its <code>prototype</code> from another object, it also inherits the supertype's constructor property.
Here's an example:
```js

View File

@@ -7,8 +7,8 @@ forumTopicId: 301325
## Description
<section id='description'>
In the previous challenge you saw the first step for inheriting behavior from the <code>supertype</code> (or parent) <code>Animal</code>: making a new instance of <code>Animal</code>.
This challenge covers the next step: set the <code>prototype</code> of the <code>subtype</code> (or child)&mdash;in this case, <code>Bird</code>&mdash;to be an instance of <code>Animal</code>.
In the previous challenge you saw the first step for inheriting behavior from the supertype (or parent) <code>Animal</code>: making a new instance of <code>Animal</code>.
This challenge covers the next step: set the <code>prototype</code> of the subtype (or child)&mdash;in this case, <code>Bird</code>&mdash;to be an instance of <code>Animal</code>.
```js
Bird.prototype = Object.create(Animal.prototype);

View File

@@ -16,12 +16,12 @@ A common pattern in JavaScript is to execute a function as soon as it is declare
// Outputs "Chirp, chirp!" immediately
```
Note that the function has no name and is not stored in a variable. The two parentheses () at the end of the function expression cause it to be immediately executed or invoked. This pattern is known as an <code>immediately invoked function expression</code> or <code>IIFE</code>.
Note that the function has no name and is not stored in a variable. The two parentheses () at the end of the function expression cause it to be immediately executed or invoked. This pattern is known as an <dfn>immediately invoked function expression</dfn> or <dfn>IIFE</dfn>.
</section>
## Instructions
<section id='instructions'>
Rewrite the function <code>makeNest</code> and remove its call so instead it's an anonymous <code>immediately invoked function expression</code> (<code>IIFE</code>).
Rewrite the function <code>makeNest</code> and remove its call so instead it's an anonymous immediately invoked function expression (IIFE).
</section>
## Tests

View File

@@ -20,7 +20,7 @@ function Bird() {
let blueBird = new Bird();
```
Notice that the <code>new</code> operator is used when calling a constructor. This tells JavaScript to create a new <code>instance</code> of <code>Bird</code> called <code>blueBird</code>. Without the <code>new</code> operator, <code>this</code> inside the constructor would not point to the newly created object, giving unexpected results.
Notice that the <code>new</code> operator is used when calling a constructor. This tells JavaScript to create a new instance of <code>Bird</code> called <code>blueBird</code>. Without the <code>new</code> operator, <code>this</code> inside the constructor would not point to the newly created object, giving unexpected results.
Now <code>blueBird</code> has all the properties defined inside the <code>Bird</code> constructor:
```js
@@ -50,7 +50,7 @@ Use the <code>Dog</code> constructor from the last lesson to create a new instan
tests:
- text: <code>hound</code> should be created using the <code>Dog</code> constructor.
testString: assert(hound instanceof Dog);
- text: Your code should use the <code>new</code> operator to create an <code>instance</code> of <code>Dog</code>.
- text: Your code should use the <code>new</code> operator to create an instance of <code>Dog</code>.
testString: assert(code.match(/new/g));
```

View File

@@ -8,7 +8,7 @@ forumTopicId: 301331
## Description
<section id='description'>
As you have seen, behavior is shared through inheritance. However, there are cases when inheritance is not the best solution. Inheritance does not work well for unrelated objects like <code>Bird</code> and <code>Airplane</code>. They can both fly, but a <code>Bird</code> is not a type of <code>Airplane</code> and vice versa.
For unrelated objects, it's better to use <code>mixins</code>. A <code>mixin</code> allows other objects to use a collection of functions.
For unrelated objects, it's better to use <dfn>mixins</dfn>. A mixin allows other objects to use a collection of functions.
```js
let flyMixin = function(obj) {
@@ -42,12 +42,12 @@ bird.fly(); // prints "Flying, wooosh!"
plane.fly(); // prints "Flying, wooosh!"
```
Note how the <code>mixin</code> allows for the same <code>fly</code> method to be reused by unrelated objects <code>bird</code> and <code>plane</code>.
Note how the mixin allows for the same <code>fly</code> method to be reused by unrelated objects <code>bird</code> and <code>plane</code>.
</section>
## Instructions
<section id='instructions'>
Create a <code>mixin</code> named <code>glideMixin</code> that defines a method named <code>glide</code>. Then use the <code>glideMixin</code> to give both <code>bird</code> and <code>boat</code> the ability to glide.
Create a mixin named <code>glideMixin</code> that defines a method named <code>glide</code>. Then use the <code>glideMixin</code> to give both <code>bird</code> and <code>boat</code> the ability to glide.
</section>
## Tests

View File

@@ -7,7 +7,7 @@ forumTopicId: 301332
## Description
<section id='description'>
An <code>immediately invoked function expression</code> (<code>IIFE</code>) is often used to group related functionality into a single object or <code>module</code>. For example, an earlier challenge defined two mixins:
An immediately invoked function expression (IIFE) is often used to group related functionality into a single object or <dfn>module</dfn>. For example, an earlier challenge defined two mixins:
```js
function glideMixin(obj) {
@@ -22,7 +22,7 @@ function flyMixin(obj) {
}
```
We can group these <code>mixins</code> into a module as follows:
We can group these mixins into a module as follows:
```js
let motionModule = (function () {
@@ -41,8 +41,8 @@ let motionModule = (function () {
})(); // The two parentheses cause the function to be immediately invoked
```
Note that you have an <code>immediately invoked function expression</code> (<code>IIFE</code>) that returns an object <code>motionModule</code>. This returned object contains all of the <code>mixin</code> behaviors as properties of the object.
The advantage of the <code>module</code> pattern is that all of the motion behaviors can be packaged into a single object that can then be used by other parts of your code. Here is an example using it:
Note that you have an immediately invoked function expression (IIFE) that returns an object <code>motionModule</code>. This returned object contains all of the mixin behaviors as properties of the object.
The advantage of the module pattern is that all of the motion behaviors can be packaged into a single object that can then be used by other parts of your code. Here is an example using it:
```js
motionModule.glideMixin(duck);
@@ -53,7 +53,7 @@ duck.glide();
## Instructions
<section id='instructions'>
Create a <code>module</code> named <code>funModule</code> to wrap the two <code>mixins</code> <code>isCuteMixin</code> and <code>singMixin</code>. <code>funModule</code> should return an object.
Create a module named <code>funModule</code> to wrap the two mixins <code>isCuteMixin</code> and <code>singMixin</code>. <code>funModule</code> should return an object.
</section>
## Tests

View File

@@ -7,7 +7,7 @@ forumTopicId: 301333
## Description
<section id='description'>
The last challenge created an <code>object</code> with various <code>properties</code>, now you'll see how to access the values of those <code>properties</code>. Here's an example:
The last challenge created an object with various properties, now you'll see how to access the values of those properties. Here's an example:
```js
let duck = {
@@ -18,12 +18,12 @@ console.log(duck.name);
// This prints "Aflac" to the console
```
Dot notation is used on the <code>object</code> name, <code>duck</code>, followed by the name of the <code>property</code>, <code>name</code>, to access the value of "Aflac".
Dot notation is used on the object name, <code>duck</code>, followed by the name of the property, <code>name</code>, to access the value of "Aflac".
</section>
## Instructions
<section id='instructions'>
Print both <code>properties</code> of the <code>dog</code> object to your console.
Print both properties of the <code>dog</code> object to your console.
</section>
## Tests

View File

@@ -7,7 +7,7 @@ forumTopicId: 301334
## Description
<section id='description'>
There's a principle in programming called <code>Don't Repeat Yourself (DRY)</code>. The reason repeated code is a problem is because any change requires fixing code in multiple places. This usually means more work for programmers and more room for errors.
There's a principle in programming called <dfn>Don't Repeat Yourself (DRY)</dfn>. The reason repeated code is a problem is because any change requires fixing code in multiple places. This usually means more work for programmers and more room for errors.
Notice in the example below that the <code>describe</code> method is shared by <code>Bird</code> and <code>Dog</code>:
```js
@@ -26,7 +26,7 @@ Dog.prototype = {
};
```
The <code>describe</code> method is repeated in two places. The code can be edited to follow the <code>DRY</code> principle by creating a <code>supertype</code> (or parent) called <code>Animal</code>:
The <code>describe</code> method is repeated in two places. The code can be edited to follow the DRY principle by creating a <code>supertype</code> (or parent) called <code>Animal</code>:
```js
function Animal() { };
@@ -55,7 +55,7 @@ Dog.prototype = {
## Instructions
<section id='instructions'>
The <code>eat</code> method is repeated in both <code>Cat</code> and <code>Bear</code>. Edit the code in the spirit of <code>DRY</code> by moving the <code>eat</code> method to the <code>Animal</code> <code>supertype</code>.
The <code>eat</code> method is repeated in both <code>Cat</code> and <code>Bear</code>. Edit the code in the spirit of DRY by moving the <code>eat</code> method to the <code>Animal</code> <code>supertype</code>.
</section>
## Tests

View File

@@ -7,7 +7,7 @@ forumTopicId: 301337
## Description
<section id='description'>
Anytime a constructor function creates a new object, that object is said to be an <code>instance</code> of its constructor. JavaScript gives a convenient way to verify this with the <code>instanceof</code> operator. <code>instanceof</code> allows you to compare an object to a constructor, returning <code>true</code> or <code>false</code> based on whether or not that object was created with the constructor. Here's an example:
Anytime a constructor function creates a new object, that object is said to be an <dfn>instance</dfn> of its constructor. JavaScript gives a convenient way to verify this with the <code>instanceof</code> operator. <code>instanceof</code> allows you to compare an object to a constructor, returning <code>true</code> or <code>false</code> based on whether or not that object was created with the constructor. Here's an example:
```js
let Bird = function(name, color) {

View File

@@ -7,10 +7,10 @@ forumTopicId: 301341
## Description
<section id='description'>
In regular expressions, a <code>greedy</code> match finds the longest possible part of a string that fits the regex pattern and returns it as a match. The alternative is called a <code>lazy</code> match, which finds the smallest possible part of the string that satisfies the regex pattern.
In regular expressions, a <dfn>greedy</dfn> match finds the longest possible part of a string that fits the regex pattern and returns it as a match. The alternative is called a <dfn>lazy</dfn> match, which finds the smallest possible part of the string that satisfies the regex pattern.
You can apply the regex <code>/t[a-z]*i/</code> to the string <code>"titanic"</code>. This regex is basically a pattern that starts with <code>t</code>, ends with <code>i</code>, and has some letters in between.
Regular expressions are by default <code>greedy</code>, so the match would return <code>["titani"]</code>. It finds the largest sub-string possible to fit the pattern.
However, you can use the <code>?</code> character to change it to <code>lazy</code> matching. <code>"titanic"</code> matched against the adjusted regex of <code>/t[a-z]*?i/</code> returns <code>["ti"]</code>.
Regular expressions are by default greedy, so the match would return <code>["titani"]</code>. It finds the largest sub-string possible to fit the pattern.
However, you can use the <code>?</code> character to change it to lazy matching. <code>"titanic"</code> matched against the adjusted regex of <code>/t[a-z]*?i/</code> returns <code>["ti"]</code>.
<strong>Note</strong><br>Parsing HTML with regular expressions should be avoided, but pattern matching an HTML string with regular expressions is completely fine.
</section>

View File

@@ -31,7 +31,7 @@ But it does not find matches in the following strings since there are no letter
## Instructions
<section id='instructions'>
Write a <code>greedy</code> regex that finds one or more criminals within a group of other people. A criminal is represented by the capital letter <code>C</code>.
Write a greedy regex that finds one or more criminals within a group of other people. A criminal is represented by the capital letter <code>C</code>.
</section>
## Tests
@@ -39,19 +39,19 @@ Write a <code>greedy</code> regex that finds one or more criminals within a grou
```yml
tests:
- text: Your regex should match <code>one</code> criminal (<code>C</code>) in <code>"C"</code>
- text: Your regex should match one criminal (<code>C</code>) in <code>"C"</code>
testString: assert('C'.match(reCriminals) && 'C'.match(reCriminals)[0] == 'C');
- text: Your regex should match <code>two</code> criminals (<code>CC</code>) in <code>"CC"</code>
- text: Your regex should match two criminals (<code>CC</code>) in <code>"CC"</code>
testString: assert('CC'.match(reCriminals) && 'CC'.match(reCriminals)[0] == 'CC');
- text: Your regex should match <code>three</code> criminals (<code>CCC</code>) in <code>"P1P5P4CCCP2P6P3"</code>
- text: Your regex should match three criminals (<code>CCC</code>) in <code>"P1P5P4CCCP2P6P3"</code>
testString: assert('P1P5P4CCCP2P6P3'.match(reCriminals) && 'P1P5P4CCCP2P6P3'.match(reCriminals)[0] == 'CCC');
- text: Your regex should match <code>five</code> criminals (<code>CCCCC</code>) in <code>"P6P2P7P4P5CCCCCP3P1"</code>
- text: Your regex should match five criminals (<code>CCCCC</code>) in <code>"P6P2P7P4P5CCCCCP3P1"</code>
testString: assert('P6P2P7P4P5CCCCCP3P1'.match(reCriminals) && 'P6P2P7P4P5CCCCCP3P1'.match(reCriminals)[0] == 'CCCCC');
- text: Your regex should not match any criminals in <code>""</code>
testString: assert(!reCriminals.test(''));
- text: Your regex should not match any criminals in <code>"P1P2P3"</code>
testString: assert(!reCriminals.test('P1P2P3'));
- text: Your regex should match <code>fifty</code> criminals (<code>CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCC</code>) in <code>"P2P1P5P4CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCP3"</code>.
- text: Your regex should match fifty criminals (<code>CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCC</code>) in <code>"P2P1P5P4CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCP3"</code>.
testString: assert('P2P1P5P4CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCP3'.match(reCriminals) && 'P2P1P5P4CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCP3'.match(reCriminals)[0] == "CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCC");
```

View File

@@ -21,7 +21,7 @@ longHand.test(varNames); // Returns true
shortHand.test(varNames); // Returns true
```
These shortcut character classes are also known as <code>shorthand character classes</code>.
These shortcut character classes are also known as <dfn>shorthand character classes</dfn>.
</section>
## Instructions

View File

@@ -8,7 +8,7 @@ forumTopicId: 301349
## Description
<section id='description'>
Prior challenges showed that regular expressions can be used to look for a number of matches. They are also used to search for patterns in specific positions in strings.
In an earlier challenge, you used the <code>caret</code> character (<code>^</code>) inside a <code>character set</code> to create a <code>negated character set</code> in the form <code>[^thingsThatWillNotBeMatched]</code>. Outside of a <code>character set</code>, the <code>caret</code> is used to search for patterns at the beginning of strings.
In an earlier challenge, you used the caret character (<code>^</code>) inside a character set to create a negated character set in the form <code>[^thingsThatWillNotBeMatched]</code>. Outside of a character set, the caret is used to search for patterns at the beginning of strings.
```js
let firstString = "Ricky is first and can be found.";
@@ -24,7 +24,7 @@ firstRegex.test(notFirst);
## Instructions
<section id='instructions'>
Use the <code>caret</code> character in a regex to find <code>"Cal"</code> only in the beginning of the string <code>rickyAndCal</code>.
Use the caret character in a regex to find <code>"Cal"</code> only in the beginning of the string <code>rickyAndCal</code>.
</section>
## Tests

View File

@@ -8,7 +8,7 @@ forumTopicId: 301351
## Description
<section id='description'>
The last challenge used the plus <code>+</code> sign to look for characters that occur one or more times. There's also an option that matches characters that occur zero or more times.
The character to do this is the <code>asterisk</code> or <code>star</code>: <code>*</code>.
The character to do this is the asterisk or star: <code>*</code>.
```js
let soccerWord = "gooooooooal!";

View File

@@ -7,8 +7,8 @@ forumTopicId: 301352
## Description
<section id='description'>
In the last challenge, you learned to use the <code>caret</code> character to search for patterns at the beginning of strings. There is also a way to search for patterns at the end of strings.
You can search the end of strings using the <code>dollar sign</code> character <code>$</code> at the end of the regex.
In the last challenge, you learned to use the caret character to search for patterns at the beginning of strings. There is also a way to search for patterns at the end of strings.
You can search the end of strings using the dollar sign character <code>$</code> at the end of the regex.
```js
let theEnding = "This is a never ending story";

View File

@@ -7,8 +7,8 @@ forumTopicId: 301354
## Description
<section id='description'>
You saw how you can use <code>character sets</code> to specify a group of characters to match, but that's a lot of typing when you need to match a large range of characters (for example, every letter in the alphabet). Fortunately, there is a built-in feature that makes this short and simple.
Inside a <code>character set</code>, you can define a range of characters to match using a <code>hyphen</code> character: <code>-</code>.
You saw how you can use <dfn>character sets</dfn> to specify a group of characters to match, but that's a lot of typing when you need to match a large range of characters (for example, every letter in the alphabet). Fortunately, there is a built-in feature that makes this short and simple.
Inside a character set, you can define a range of characters to match using a hyphen character: <code>-</code>.
For example, to match lowercase letters <code>a</code> through <code>e</code> you would use <code>[a-e]</code>.
```js

View File

@@ -8,7 +8,7 @@ forumTopicId: 301357
## Description
<section id='description'>
You learned how to match literal patterns (<code>/literal/</code>) and wildcard character (<code>/./</code>). Those are the extremes of regular expressions, where one finds exact matches and the other matches everything. There are options that are a balance between the two extremes.
You can search for a literal pattern with some flexibility with <code>character classes</code>. Character classes allow you to define a group of characters you wish to match by placing them inside square (<code>[</code> and <code>]</code>) brackets.
You can search for a literal pattern with some flexibility with <dfn>character classes</dfn>. Character classes allow you to define a group of characters you wish to match by placing them inside square (<code>[</code> and <code>]</code>) brackets.
For example, you want to match <code>"bag"</code>, <code>"big"</code>, and <code>"bug"</code> but not <code>"bog"</code>. You can create the regex <code>/b[aiu]g/</code> to do this. The <code>[aiu]</code> is the character class that will only match the characters <code>"a"</code>, <code>"i"</code>, or <code>"u"</code>.
```js

View File

@@ -7,8 +7,8 @@ forumTopicId: 301358
## Description
<section id='description'>
So far, you have created a set of characters that you want to match, but you could also create a set of characters that you do not want to match. These types of character sets are called <code>negated character sets</code>.
To create a <code>negated character set</code>, you place a <code>caret</code> character (<code>^</code>) after the opening bracket and before the characters you do not want to match.
So far, you have created a set of characters that you want to match, but you could also create a set of characters that you do not want to match. These types of character sets are called <dfn>negated character sets</dfn>.
To create a negated character set, you place a caret character (<code>^</code>) after the opening bracket and before the characters you do not want to match.
For example, <code>/[^aeiou]/gi</code> matches all characters that are not a vowel. Note that characters like <code>.</code>, <code>!</code>, <code>[</code>, <code>@</code>, <code>/</code> and white space are matched - the negated vowel character set only excludes the vowel characters.
</section>

View File

@@ -7,10 +7,10 @@ forumTopicId: 301360
## Description
<section id='description'>
<code>Lookaheads</code> are patterns that tell JavaScript to look-ahead in your string to check for patterns further along. This can be useful when you want to search for multiple patterns over the same string.
There are two kinds of <code>lookaheads</code>: <code>positive lookahead</code> and <code>negative lookahead</code>.
A <code>positive lookahead</code> will look to make sure the element in the search pattern is there, but won't actually match it. A positive lookahead is used as <code>(?=...)</code> where the <code>...</code> is the required part that is not matched.
On the other hand, a <code>negative lookahead</code> will look to make sure the element in the search pattern is not there. A negative lookahead is used as <code>(?!...)</code> where the <code>...</code> is the pattern that you do not want to be there. The rest of the pattern is returned if the negative lookahead part is not present.
<dfn>Lookaheads</dfn> are patterns that tell JavaScript to look-ahead in your string to check for patterns further along. This can be useful when you want to search for multiple patterns over the same string.
There are two kinds of lookaheads: <dfn>positive lookahead</dfn> and <dfn>negative lookahead</dfn>.
A positive lookahead will look to make sure the element in the search pattern is there, but won't actually match it. A positive lookahead is used as <code>(?=...)</code> where the <code>...</code> is the required part that is not matched.
On the other hand, a negative lookahead will look to make sure the element in the search pattern is not there. A negative lookahead is used as <code>(?!...)</code> where the <code>...</code> is the pattern that you do not want to be there. The rest of the pattern is returned if the negative lookahead part is not present.
Lookaheads are a bit confusing but some examples will help.
```js
@@ -22,7 +22,7 @@ quit.match(quRegex); // Returns ["q"]
noquit.match(qRegex); // Returns ["q"]
```
A more practical use of <code>lookaheads</code> is to check two or more patterns in one string. Here is a (naively) simple password checker that looks for between 3 and 6 characters and at least one number:
A more practical use of lookaheads is to check two or more patterns in one string. Here is a (naively) simple password checker that looks for between 3 and 6 characters and at least one number:
```js
let password = "abc123";
@@ -34,7 +34,7 @@ checkPass.test(password); // Returns true
## Instructions
<section id='instructions'>
Use <code>lookaheads</code> in the <code>pwRegex</code> to match passwords that are greater than 5 characters long, do not begin with numbers, and have two consecutive digits.
Use lookaheads in the <code>pwRegex</code> to match passwords that are greater than 5 characters long, do not begin with numbers, and have two consecutive digits.
</section>
## Tests

View File

@@ -8,7 +8,7 @@ forumTopicId: 301364
## Description
<section id='description'>
Some patterns you search for will occur multiple times in a string. It is wasteful to manually repeat that regex. There is a better way to specify when you have multiple repeat substrings in your string.
You can search for repeat substrings using <code>capture groups</code>. Parentheses, <code>(</code> and <code>)</code>, are used to find repeat substrings. You put the regex of the pattern that will repeat in between the parentheses.
You can search for repeat substrings using <dfn>capture groups</dfn>. Parentheses, <code>(</code> and <code>)</code>, are used to find repeat substrings. You put the regex of the pattern that will repeat in between the parentheses.
To specify where that repeat string will appear, you use a backslash (<code>\</code>) and then a number. This number starts at 1 and increases with each additional capture group you use. An example would be <code>\1</code> to match the first group.
The example below matches any word that occurs twice separated by a space:
@@ -24,7 +24,7 @@ Using the <code>.match()</code> method on a string will return an array with the
## Instructions
<section id='instructions'>
Use <code>capture groups</code> in <code>reRegex</code> to match numbers that are repeated only three times in a string, each separated by a space.
Use capture groups in <code>reRegex</code> to match numbers that are repeated only three times in a string, each separated by a space.
</section>
## Tests

View File

@@ -7,7 +7,7 @@ forumTopicId: 301365
## Description
<section id='description'>
You can specify the lower and upper number of patterns with <code>quantity specifiers</code> using curly brackets. Sometimes you only want a specific number of matches.
You can specify the lower and upper number of patterns with quantity specifiers using curly brackets. Sometimes you only want a specific number of matches.
To specify a certain number of patterns, just have that one number between the curly brackets.
For example, to match only the word <code>"hah"</code> with the letter <code>a</code> <code>3</code> times, your regex would be <code>/ha{3}h/</code>.

View File

@@ -7,7 +7,7 @@ forumTopicId: 301366
## Description
<section id='description'>
You can specify the lower and upper number of patterns with <code>quantity specifiers</code> using curly brackets. Sometimes you only want to specify the lower number of patterns with no upper limit.
You can specify the lower and upper number of patterns with quantity specifiers using curly brackets. Sometimes you only want to specify the lower number of patterns with no upper limit.
To only specify the lower number of patterns, keep the first number followed by a comma.
For example, to match only the string <code>"hah"</code> with the letter <code>a</code> appearing at least <code>3</code> times, your regex would be <code>/ha{3,}h/</code>.

View File

@@ -8,7 +8,7 @@ forumTopicId: 301367
## Description
<section id='description'>
Recall that you use the plus sign <code>+</code> to look for one or more characters and the asterisk <code>*</code> to look for zero or more characters. These are convenient but sometimes you want to match a certain range of patterns.
You can specify the lower and upper number of patterns with <code>quantity specifiers</code>. Quantity specifiers are used with curly brackets (<code>{</code> and <code>}</code>). You put two numbers between the curly brackets - for the lower and upper number of patterns.
You can specify the lower and upper number of patterns with <dfn>quantity specifiers</dfn>. Quantity specifiers are used with curly brackets (<code>{</code> and <code>}</code>). You put two numbers between the curly brackets - for the lower and upper number of patterns.
For example, to match only the letter <code>a</code> appearing between <code>3</code> and <code>5</code> times in the string <code>"ah"</code>, your regex would be <code>/a{3,5}h/</code>.
```js