chore(curriculum): add quotes to strings building a spreadsheet (#56052)

Co-authored-by: Krzysztof G. <60067306+gikf@users.noreply.github.com>
2026-05-28 18:26:54 +00:00 · 2024-09-11 05:34:27 -04:00
parent cc7a177f2a
commit 8e9559337f
8 changed files with 15 additions and 15 deletions
@@ -12,7 +12,7 @@ Your project starts with a basic HTML container and some corresponding CSS. Your

 The global `window` object represents the browser window (or tab). It has an `onload` property which allows you to define behavior when the window has loaded the entire page, including stylesheets and scripts.

-Start by setting the `onload` property of `window` to an arrow function with no parameters. In the function, declare a `container` variable and assign it the value of getting the element by the `id` of `container`.
+Start by setting the `onload` property of `window` to an arrow function with no parameters. In the function, declare a `container` variable and assign it the value of getting the element by the `id` of `"container"`.

 # --hints--

@@ -58,7 +58,7 @@ You should use `document.getElementById()`
 assert.match(code, /document\.getElementById\(/);
 ```

-You should get the element with the `id` of `container`.
+You should get the element with the `id` of `"container"`.

 ```js
 assert.match(code, /document\.getElementById\(\s*('|"|`)container\1\s*\)/);
@@ -31,7 +31,7 @@ You should use the `.createElement()` method of the `document` object.
 assert.match(code, /document\.createElement\(/);
 ```

-You should pass the string `div` to the `.createElement()` method.
+You should pass the string `"div"` to the `.createElement()` method.

 ```js
 assert.match(code, /document\.createElement\(\s*('|"|`)div\1\s*\)/);
@@ -7,7 +7,7 @@ dashedName: step-4

 # --description--

-Set the `className` of the `label` element to `label`, and set the `textContent` to the `name` parameter.
+Set the `className` of the `label` element to `"label"`, and set the `textContent` to the `name` parameter.

 # --hints--

@@ -17,7 +17,7 @@ You should access the `className` property of the `label` element.
 assert.match(code, /label\.className/);
 ```

-You should set the `className` property to the string `label`.
+You should set the `className` property to the string `"label"`.

 ```js
 assert.match(code, /label\.className\s*=\s*('|"|`)label\1/);
@@ -7,7 +7,7 @@ dashedName: step-13

 # --description--

-Now that your helper functions are complete, back in your `onload` event handler you should declare a `letters` variable. Assign it the result of calling `charRange()` with the letters `A` and `J` as arguments.
+Now that your helper functions are complete, back in your `onload` event handler you should declare a `letters` variable. Assign it the result of calling `charRange()` with the letters `"A"` and `"J"` as arguments.

 # --hints--

@@ -29,13 +29,13 @@ You should assign a `charRange()` call to your `letters` variable.
 assert.match(code, /const\s+letters\s*=\s*charRange\(/);
 ```

-You should pass `A` as the first argument to your `charRange()` call.
+You should pass `"A"` as the first argument to your `charRange()` call.

 ```js
 assert.match(code, /const\s+letters\s*=\s*charRange\(\s*('|"|`)A\1/);
 ```

-You should pass `J` as the second argument to your `charRange()` call.
+You should pass `"J"` as the second argument to your `charRange()` call.

 ```js
 assert.match(code, /const\s+letters\s*=\s*charRange\(\s*('|"|`)A\1\s*,\s*('|"|`)J\2\s*\)/)
@@ -7,7 +7,7 @@ dashedName: step-17

 # --description--

-Now in your nested `.forEach()` call, declare an `input` variable. Use the `.createElement()` method of the `document` object to create an `input` element. Set the `type` attribute to `text` and the `id` attribute to `letter + number`.
+Now in your nested `.forEach()` call, declare an `input` variable. Use the `.createElement()` method of the `document` object to create an `input` element. Set the `type` attribute to `"text"` and the `id` attribute to `letter + number`.

 # --hints--

@@ -29,7 +29,7 @@ You should call the `.createElement()` method of the `document` object.
 assert.lengthOf(code.match(/document\.createElement\(/g), 2)
 ```

-You should pass the string `input` to the `.createElement()` method.
+You should pass the string `"input"` to the `.createElement()` method.

 ```js
 assert.match(code, /document\.createElement\(\s*('|"|`)input\1\s*\)/)
@@ -47,7 +47,7 @@ You should access the `type` property of your `input` element.
 assert.match(code, /input\.type/);
 ```

-You should set the `type` attribute of your `input` element to `text`.
+You should set the `type` attribute of your `input` element to `"text"`.

 ```js
 assert.match(code, /input\.type\s*=\s*('|"|`)text\1/)
@@ -9,11 +9,11 @@ dashedName: step-32

 Spreadsheet software typically uses `=` at the beginning of a cell to indicate a calculation should be used, and spreadsheet functions should be evaluated.

-Use the `&&` operator to add a second condition to your `if` statement that also checks if the first character of `value` is `=`.
+Use the `&&` operator to add a second condition to your `if` statement that also checks if the first character of `value` is `"="`.

 # --hints--

-You should use the `&&` operator to add a second condition to your `if` statement that also checks if the first character of `value` is `=`. You may use `[0]`, `.startsWith()`, or `.charAt(0)`.
+You should use the `&&` operator to add a second condition to your `if` statement that also checks if the first character of `value` is `"="`. You may use `[0]`, `.startsWith()`, or `.charAt(0)`.

 ```js
 assert.match(code, /const\s+update\s*=\s*(?:\(\s*event\s*\)|event)\s*=>\s*\{\s*const\s+element\s*=\s*event\.target\s*;?\s*const\s+value\s*=\s*element\.value\.replace\(\s*\/\\s\/g\s*,\s*('|"|`)\1\s*\)\s*;?\s*if\s*\(\s*(!value\.includes\(\s*element\.id\s*\)\s*&&\s*(?:value\s*\[\s*0\s*\]\s*===\s*('|"|`)=\3|value\.charAt\(\s*0\s*\)\s*===\s*('|"|`)=\4|value\.startsWith\(\s*('|"|`)=\5\s*\))|(?:value\s*\[\s*0\s*\]\s*===\s*('|"|`)=\6|value\.charAt\(\s*0\s*\)\s*===\s*('|"|`)=\7|value\.startsWith\(\s*('|"|`)=\8\s*\))\s*\|\|\s*!value\.includes\(\s*element\.id\s*\))\s*\)\s*\{\s*\}/);
@@ -16,7 +16,7 @@ const innerOne = elemValue(1);
 const final = innerOne("A");
 ```

-`innerOne` would be your `inner` function, with `num` set to `1`, and `final` would have the value of the cell with the `id` of `A1`. This is possible because functions have access to all variables declared at their creation. This is called <dfn>closure</dfn>.
+`innerOne` would be your `inner` function, with `num` set to `1`, and `final` would have the value of the cell with the `id` of `"A1"`. This is possible because functions have access to all variables declared at their creation. This is called <dfn>closure</dfn>.

 You'll get some more practice with this. Declare a function called `addCharacters` which takes a `character1` parameter.

@@ -47,7 +47,7 @@ Your `toNumberList` function should return the result of calling the `.split()`
 assert.match(code, /const\s+applyFunction\s*=\s*(\(\s*str\s*\)|str)\s*=>\s*\{\s*const\s+noHigh\s*=\s*highPrecedence\(\s*str\s*\)\s*;?\s*const\s+infix\s*=\s*\/\(\[(?:\\d\.|\.\\d)\]\+\)\(\[(?:\+-|-\+)\]\)\(\[(?:\\d\.|\.\\d)\]\+\)\/\s*;?\s*const\s+str2\s*=\s*infixEval\(\s*noHigh\s*,\s*infix\s*\)\s*;?\s*const\s+functionCall\s*=\s*\/\(\[a-z0-9\]\*\)\\\(\(\[0-9\., \]\*\)\\\)\(\?!\.\*\\\(\)\/i\s*;?\s*const\s+toNumberList\s*=\s*(\(\s*args\s*\)|args)\s*=>\s*args\.split\(/);
 ```

-You should split `args` on the `,` character.
+You should split `args` on the `","` character.

 ```js
 assert.match(code, /const\s+applyFunction\s*=\s*(?:\(\s*str\s*\)|str)\s*=>\s*\{\s*const\s+noHigh\s*=\s*highPrecedence\(\s*str\s*\)\s*;?\s*const\s+infix\s*=\s*\/\(\[(?:\\d\.|\.\\d)\]\+\)\(\[(?:\+-|-\+)\]\)\(\[(?:\\d\.|\.\\d)\]\+\)\/\s*;?\s*const\s+str2\s*=\s*infixEval\(\s*noHigh\s*,\s*infix\s*\)\s*;?\s*const\s+functionCall\s*=\s*\/\(\[a-z0-9\]\*\)\\\(\(\[0-9\., \]\*\)\\\)\(\?!\.\*\\\(\)\/i\s*;?\s*const\s+toNumberList\s*=\s*(?:\(\s*args\s*\)|args)\s*=>\s*args\.split\(\s*('|"|`),\1\s*\)/);