mirror of
https://github.com/freeCodeCamp/freeCodeCamp.git
synced 2026-05-28 18:26:54 +00:00
chore(i18n,learn): processed translations (#51351)
This commit is contained in:
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-32
|
||||
|
||||
# --description--
|
||||
|
||||
لاحظ أنه لإنشاء البرتقالي كان عليك زيادة كثافة اللون الأحمر وتقليل كثافة قيم `rgb` الخضراء. وذلك لأن البرتقالي هو مزيج من اللون الأحمر والأصفر، ويسقط بين اللونين على عجلة الألوان.
|
||||
لاحظ أنه لإنشاء البرتقالي كان عليك زيادة كثافة اللون الأحمر وتقليل كثافة قيم `rgb` الخضراء. This is because orange is the combination of red and yellow.
|
||||
|
||||
لإنشاء ربيع اللون الثالث أخضر، الجمع بين السيان والأخضر. قم بتحديث وظيفة `rgb` في قاعدة CSS مسمى `.two` بحيث تكون قيمة اللون الأخضر بالحد الأقصى، وقيمة اللون الأزرق `127`.
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-32
|
||||
|
||||
# --description--
|
||||
|
||||
注意,要創建橙色,你需要增加紅色的強度,並降低綠色 `rgb` 值的強度。 這是因爲橙色是紅色和黃色的結合,再色輪上處於兩種顏色之間。
|
||||
注意,要創建橙色,你需要增加紅色的強度,並降低綠色 `rgb` 值的強度。 This is because orange is the combination of red and yellow.
|
||||
|
||||
要創建複色亮綠色,需要組合青色和綠色。 更新 `.two` CSS 規則中的 `rgb` 函數,使綠色是最大值,藍色的值是 `127`。
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-32
|
||||
|
||||
# --description--
|
||||
|
||||
注意,要创建橙色,你需要增加红色的强度,并降低绿色 `rgb` 值的强度。 这是因为橙色是红色和黄色的结合,再色轮上处于两种颜色之间。
|
||||
注意,要创建橙色,你需要增加红色的强度,并降低绿色 `rgb` 值的强度。 This is because orange is the combination of red and yellow.
|
||||
|
||||
要创建复色亮绿色,需要组合青色和绿色。 更新 `.two` CSS 规则中的 `rgb` 函数,使绿色是最大值,蓝色的值是 `127`。
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-32
|
||||
|
||||
# --description--
|
||||
|
||||
Ten en cuenta que, para crear naranja, tuviste que aumentar la intensidad del rojo y disminuir la intensidad del verde en los valores `rgb`. Esto se debe a que el naranja es la combinación de rojo y amarillo, y este queda entre los dos colores de la rueda de color.
|
||||
Ten en cuenta que, para crear naranja, tuviste que aumentar la intensidad del rojo y disminuir la intensidad del verde en los valores `rgb`. This is because orange is the combination of red and yellow.
|
||||
|
||||
Para crear el color terciario spring green (verde primavera), combina el cian con el verde. Actualiza la función `rgb` en la regla CSS `.two` para que el verde esté en el valor máximo, y establece azul a `127`.
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-32
|
||||
|
||||
# --description--
|
||||
|
||||
Beachte, dass du die Intensität von Rot erhöhen musst und die Intensität der grünen `rgb`-Werte senken musst, um Orange zu erstellen. Das liegt daran, dass Orange die Kombination aus Rot und Gelb ist und zwischen den beiden Farben des Farbkreies fällt.
|
||||
Beachte, dass du die Intensität von Rot erhöhen musst und die Intensität der grünen `rgb`-Werte senken musst, um Orange zu erstellen. This is because orange is the combination of red and yellow.
|
||||
|
||||
Kombiniere Cyan mit Grün, um die Tertiärfarbe Frühlingsgrün herzustellen. Aktualisiere die `rgb`-Funktion in der `.two`-CSS-Regel so, dass Grün den maximalen Wert hat und Blau auf `127` eingestellt ist.
|
||||
|
||||
|
||||
+1
-1
@@ -11,7 +11,7 @@ Füge unter dem `.face.right`-Element ein `div`-Element mit einer `class` von `c
|
||||
|
||||
# --hints--
|
||||
|
||||
Du solltest ein `div`-Element innerhalb `.penguin-head` hinzufügen. Expected `--fcc-expected--` `div` elements, found `--fcc-actual--`.
|
||||
Du solltest ein `div`-Element innerhalb `.penguin-head` hinzufügen. Es sind `--fcc-expected--` `div`-Elemente erwartet worden, aber es wurden `--fcc-actual--` gefunden.
|
||||
|
||||
```js
|
||||
assert.equal(document.querySelectorAll('.penguin-head > div')?.length, 3);
|
||||
|
||||
+1
-1
@@ -11,7 +11,7 @@ Füge unter deinem `.chin`-Element zwei `div`-Elemente mit einer `class` von `ey
|
||||
|
||||
# --hints--
|
||||
|
||||
Du solltest zwei `div`-Elemente innerhalb `.penguin-head` hinzufügen. Expected `--fcc-expected--` `div` elements, found `--fcc-actual--`.
|
||||
Du solltest zwei `div`-Elemente innerhalb `.penguin-head` hinzufügen. Es sind `--fcc-expected--` `div`-Elemente erwartet worden, aber es wurden `--fcc-actual--` gefunden.
|
||||
|
||||
```js
|
||||
assert.equal(document.querySelectorAll('.penguin-head > div')?.length, 5);
|
||||
|
||||
+1
-1
@@ -11,7 +11,7 @@ Füge unter dem `.blush.right`-Element zwei `div`-Elemente mit einer `class` von
|
||||
|
||||
# --hints--
|
||||
|
||||
Du solltest zwei `div`-Elemente innerhalb `.penguin-head` hinzufügen. Expected `--fcc-expected--` `div` elements, found `--fcc-actual--`.
|
||||
Du solltest zwei `div`-Elemente innerhalb `.penguin-head` hinzufügen. Es sind `--fcc-expected--` `div`-Elemente erwartet worden, aber es wurden `--fcc-actual--` gefunden.
|
||||
|
||||
```js
|
||||
assert.equal(document.querySelectorAll('.penguin-head > div')?.length, 9);
|
||||
|
||||
+1
-1
@@ -11,7 +11,7 @@ Füge innerhalb des `.shirt`-Elements einen `div` mit dem folgenden Emoji als In
|
||||
|
||||
# --hints--
|
||||
|
||||
Du solltest ein `div`-Element innerhalb `div.shirt` einfügen. Expected `--fcc-expected--` `div` element, found `--fcc-actual--`.
|
||||
Du solltest ein `div`-Element innerhalb `div.shirt` einfügen. Es sind `--fcc-expected--` `div`-Elemente erwartet worden, aber es wurden `--fcc-actual--` gefunden.
|
||||
|
||||
```js
|
||||
assert.equal(document.querySelectorAll('.shirt > div')?.length, 1);
|
||||
|
||||
+1
-1
@@ -13,7 +13,7 @@ Füge innerhalb `.penguin-body`, vor den `.foot`-Elementen, zwei `div`-Elemente
|
||||
|
||||
# --hints--
|
||||
|
||||
Du solltest zwei `div`-Elemente innerhalb `.penguin-body` hinzufügen. Expected `--fcc-expected--` `div` elements, found `--fcc-actual--`.
|
||||
Du solltest zwei `div`-Elemente innerhalb `.penguin-body` hinzufügen. Es sind `--fcc-expected--` `div`-Elemente erwartet worden, aber es wurden `--fcc-actual--` gefunden.
|
||||
|
||||
```js
|
||||
assert.equal(document.querySelectorAll('.penguin-body > div')?.length, 4);
|
||||
|
||||
+1
-1
@@ -11,7 +11,7 @@ Add another `repeating-linear-gradient` below the one you just added. Give it a
|
||||
|
||||
# --hints--
|
||||
|
||||
You should give `.fb5` a second `repeating-linear-gradient` in the `background` property.
|
||||
Du solltest `.fb5` einen zweiten `repeating-linear-gradient` in der `background`-Eigenschaft geben.
|
||||
|
||||
```js
|
||||
assert.match(new __helpers.CSSHelp(document).getStyle(".fb5")?.getPropVal('background', true), /repeating-linear-gradient\(var\(--building-color2\)(0%)?,var\(--building-color2\)5%,transparent5%,transparent10%\),repeating-linear-gradient/);
|
||||
|
||||
+2
-2
@@ -11,13 +11,13 @@ Add an `id` attribute with the value `loving` to the checkbox input.
|
||||
|
||||
# --hints--
|
||||
|
||||
Your checkbox should have an `id` attribute. Check that there is a space after the opening tag's name and/or there are spaces before all attribute names.
|
||||
Deine Checkbox sollte ein `id`-Attribut haben. Check that there is a space after the opening tag's name and/or there are spaces before all attribute names.
|
||||
|
||||
```js
|
||||
assert($('input[type="checkbox"]')[0].hasAttribute('id'));
|
||||
```
|
||||
|
||||
Your checkbox should have an `id` attribute with the value `loving`. You have either omitted the value or have a typo. Remember that attribute values should be surrounded with quotation marks.
|
||||
Deine Checkbox sollte ein `id`-Attribut mit dem Wert `loving` haben. You have either omitted the value or have a typo. Remember that attribute values should be surrounded with quotation marks.
|
||||
|
||||
```js
|
||||
assert($('input[type="checkbox"]')[0].id.match(/^loving$/));
|
||||
|
||||
+1
-1
@@ -35,7 +35,7 @@ Du solltest nur ein abschließendes `fieldset`-Tag hinzufügen. Please remove an
|
||||
assert(code.match(/<\/fieldset>/g).length === 2);
|
||||
```
|
||||
|
||||
The second `fieldset` element should not be nested in the first `fieldset` element.
|
||||
Das zweite `fieldset`-Element sollte nicht im ersten `fieldset`-Element eingebettet sein.
|
||||
|
||||
```js
|
||||
const childrenOf1stFieldset = [
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-49
|
||||
|
||||
# --description--
|
||||
|
||||
If you select the `Indoor` radio button and submit the form, the form data for the button is based on its `name` and `value` attributes. Since your radio buttons do not have a `value` attribute, the form data will include `indoor-outdoor=on`, which is not useful when you have multiple buttons.
|
||||
Wenn du den `Indoor`-Radio-Button auswählst und das Formular absendest, basieren die Formulardaten für den Button auf seine `name`- und `value`-Attribute. Since your radio buttons do not have a `value` attribute, the form data will include `indoor-outdoor=on`, which is not useful when you have multiple buttons.
|
||||
|
||||
Füge ein `value`-Attribut zu beiden Radio-Buttons hinzu. For convenience, set the button's `value` attribute to the same value as its `id` attribute.
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-54
|
||||
|
||||
# --description--
|
||||
|
||||
Currently, if you type in the `input` or `textarea` elements, you will not be able to see the text. Also, their height is too small to be easy to use.
|
||||
Wenn du jetzt in die `input</code- oder <code>textarea`-Elemente eintippst, wirst du den Text nicht sehen können. Also, their height is too small to be easy to use.
|
||||
|
||||
Fix this, by setting the `color` to `#ffffff`, and setting their `min-height` to `2em`.
|
||||
|
||||
|
||||
+2
-2
@@ -7,7 +7,7 @@ dashedName: step-47
|
||||
|
||||
# --description--
|
||||
|
||||
The border of the last `fieldset` element looks a little out of place. You can select the last element of a specific type using the `last-of-type` CSS pseudo-class, like this:
|
||||
The border of the last `fieldset` element looks a little out of place. Du kannst das letzte Element eines bestimmten Typs auswählen, indem du wie folgt die `last-of-type`-CSS-Pseudo-Klasse auswählst:
|
||||
|
||||
```css
|
||||
p:last-of-type { }
|
||||
@@ -17,7 +17,7 @@ Damit wird das letzte `p`-Element ausgewählt. Create a new selector that target
|
||||
|
||||
# --hints--
|
||||
|
||||
You can use the `:last-of-type` pseudo-class to select only the last element of a certain type.
|
||||
Du kannst die `:last-of-type`-Pseudo-Klasse verwenden, um nur das letzte Element eines bestimmten Typs auszuwählen.
|
||||
|
||||
```js
|
||||
assert.exists(new __helpers.CSSHelp(document).getStyle('fieldset:last-of-type'));
|
||||
|
||||
+1
-1
@@ -9,7 +9,7 @@ dashedName: step-18
|
||||
|
||||
Following accessibility best practices, link the `input` elements and the `label` elements together using the `for` attribute.
|
||||
|
||||
Use `first-name`, `last-name`, `email`, and `new-password` as values for the respective `id` attributes.
|
||||
Verwende `first-name`, `last-name`, `email` und `new-password` als Werte für die jeweiligen `id`-Attribute.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+3
-3
@@ -9,7 +9,7 @@ dashedName: step-29
|
||||
|
||||
Follow accessibility best practices by linking the `input` elements and the `label` elements in the second `fieldset`.
|
||||
|
||||
Use `personal-account`, `business-account`, and `terms-and-conditions` as values for the respective `id` attributes.
|
||||
Verwende `personal-account`, `business-account` und `terms-and-conditions` als Werte für die jeweiligen `id`-Attribute.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -19,13 +19,13 @@ The first `input` element should have an `id` of `personal-account`.
|
||||
assert(document.querySelectorAll('fieldset:nth-of-type(2) input')?.[0]?.matches('#personal-account'))
|
||||
```
|
||||
|
||||
The second `input` element should have an `id` of `business-account`.
|
||||
Das zweite `input`-Element sollte die `id` `business-account` haben.
|
||||
|
||||
```js
|
||||
assert(document.querySelectorAll('fieldset:nth-of-type(2) input')?.[1]?.matches('#business-account'))
|
||||
```
|
||||
|
||||
The third `input` element should have an `id` of `terms-and-conditions`.
|
||||
Das dritte `input`-Element sollte die `id` `terms-and-conditions` haben.
|
||||
|
||||
```js
|
||||
assert(document.querySelectorAll('fieldset:nth-of-type(2) input')?.[2]?.matches('#terms-and-conditions'))
|
||||
|
||||
+1
-1
@@ -9,7 +9,7 @@ dashedName: step-38
|
||||
|
||||
Link the applicable form elements and their `label` elements together.
|
||||
|
||||
Use `profile-picture`, `age`, `referrer`, and `bio` as values for the respective `id` attributes.
|
||||
Verwende `profile-picture`, `age`, `referrer` und `bio` als Werte für die jeweiligen `id`-Attribute.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -9,7 +9,7 @@ dashedName: step-30
|
||||
|
||||
Bevor du dich zu sehr in deiner Gestaltung vertiefst, solltest du von der `sr-only`-Klasse Gebrauch machen. Du kannst CSS verwenden, um Elemente mit dieser Klasse vollständig von der visuellen Seite auszublenden, aber dennoch von Screenreadern angezeigt werden zu lassen.
|
||||
|
||||
The CSS you are about to write is a common set of properties used to ensure elements are completely hidden visually.
|
||||
Das CSS, das du gleich schreiben wirst, ist ein allgemeines Set von Eigenschaften, mit denen sichergestellt wird, dass Elemente visuell vollständig ausgeblendet werden.
|
||||
|
||||
Der `span[class~="sr-only"]`-Selektor wird jedes `span`-Element auswählen, dessen `class` * * `sr-only` enthält. Erstelle diesen Selektor und gib ihm eine `border`-Eigenschaft mit dem Wert `0`.
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-36
|
||||
|
||||
# --description--
|
||||
|
||||
Target your flex container with an `h1 .flex` selector. Give it a `display` property set to `flex` to enable the flexbox layout. Then set the `flex-direction` property to `column-reverse` - this will display the nested elements from bottom to top. Finally, set the `gap` property to `1rem` to create some space between the elements.
|
||||
Target your flex container with an `h1 .flex` selector. Give it a `display` property set to `flex` to enable the flexbox layout. Then set the `flex-direction` property to `column-reverse` - this will display the nested elements from bottom to top. Setze schließlich die `gap`-Eigenschaft auf `1rem`, um mehr Abstand zwischen den Elementen zu schaffen.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-51
|
||||
|
||||
# --description--
|
||||
|
||||
Als Nächstes musst du deine `caption`-Elemente gestalten, damit sie mehr wie Header aussehen. Erstelle einen `table caption`-Selektor. Set the text to have a color of `#356eaf`, a size of `1.3em`, and a normal weight.
|
||||
Als Nächstes musst du deine `caption`-Elemente gestalten, damit sie mehr wie Header aussehen. Erstelle einen `table caption`-Selektor. Lege für den Text die Farbe `#356eaf`, eine Größe von `1.3em` und eine normale Schriftgewichtung fest.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-58
|
||||
|
||||
# --description--
|
||||
|
||||
The `:nth-of-type()` pseudo-selector is used to target specific elements based on their order among siblings of the same type. Verwende diesen Pseudo-Selektor, um das dritte `td`-Element innerhalb deiner `total`-Tabellenzeilen auszuwählen. Weise ihm ein rechtes Padding von `0.5rem` zu.
|
||||
Der `:nth-of-type()`-Pseudo-Selektor wird verwendet, um bestimmte Elemente auf Grundlage ihrer Reihenfolge unter Geschwisterelementen desselben Typs auszuwählen. Verwende diesen Pseudo-Selektor, um das dritte `td`-Element innerhalb deiner `total`-Tabellenzeilen auszuwählen. Weise ihm ein rechtes Padding von `0.5rem` zu.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-32
|
||||
|
||||
# --description--
|
||||
|
||||
Logical operators can be used to construct more complex media queries. The `and` logical operator is used to query two media conditions.
|
||||
Mit logischen Operatoren können komplexere Media Queries erstellt werden. The `and` logical operator is used to query two media conditions.
|
||||
|
||||
For example, a media query that targets a display width between 500px and 1000px would be:
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-9
|
||||
|
||||
# --description--
|
||||
|
||||
Add the `height` property with the value `600px` to your `.canvas` rule.
|
||||
Füge die `height`-Eigenschaft mit dem Wert `600px` zu deiner `.canvas`-Regel hinzu.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -9,7 +9,7 @@ dashedName: step-4
|
||||
|
||||
Within your `head` element, add a `link` element with the `rel` attribute set to `stylesheet` and the `href` attribute set to `https://fonts.googleapis.com/css?family=Open+Sans:400,700,800`.
|
||||
|
||||
This will import the `Open Sans` font family, with the font weight values `400`, `700`, and `800`.
|
||||
Auf diese Weise wird die `Open Sans`-Schriftart-Familie mit den Schriftstärke-Einstellungen `400`, `700` und `800` importiert.
|
||||
|
||||
Also add a `link` element to link your `styles.css` file.
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-25
|
||||
|
||||
# --description--
|
||||
|
||||
Now update your `h1` selector to be `header h1` to specifically target your `h1` element within your new `header`.
|
||||
Aktualisiere nun deinen `h1`-Selektor auf `header h1`, um speziell deine `h1`-Elemente innerhalb deines neuen `header` auszuwählen.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -9,7 +9,7 @@ dashedName: step-1
|
||||
|
||||
Statistics is a way of using math to make sense of data. It helps us understand patterns and trends in information, so we can make predictions and decisions based on that information.
|
||||
|
||||
In this challenge, you will build a statistics calculator that takes a set of numbers and returns the mean, median, mode, standard deviation, and variance.
|
||||
In dieser Aufgabe wirst du einen Statistikrechner bauen, der aus einer Reihe von Zahlen den Mittelwert, den Median, den Modus, die Standardabweichung und die Varianz zurückgibt.
|
||||
|
||||
The HTML and CSS have been provided for you. Feel free to explore the code – you may notice that the `calculate` function is called when the form is submitted. When you are ready, declare a `calculate` variable and assign it an empty function in the `script.js` file.
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-2
|
||||
|
||||
# --description--
|
||||
|
||||
To begin, the `calculate` function needs to find the number that was entered in the `#numbers` input field. To do this, use a `.querySelector` to locate the input field and then use the `.value` property to get the number entered.
|
||||
To begin, the `calculate` function needs to find the number that was entered in the `#numbers` input field. Dazu verwendest du einen `.querySelector`, um das Eingabefeld zu finden, und verwende dann die `.value`-Eigenschaft, um die eingegebene Zahl zu erhalten.
|
||||
|
||||
Store this in a `value` variable.
|
||||
|
||||
|
||||
+2
-2
@@ -7,7 +7,7 @@ dashedName: step-7
|
||||
|
||||
# --description--
|
||||
|
||||
Much like the `.map()` method, the `.filter()` method takes a callback function. The callback function takes the current element as its first argument.
|
||||
Wie die `.map()`-Methode nimmt auch die `.filter()`-Methode eine Callback-Funktion auf. The callback function takes the current element as its first argument.
|
||||
|
||||
```js
|
||||
array.filter(el => {
|
||||
@@ -23,7 +23,7 @@ Add a callback function to your `.filter()` method that returns `true` if the el
|
||||
|
||||
# --hints--
|
||||
|
||||
Your `.filter()` method should have a callback which accepts `el` as an argument.
|
||||
Deine `.filter()`-Methode sollte einen Callback haben, der `el` als Argument verwendet.
|
||||
|
||||
```js
|
||||
assert.match(calculate.toString(), /numbers\.filter\(\(?\s*el\s*\)?\s*=>|numbers\.filter\(function\s*\(?el\)\s*\{/)
|
||||
|
||||
+2
-2
@@ -7,7 +7,7 @@ dashedName: step-11
|
||||
|
||||
# --description--
|
||||
|
||||
Wie die anderen Methoden benötigt auch `.reduce()` einen Callback. Dieser Callback benötigt jedoch mindestens zwei Parameter. The first is the <dfn>accumulator</dfn>, and the second is the current element in the array. The return value for the callback becomes the value of the accumulator on the next iteration.
|
||||
Wie die anderen Methoden benötigt auch `.reduce()` einen Callback. Dieser Callback benötigt jedoch mindestens zwei Parameter. The first is the <dfn>accumulator</dfn>, and the second is the current element in the array. Der Rückgabewert für den Callback wird bei der nächsten Iteration zum Wert des Akkumulators.
|
||||
|
||||
```js
|
||||
array.reduce((acc, el) => {
|
||||
@@ -15,7 +15,7 @@ array.reduce((acc, el) => {
|
||||
});
|
||||
```
|
||||
|
||||
For your `sum` variable, pass a callback to `.reduce()` that takes the accumulator and the current element as parameters. Der Callback sollte die Summe aus dem Akkumulators und dem aktuellen Element zurückgeben.
|
||||
Übergib für deine `sum`-Variable einen `.reduce()`-Callback, der den Akkumulator und das aktuelle Element als Parameter verwendet. Der Callback sollte die Summe aus dem Akkumulators und dem aktuellen Element zurückgeben.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+4
-4
@@ -7,9 +7,9 @@ dashedName: step-15
|
||||
|
||||
# --description--
|
||||
|
||||
You can actually clean this logic up a bit. Using the implicit return of an arrow function, you can directly return the value of the `.reduce()` method divided by the length of the array, without having to assign any variables.
|
||||
Du kannst diese Logik sogar ein wenig verbessern. Using the implicit return of an arrow function, you can directly return the value of the `.reduce()` method divided by the length of the array, without having to assign any variables.
|
||||
|
||||
Update your `getMean` function as described above.
|
||||
Aktualisiere deine `getMean`-Funktion wie zuvor beschrieben.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -25,7 +25,7 @@ You should remove the `mean` variable declaration.
|
||||
assert.notMatch(getMean.toString(), /mean\s*=/);
|
||||
```
|
||||
|
||||
You should not change the logic within the `reduce` method.
|
||||
Du solltest die Logik innerhalb der `reduce`-Methode nicht ändern.
|
||||
|
||||
```js
|
||||
assert.match(getMean.toString(), /(array\.reduce\(\(acc\s*,\s*el\s*\)\s*=>|array\.reduce\(function\s*\(acc\s*,\s*el\)\s*\{)\s*(return)?\s*acc\s*\+\s*el;\s*\}?\s*,\s*0\)/)
|
||||
@@ -37,7 +37,7 @@ You should divide the result of the `reduce` method by the length of the array.
|
||||
assert.match(getMean.toString(), /(array\.reduce\(\(acc\s*,\s*el\s*\)\s*=>|array\.reduce\(function\s*\(acc\s*,\s*el\)\s*\{)\s*(return)?\s*acc\s*\+\s*el;\s*\}?\s*,\s*0\)\s*\/\s*array\.length/)
|
||||
```
|
||||
|
||||
You should use implicit return syntax to directly return the result of `reduce` divided by the array length.
|
||||
Du solltest die implizite Rückgabesyntax verwenden, um direkt das Ergebnis von `reduce` geteilt durch die Länge des Arrays zurückzugeben.
|
||||
|
||||
```js
|
||||
assert.match(code, /const\s+getMean\s*=\s*\(?array\)?\s*=>\s*array\.reduce\(\(acc\s*,\s*el\)\s*=>\s*acc\s*\+\s*el\s*,\s*0\s*\)\s*\/\s*array\.length/)
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-16
|
||||
|
||||
# --description--
|
||||
|
||||
Now you need to use your new `getMean` function. In your `calculate` function, declare a `mean` variable and assign it the value of `getMean(numbers)`.
|
||||
Jetzt musst du deine neue `getMean`-Funktion verwenden. In deiner `calculate`-Funktion deklarierst du eine `mean`-Variable und weist ihr den Wert von `getMean(numbers)` zu.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -9,7 +9,7 @@ dashedName: step-23
|
||||
|
||||
Gib schließlich den Wert von `median` zurück.
|
||||
|
||||
Like the `getMean` function, you could condense this code into one line and reduce the number of variables you instantiate. Es ist jedoch wichtig zu bedenken, dass ein kürzerer Code nicht immer besser ist. In diesem Fall würde eine Verkürzung der Codezeilen die Lesbarkeit und das Verständnis des Codes erschweren, was sich auf die künftige Wartbarkeit auswirken würde.
|
||||
Wie die `getMean`-Funktion kannst du diesen Code in einer Zeile zusammenfassen und die Anzahl der Variablen, die du instanzierst, reduzieren. Es ist jedoch wichtig zu bedenken, dass ein kürzerer Code nicht immer besser ist. In diesem Fall würde eine Verkürzung der Codezeilen die Lesbarkeit und das Verständnis des Codes erschweren, was sich auf die künftige Wartbarkeit auswirken würde.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-24
|
||||
|
||||
# --description--
|
||||
|
||||
Like you did with your `getMean` function, you need to add your `getMedian` function to your `calculate` logic.
|
||||
Wie bei der `getMean`-Funktion musst du die `getMedian`-Funktion zu deiner `calculate`-Logik hinzufügen.
|
||||
|
||||
Declare a variable `median` and assign it the value of `getMedian(numbers)`. Then, query the DOM for the `#median` element and set the `textContent` to `median`.
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-26
|
||||
|
||||
# --description--
|
||||
|
||||
In your new function, declare an empty `counts` object. You will use this to track the number of times each number appears in the list.
|
||||
In your new function, declare an empty `counts` object. Damit kannst du verfolgen, wie oft jede Zahl in der Liste erscheint.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+5
-5
@@ -7,11 +7,11 @@ dashedName: step-28
|
||||
|
||||
# --description--
|
||||
|
||||
There are a few edge cases to account for when calculating the mode of a dataset. First, if every value appears the same number of times, there is no mode.
|
||||
There are a few edge cases to account for when calculating the mode of a dataset. Zunächst einmal gibt es keinen Modus, wenn jeder Wert gleich oft auftaucht.
|
||||
|
||||
To calculate this, you will use a `Set`. A `Set` is a data structure that only allows unique values. If you pass an array into the `Set` constructor, it will remove any duplicate values.
|
||||
Um dies zu berechnen wirst du `Set` verwenden. A `Set` is a data structure that only allows unique values. Wenn du ein Array an den `Set`-Konstruktor übergibst, werden alle doppelten Werte entfernt.
|
||||
|
||||
Start by creating an `if` statement. In the condition, create a `Set` with `new Set()` and pass it the `Object.values()` of your `counts` object. If the `size` property of this `Set` is equal to `1`, that tells you every value appears the same number of times. In this case, return `null` from your function.
|
||||
Beginne damit, eine `if`-Anweisung zu erstellen. In der Bedingung erstellst du ein `Set` mit `new Set()` und übergibst ihm den `Object.values()` deines `counts`-Objekts. Wenn die `size`-Eigenschaft dieses `Set` gleich `1` ist, bedeutet das, dass jeder Wert gleich oft vorkommt. In diesem Fall gibst du in deiner Funktion `null` zurück.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -21,13 +21,13 @@ Deine `getMode`-Funktion sollte eine `if`-Anweisung enthalten.
|
||||
assert.match(getMode.toString(), /if\s*\(/);
|
||||
```
|
||||
|
||||
Your `if` statement should create a new `Set` and pass the `Object.values()` of your `counts` object.
|
||||
Deine `if`-Anweisung sollte einen neuen `Set` erstellen und den `Object.values()` deines `counts`-Objekts übergeben.
|
||||
|
||||
```js
|
||||
assert.match(getMode.toString(), /if\s*\(\s*new\s+Set\s*\(\s*Object\.values\s*\(\s*counts\s*\)/);
|
||||
```
|
||||
|
||||
Your `if` statement should check if the `size` property of the new `Set` is equal to `1`.
|
||||
Deine `if`-Anweisung sollte prüfen, ob die `size`-Eigenschaft des neuen `Set` gleich `1` ist.
|
||||
|
||||
```js
|
||||
assert.match(getMode.toString(), /if\s*\(\s*new\s+Set\s*\(\s*Object\.values\s*\(\s*counts\s*\)\s*\)\s*\.size\s*===\s*1/);
|
||||
|
||||
+1
-1
@@ -25,7 +25,7 @@ Deine `getMode`-Funktion sollte die `Object.keys()`-Methode verwenden, um die Sc
|
||||
assert.match(getMode.toString(), /Object\.keys\(\s*counts\s*\)/);
|
||||
```
|
||||
|
||||
Your `getMode` function should use the `Object.keys()` method to get the keys of the `counts` object and assign them to the `highest` variable.
|
||||
Deine `getMode`-Funktion sollte die `Object.keys()`-Methode verwenden, um die Schlüssel des `counts`-Objekts zu erhalten und sie der `highest`-Variablen zuzuweisen.
|
||||
|
||||
```js
|
||||
assert.match(getMode.toString(), /highest\s*=\s*Object\.keys\(\s*counts\s*\)/);
|
||||
|
||||
+2
-2
@@ -9,7 +9,7 @@ dashedName: step-35
|
||||
|
||||
Your next calculation is the <dfn>range</dfn>, which is the difference between the largest and smallest numbers in the list.
|
||||
|
||||
You previously learned about the global `Math` object. `Math` has a `.min()` method to get the smallest number from a series of numbers, and the `.max()` method to get the largest number. Here's an example that gets the smallest number from an array:
|
||||
You previously learned about the global `Math` object. `Math` has a `.min()` method to get the smallest number from a series of numbers, and the `.max()` method to get the largest number. Hier ist ein Beispiel, bei dem die kleinste Zahl aus einem Array ermittelt wird:
|
||||
|
||||
```js
|
||||
Math.min(1, 9, 11, -3, 0.5);
|
||||
@@ -19,7 +19,7 @@ Declare a `getRange` function that takes the same `array` parameter you have bee
|
||||
|
||||
# --hints--
|
||||
|
||||
You should define a `getRange` function.
|
||||
Du solltest eine `getRange`-Funktion definieren.
|
||||
|
||||
```js
|
||||
assert.isFunction(getRange);
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-41
|
||||
|
||||
# --description--
|
||||
|
||||
With two `.map()` calls and a `.reduce()` call, you're creating extra arrays and iterating more times than needed. You should move all of the logic into the `.reduce()` call to save time and memory.
|
||||
Mit zwei `.map()`-Aufrufen und einem `.reduce()`-Aufruf erstellst du zusätzliche Arrays und iterierst häufiger als nötig. Du solltest die gesamte Logik in den `.reduce()`-Aufruf verschieben, um Zeit und Speicher zu sparen.
|
||||
|
||||
Entferne die `differences`, `squaredDifferences` und `sumSquaredDifferences`-Variablen (und deren Werte). Deklariere eine `variance`-Variable und weise ihr den Wert von `array.reduce()` zu. For the callback, pass in your standard `acc` and `el` parameters, but leave the function body empty for now. Denke daran, den Ausgangswert auf `0` zu setzen.
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-44
|
||||
|
||||
# --description--
|
||||
|
||||
Add your new `getVariance` function to the `calculate` function, and update the respective HTML element.
|
||||
Füge deine neue `getVariance`-Funktion zur `calculate`-Funktion hinzu und aktualisiere das entsprechende HTML-Element.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+2
-2
@@ -9,7 +9,7 @@ dashedName: step-45
|
||||
|
||||
Your final calculation is the <dfn>standard deviation</dfn>, which is the square root of the variance.
|
||||
|
||||
Begin by declaring a `getStandardDeviation` function, with the `array` parameter. In the function body, declare a `variance` variable and assign it the variance of the `array`.
|
||||
Beginne mit der Deklaration einer `getStandardDeviation`-Funktion, mit dem `array`-Paramter. Deklariere eine `variance`-Variable im Funktionskörper und weise ihr die Varianz des `array` zu.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -31,7 +31,7 @@ Deine `getStandardDeviation`-Funktion sollte eine `variance`-Variable enthalten.
|
||||
assert.match(getStandardDeviation.toString(), /variance\s*=/);
|
||||
```
|
||||
|
||||
Your `variance` variable should have the value of `getVariance(array)`.
|
||||
Deine `variance`-Variable sollte den Wert von `getVariance(array)` haben.
|
||||
|
||||
```js
|
||||
assert.match(getStandardDeviation.toString(), /variance\s*=\s*getVariance\(\s*array\s*\)/);
|
||||
|
||||
+1
-1
@@ -31,7 +31,7 @@ Deine `standardDeviation`-Variable sollte die `variance`-Variable verwenden.
|
||||
assert.match(getStandardDeviation.toString(), /standardDeviation\s*=\s*Math\.pow\(\s*variance\s*,/);
|
||||
```
|
||||
|
||||
Your `standardDeviation` variable should use the `1/2` exponent.
|
||||
Deine `standardDeviation`-Variable sollte den `1/2`-Exponenten verwenden.
|
||||
|
||||
```js
|
||||
assert.match(getStandardDeviation.toString(), /standardDeviation\s*=\s*Math\.pow\(\s*variance\s*,\s*1\s*\/\s*2\s*\)/);
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-50
|
||||
|
||||
# --description--
|
||||
|
||||
Es gibt noch eine letzte Sache, die zu beheben ist. The `.sort()` method <dfn>mutates</dfn> the array it's called on. It is generally bad practice to mutate a function argument, which `array` is.
|
||||
Es gibt noch eine letzte Sache, die zu beheben ist. The `.sort()` method <dfn>mutates</dfn> the array it's called on. Allgemein ist es eine schlechte Vorgehensweise, ein Funktionsargument zu verändern, welches ein `array` ist.
|
||||
|
||||
To fix this, add an empty `.slice()` call before your `.sort()` method. The empty `.slice()` call will make a shallow copy of the `array`, which you are free to mutate.
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-14
|
||||
|
||||
# --description--
|
||||
|
||||
You'll need to iterate through the array. For simplicity, use a `for` loop to do so.
|
||||
Du musst durch das Array iterieren. For simplicity, use a `for` loop to do so.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-15
|
||||
|
||||
# --description--
|
||||
|
||||
Da du Elemente vergleichen musst, musst du eine eigebettete `for`-Schleife verwenden. This loop should iterate through every element in the array *except* the last one. Use `j` as your inner loop's iterator variable.
|
||||
Da du Elemente vergleichen musst, musst du eine eigebettete `for`-Schleife verwenden. This loop should iterate through every element in the array *except* the last one. Verwende `j` als Iterator-Variable für die innere Schleife.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-17
|
||||
|
||||
# --description--
|
||||
|
||||
In your `sortInputArray()` function, declare a `sortedValues` variable. Assign it the value of calling `bubbleSort` with your `inputValues` array.
|
||||
Deklariere in deiner `sortInputArray()`-Funktion eine `sortedValues`-Variable. Assign it the value of calling `bubbleSort` with your `inputValues` array.
|
||||
|
||||
Then, update your `updateUI` call to take `sortedValues` as the parameter.
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-22
|
||||
|
||||
# --description--
|
||||
|
||||
Time to implement another sorting algorithm. This time, you'll be implementing a <dfn>selection sort</dfn>. Selection sort works by finding the smallest value in the array, then swapping it with the first value in the array. Then, it finds the next smallest value in the array, and swaps it with the second value in the array. It continues iterating through the array until it is completely sorted.
|
||||
Time to implement another sorting algorithm. This time, you'll be implementing a <dfn>selection sort</dfn>. Selection sort works by finding the smallest value in the array, then swapping it with the first value in the array. Then, it finds the next smallest value in the array, and swaps it with the second value in the array. Er fährt fort, das Array zu iterieren, bis es vollständig sortiert ist.
|
||||
|
||||
Start by declaring a `selectionSort` variable and assigning it an arrow function that takes an `array` parameter.
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-24
|
||||
|
||||
# --description--
|
||||
|
||||
Using the `let` keyword, declare a variable called `fighting` but do not initialize it with a value. Denke daran, deine Zeile mit einem Semikolon zu beenden.
|
||||
Mit dem `let`-Schlüsselwort deklarierst du eine Variable mit dem Namen `fighting`, initialisierst sie aber nicht mit einem Wert. Denke daran, deine Zeile mit einem Semikolon zu beenden.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-139
|
||||
|
||||
# --description--
|
||||
|
||||
JavaScript has a conditional operator called the <dfn>ternary operator</dfn>. Dies kann als einzeiliger `if-else`-Ausdruck verwendet werden. Die Sytnax ist: `condition ? true : false`.
|
||||
JavaScript hat einen bedingten Operator, der <dfn>ternärer Operator</dfn> genannt wird. Dies kann als einzeiliger `if-else`-Ausdruck verwendet werden. Die Sytnax ist: `condition ? true : false`.
|
||||
|
||||
Hier ist ein Beispiel für einen `if-else`-Ausdruck, der in einen ternären Ausdruck umgewandelt wurde:
|
||||
|
||||
|
||||
+2
-2
@@ -25,13 +25,13 @@ Du solltest einen ternären Wert verwenden, um den `return` -Wert zu ändern, we
|
||||
assert.match(getMonsterAttackValue.toString(), /return\s+hit\s*>\s*0/);
|
||||
```
|
||||
|
||||
You should use a ternary to return `hit` if `hit` is greater than `0`
|
||||
Du solltest einen ternären Wert verwenden, um `hit` zurückzugeben, wenn `hit` größer ist als `0`
|
||||
|
||||
```js
|
||||
assert.match(getMonsterAttackValue.toString(), /return\s+hit\s*>\s*0\s*\?\s*hit/);
|
||||
```
|
||||
|
||||
You should use a ternary to return `0` if `hit` is not greater than `0`.
|
||||
Du solltest einen ternären Wert verwenden, der `0` zurückgibt, wenn `hit` nicht größer als `0` ist.
|
||||
|
||||
```js
|
||||
assert.match(getMonsterAttackValue.toString(), /return\s+hit\s*>\s*0\s*\?\s*hit\s*:\s*0/);
|
||||
|
||||
+3
-3
@@ -7,9 +7,9 @@ dashedName: step-156
|
||||
|
||||
# --description--
|
||||
|
||||
We don't want a player's only weapon to break. The logical AND operator checks if two statements are true.
|
||||
Wir wollen nicht, dass die einzige Waffe eines Spielers kaputt geht. The logical AND operator checks if two statements are true.
|
||||
|
||||
Use the <dfn>logical AND</dfn> operator `&&` to add a second condition to your `if` statement. The player's weapon should only break if `inventory.length` does not equal (`!==`) one.
|
||||
Use the <dfn>logical AND</dfn> operator `&&` to add a second condition to your `if` statement. Die Waffe des Spielers sollte nur kaputt gehen, wenn `inventory.length` ungleich (`!==`) eins ist.
|
||||
|
||||
Hier ist ein Beispiel für eine `if`-Anweisung mit zwei Bedingungen:
|
||||
|
||||
@@ -27,7 +27,7 @@ Du solltest deine bestehende `if`-Anweisung nicht ändern.
|
||||
assert.match(attack.toString(), /if\s*\(Math\.random\(\)\s*\<=\s*\.1/);
|
||||
```
|
||||
|
||||
You should use the logical AND operator `&&`.
|
||||
Du solltest den logischen UND-Operator `&&` verwenden.
|
||||
|
||||
```js
|
||||
assert.match(attack.toString(), /if\s*\(Math\.random\(\)\s*\<=\s*\.1\s*&&/);
|
||||
|
||||
+1
-1
@@ -9,7 +9,7 @@ dashedName: step-159
|
||||
|
||||
Create two new functions named `pickTwo` and `pickEight`.
|
||||
|
||||
Inside each of those, call the `pick()` function and pass either `2` or `8` as the argument depending on the function name.
|
||||
Rufe in jeder dieser Funktionen die `pick()`-Funktion auf und übergib je nach Funktionsname entweder `2` oder `8` als Argument.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+2
-2
@@ -7,11 +7,11 @@ dashedName: step-163
|
||||
|
||||
# --description--
|
||||
|
||||
Inside your `while` loop, push a random number between 0 and 10 to the end of the `numbers` array. Du kannst diese Zufallszahl mit `Math.floor(Math.random() * 11)` erzeugen.
|
||||
Schiebe innerhalb der `while`-Schleife eine Zufallszahl zwischen 0 und 10 an das Ende des `numbers`-Arrays. Du kannst diese Zufallszahl mit `Math.floor(Math.random() * 11)` erzeugen.
|
||||
|
||||
# --hints--
|
||||
|
||||
You should use the `push` method to add a random number to the end of the `numbers` array.
|
||||
Du solltest die `push`-Methode verwenden, um eine Zufallszahl an das Ende des `numbers`-Bereichs anzuhängen.
|
||||
|
||||
```js
|
||||
assert.match(pick.toString(), /numbers\.push\(/);
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-164
|
||||
|
||||
# --description--
|
||||
|
||||
After the `while` loop, set `text.innerText` to equal `You picked [guess]. Here are the random numbers:`. Replace `guess` with the player's guess.
|
||||
After the `while` loop, set `text.innerText` to equal `You picked [guess]. Here are the random numbers:`. Ersetze `guess` durch die Vermutung des Spielers.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+3
-3
@@ -7,15 +7,15 @@ dashedName: step-167
|
||||
|
||||
# --description--
|
||||
|
||||
`for` loops are declared with three expressions separated by semicolons. `for (a; b; c)`, where `a` is the initialization expression, `b` is the condition, and `c` is the final expression.
|
||||
`for`-Schleifen werden mit drei durch Semikolon getrennten Ausdrücken deklariert. `for (a; b; c)`, where `a` is the initialization expression, `b` is the condition, and `c` is the final expression.
|
||||
|
||||
The initialization expression is executed only once, before the loop starts, and is often used to define and set up the loop variable. Think of it like declaring a counter to use in your loop.
|
||||
Der Initialisierungsausdruck wird nur einmal ausgeführt, bevor die Schleife beginnt, und wird häufig zur Definition und Einrichtung der Schleifenvariablen verwendet. Think of it like declaring a counter to use in your loop.
|
||||
|
||||
Many `for` loops use `i` as the counter and start from 0, so change `let x = 1;` to `let i = 0;`.
|
||||
|
||||
# --hints--
|
||||
|
||||
You should change your initialization in the `for` loop to be `let i = 0;`.
|
||||
Du solltest deine Initialisierung in der `for` -Schleife so ändern, dass sie `let i = 0;` lautet.
|
||||
|
||||
```js
|
||||
assert.match(pick.toString(), /for\s*\(\s*(let|var)\s*i\s*=\s*0\s*;/)
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-170
|
||||
|
||||
# --description--
|
||||
|
||||
Now you can write the logic to run in the loop. Inside your `for` loop, use the `+=` operator to add to the end of `text.innerText`. Add the number at index `i` of the `numbers` array, using `numbers[i]`. Then add a new line, using the escape sequence you used earlier.
|
||||
Jetzt kannst du die Logik schreiben, die in der Schleife ablaufen soll. Inside your `for` loop, use the `+=` operator to add to the end of `text.innerText`. Add the number at index `i` of the `numbers` array, using `numbers[i]`. Füge dann eine neue Zeile ein, indem du die Escape-Sequenz verwendest, die du zuvor benutzt hast.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-137
|
||||
|
||||
# --description--
|
||||
|
||||
Füge dem `locations`-Bereich am Ende ein weiteres Objekt hinzu. Set the `name` property to `lose`, set `button text` to an array with three `REPLAY?` strings, set `button functions` to an array with three `restart` variables, and set `text` to `You die. ☠️`. You can copy that text to use the emote.
|
||||
Füge dem `locations`-Bereich am Ende ein weiteres Objekt hinzu. Set the `name` property to `lose`, set `button text` to an array with three `REPLAY?` strings, set `button functions` to an array with three `restart` variables, and set `text` to `You die. ☠️`. Du kannst diesen Text kopieren, um das Emote zu verwenden.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+5
-5
@@ -9,9 +9,9 @@ dashedName: step-1
|
||||
|
||||
You will be building a shopping cart application. The HTML and CSS are already provided, but you will need to build the JavaScript to make the page interactive.
|
||||
|
||||
To start, you will need to get some of your elements from the DOM. Start by using `document.getElementById()` to get the`#cart-container`, `#products-container`, and `#dessert-card-container` elements. Store them in variables named `cartContainer`, `productsContainer`, and `dessertCards`, respectively.
|
||||
Um zu beginnen, musst du einige deiner Elemente aus dem DOM holen. Beginne mit der Verwendung von `document.getElementById()` um die `#cart-container`-, `#products-container`-, und `#dessert-card-container`-Elemente zu erhalten. Speichere sie in Variablen namens `cartContainer`, `productsContainer` und `dessertCards`.
|
||||
|
||||
Since these will not change, remember to use `const` to declare them.
|
||||
Da sich diese nicht ändern werden, denke daran, `const` zu verwenden, um sie zu deklarieren.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -21,7 +21,7 @@ You should use `document.getElementById()` to get the `#cart-container` element.
|
||||
assert.match(code, /document\.getElementById\(\s*('|"|`)cart-container\1\s*\)/);
|
||||
```
|
||||
|
||||
Du solltest das `#cart-container`-Element einer Variablen namens `cartContainer` zuweisen. Remember to use `const` to declare the variable.
|
||||
Du solltest das `#cart-container`-Element einer Variablen namens `cartContainer` zuweisen. Denke daran, `const` zu verwenden, um die Variable zu deklarieren.
|
||||
|
||||
```js
|
||||
assert.match(code, /const\s+cartContainer\s*=\s*document\.getElementById\(\s*('|"|`)cart-container\1\s*\)/);
|
||||
@@ -33,7 +33,7 @@ You should use `document.getElementById()` to get the `#products-container` elem
|
||||
assert.match(code, /document\.getElementById\(\s*('|"|`)products-container\1\s*\)/);
|
||||
```
|
||||
|
||||
Du solltest das `#products-container`-Element einer Variablen namens `productsContainer` zuweisen. Remember to use `const` to declare the variable.
|
||||
Du solltest das `#products-container`-Element einer Variablen namens `productsContainer` zuweisen. Denke daran, `const` zu verwenden, um die Variable zu deklarieren.
|
||||
|
||||
```js
|
||||
assert.match(code, /const\s+productsContainer\s*=\s*document\.getElementById\(\s*('|"|`)products-container\1\s*\)/);
|
||||
@@ -45,7 +45,7 @@ You should use `document.getElementById()` to get the `#dessert-card-container`
|
||||
assert.match(code, /document\.getElementById\(\s*('|"|`)dessert-card-container\1\s*\)/);
|
||||
```
|
||||
|
||||
Du solltest das `#dessert-card-container`-Element einer Variablen namens `dessertCards` zuweisen. Remember to use `const` to declare the variable.
|
||||
Du solltest das `#dessert-card-container`-Element einer Variablen namens `dessertCards` zuweisen. Denke daran, `const` zu verwenden, um die Variable zu deklarieren.
|
||||
|
||||
```js
|
||||
assert.match(code, /const\s+dessertCards\s*=\s*document\.getElementById\(\s*('|"|`)dessert-card-container\1\s*\)/);
|
||||
|
||||
+3
-3
@@ -7,7 +7,7 @@ dashedName: step-2
|
||||
|
||||
# --description--
|
||||
|
||||
Now you need to get your two buttons. Continuing the pattern, get the `#cart-btn` and `#clear-cart-btn` elements. Store them in variables named `cartBtn` and `clearCartBtn`, respectively.
|
||||
Now you need to get your two buttons. Weiter geht es mit den `#cart-btn`- und `#clear-cart-btn`-Elementen. Speichere sie in Variablen namens `cartBtn` und `clearCartBtn`.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -17,7 +17,7 @@ Du solltest `document.getElementById()` verwenden, um das `#cart-btn`-Element zu
|
||||
assert.match(code, /document\.getElementById\(\s*('|"|`)cart-btn\1\s*\)/);
|
||||
```
|
||||
|
||||
Du solltest das `#cart-btn`-Element einer Variablen namens `cartBtn` zuweisen. Remember to use `const` to declare the variable.
|
||||
Du solltest das `#cart-btn`-Element einer Variablen namens `cartBtn` zuweisen. Denke daran, `const` zu verwenden, um die Variable zu deklarieren.
|
||||
|
||||
```js
|
||||
assert.match(code, /const\s+cartBtn\s*=\s*document\.getElementById\(\s*('|"|`)cart-btn\1\s*\)/);
|
||||
@@ -29,7 +29,7 @@ You should use `document.getElementById()` to get the `#clear-cart-btn` element.
|
||||
assert.match(code, /document\.getElementById\(\s*('|"|`)clear-cart-btn\1\s*\)/);
|
||||
```
|
||||
|
||||
Du solltest das `#clear-cart-btn`-Element einer Variablen namens `clearCartBtn` zuweisen. Remember to use `const` to declare the variable.
|
||||
Du solltest das `#clear-cart-btn`-Element einer Variablen namens `clearCartBtn` zuweisen. Denke daran, `const` zu verwenden, um die Variable zu deklarieren.
|
||||
|
||||
```js
|
||||
assert.match(code, /const\s+clearCartBtn\s*=\s*document\.getElementById\(\s*('|"|`)clear-cart-btn\1\s*\)/);
|
||||
|
||||
+5
-5
@@ -7,7 +7,7 @@ dashedName: step-3
|
||||
|
||||
# --description--
|
||||
|
||||
Next is to get your totals. Get the `#total-items`, `#subtotal`, `#taxes`, and `#total` elements. Store them in variables named `totalNumberOfItems`, `cartSubTotal`, `cartTaxes`, and `cartTotal`, respectively.
|
||||
Als Nächstes musst du deine Gesamtbeträge ermitteln. Get the `#total-items`, `#subtotal`, `#taxes`, and `#total` elements. Speichere sie in den Variablen namens `totalNumberOfItems`, `cartSubTotal`, `cartTaxes` und `cartTotal`.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -17,7 +17,7 @@ Du solltest `document.getElementById()` verwenden, um das `#total-items`-Element
|
||||
assert.match(code, /document\.getElementById\(\s*('|"|`)total-items\1\s*\)/);
|
||||
```
|
||||
|
||||
Du solltest das `#total-items`-Element einer Variablen namens `totalNumberOfItems` zuweisen. Remember to use `const` to declare the variable.
|
||||
Du solltest das `#total-items`-Element einer Variablen namens `totalNumberOfItems` zuweisen. Denke daran, `const` zu verwenden, um die Variable zu deklarieren.
|
||||
|
||||
```js
|
||||
assert.match(code, /const\s+totalNumberOfItems\s*=\s*document\.getElementById\(\s*('|"|`)total-items\1\s*\)/);
|
||||
@@ -29,7 +29,7 @@ Du solltest `document.getElementById()` verwenden, um das `#subtotal`-Element zu
|
||||
assert.match(code, /document\.getElementById\(\s*('|"|`)subtotal\1\s*\)/);
|
||||
```
|
||||
|
||||
Du solltest das `#subtotal`-Element einer Variablen namens `cartSubTotal` zuweisen. Remember to use `const` to declare the variable.
|
||||
Du solltest das `#subtotal`-Element einer Variablen namens `cartSubTotal` zuweisen. Denke daran, `const` zu verwenden, um die Variable zu deklarieren.
|
||||
|
||||
```js
|
||||
assert.match(code, /const\s+cartSubTotal\s*=\s*document\.getElementById\(\s*('|"|`)subtotal\1\s*\)/);
|
||||
@@ -41,7 +41,7 @@ Du solltest `document.getElementById()` verwenden, um das `#taxes`-Element zu er
|
||||
assert.match(code, /document\.getElementById\(\s*('|"|`)taxes\1\s*\)/);
|
||||
```
|
||||
|
||||
Du solltest das `#taxes`-Element einer Variablen namens `cartTaxes` zuweisen. Remember to use `const` to declare the variable.
|
||||
Du solltest das `#taxes`-Element einer Variablen namens `cartTaxes` zuweisen. Denke daran, `const` zu verwenden, um die Variable zu deklarieren.
|
||||
|
||||
```js
|
||||
assert.match(code, /const\s+cartTaxes\s*=\s*document\.getElementById\(\s*('|"|`)taxes\1\s*\)/);
|
||||
@@ -53,7 +53,7 @@ Du solltest `document.getElementById()` verwenden, um das `#total`-Element zu er
|
||||
assert.match(code, /document\.getElementById\(\s*('|"|`)total\1\s*\)/);
|
||||
```
|
||||
|
||||
Du solltest das `#total`-Element einer Variablen namens `cartTotal` zuweisen. Remember to use `const` to declare the variable.
|
||||
Du solltest das `#total`-Element einer Variablen namens `cartTotal` zuweisen. Denke daran, `const` zu verwenden, um die Variable zu deklarieren.
|
||||
|
||||
```js
|
||||
assert.match(code, /const\s+cartTotal\s*=\s*document\.getElementById\(\s*('|"|`)total\1\s*\)/);
|
||||
|
||||
+2
-2
@@ -7,7 +7,7 @@ dashedName: step-4
|
||||
|
||||
# --description--
|
||||
|
||||
The last element to get is the `#show-hide-cart` element. Store it in a variable named `showHideCartSpan`.
|
||||
Das letzte Element, das abgerufen wird, ist das `#show-hide-cart`-Element. Speichere dieses dann in einer Variablen namens `showHideCartSpan`.
|
||||
|
||||
Then, use `let` to declare a variable named `isCartShowing` and set it to `false`.
|
||||
|
||||
@@ -19,7 +19,7 @@ Du solltest `document.getElementById()` verwenden, um das `#show-hide-cart`-Elem
|
||||
assert.match(code, /document\.getElementById\(\s*('|"|`)show-hide-cart\1\s*\)/);
|
||||
```
|
||||
|
||||
Du solltest das `#show-hide-cart`-Element einer Variablen namens `showHideCartSpan` zuweisen. Remember to use `const` to declare the variable.
|
||||
Du solltest das `#show-hide-cart`-Element einer Variablen namens `showHideCartSpan` zuweisen. Denke daran, `const` zu verwenden, um die Variable zu deklarieren.
|
||||
|
||||
```js
|
||||
assert.match(code, /const\s+showHideCartSpan\s*=\s*document\.getElementById\(\s*('|"|`)show-hide-cart\1\s*\)/);
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-5
|
||||
|
||||
# --description--
|
||||
|
||||
A shopping cart does not serve much purpose without products. Declare a `products` variable and set it to an empty array. Using an array will allow you to store multiple products.
|
||||
Ein Einkaufswagen erfüllt ohne Produkte kaum einen Zweck. Deklariere die `products`-Variable und setze sie auf ein leeres Array. Die Verwendung eines Arrays ermöglicht es dir, mehrere Produkte zu speichern.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+4
-4
@@ -7,9 +7,9 @@ dashedName: step-6
|
||||
|
||||
# --description--
|
||||
|
||||
You now need to start adding products. Before you do that, you need to consider the structure of your product data. A product will need a unique identifier to distinguish it from other products, a price so people know how much it costs, and a name so people know what they are buying. Außerdem solltest du zu jedem Produkt eine Kategorie hinzufügen.
|
||||
Jetzt musst du anfangen, Produkte hinzuzufügen. Bevor du das machst, musst du dir Gedanken über die Struktur deiner Produktdaten machen. A product will need a unique identifier to distinguish it from other products, a price so people know how much it costs, and a name so people know what they are buying. Außerdem solltest du zu jedem Produkt eine Kategorie hinzufügen.
|
||||
|
||||
Add an object to your `products` array. Give this object an `id` property set to the number `1`, a `name` property set to `Vanilla Cupcakes (6 Pack)`, a `price` property set to the number `12.99`, and a `category` property set to `Cupcake`.
|
||||
Füge ein Objekt zu deinem `products`-Array hinzu. Gib diesem Objekt eine `id`-Eigenschaft auf die Zahl `1` gesetzt, eine `name`-Eigenschaft auf `Vanilla Cupcakes (6 Pack)` gesetzt, eine `price`-Eigenschaft auf die Zahl `12.99` und eine `category`-Eigenschaft auf `Cupcake` gesetzt.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -31,7 +31,7 @@ Dein Produkte-Array sollte ein Objekt mit einer `id`-Eigenschaft haben, die auf
|
||||
assert.equal(products[0].id, 1);
|
||||
```
|
||||
|
||||
Your products array should have an object with a `name` property set to `Vanilla Cupcakes (6 Pack)`.
|
||||
Dein Produkte-Array sollte ein Objekt mit der `name`-Eigenschaft haben, die auf `Vanilla Cupcakes (6 Pack)` gesetzt ist.
|
||||
|
||||
```js
|
||||
assert.equal(products[0].name, 'Vanilla Cupcakes (6 Pack)');
|
||||
@@ -43,7 +43,7 @@ Dein Produkte-Array sollte ein Objekt mit einer `price`-Eigenschaft haben, die a
|
||||
assert.equal(products[0].price, 12.99);
|
||||
```
|
||||
|
||||
Your products array should have an object with a `category` property set to `Cupcake`.
|
||||
Dein Produkte-Array sollte ein Objekt mit der `category`-Eigenschaft haben, die auf `Cupcake` gesetzt ist.
|
||||
|
||||
```js
|
||||
assert.equal(products[0].category, 'Cupcake');
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-8
|
||||
|
||||
# --description--
|
||||
|
||||
Now that you have your list of products, you can use JavaScript to insert them into the HTML. With this approach, if you decide to add more products, the HTML will automatically reflect that.
|
||||
Nun, da du deine Produktliste hast, kannst du JavaScript verwenden, um sie in den HTML-Code einzufügen. Mit diesem Ansatz wird der HTML-Code automatisch angepasst, wenn du dich entscheidest, weitere Produkte hinzuzufügen.
|
||||
|
||||
Start by calling the `.forEach` method of your `products` array. Use arrow syntax to create an empty callback function.
|
||||
|
||||
|
||||
+3
-3
@@ -7,13 +7,13 @@ dashedName: step-9
|
||||
|
||||
# --description--
|
||||
|
||||
Remember that you can use destructuring to extract multiple values from an array or object in a single statement.
|
||||
Denke daran, dass du die Destrukturierung verwenden kannst, um mehrere Werte aus einem Array oder Objekt in einer einzigen Anweisung zu extrahieren.
|
||||
|
||||
For the first parameter of your callback function, destructure the `name`, `id`, `price`, and `category` properties from the object passed in.
|
||||
Für den ersten Parameter deiner Callback-Funktion destrukturierst du die `name`-, `id`-, `price`- und `category`-Eigenschaften aus dem übergebenen Objekt.
|
||||
|
||||
# --hints--
|
||||
|
||||
Du solltest Destrukturierung verwenden, um die `name`-, `id`-, `price`- und die `category`-Parameter zu deklarieren. For this test, order matters.
|
||||
Du solltest Destrukturierung verwenden, um die `name`-, `id`-, `price`- und die `category`-Parameter zu deklarieren. In diesem Test kommt es auf die Reihenfolge an.
|
||||
|
||||
```js
|
||||
assert.match(code, /\{\s*name\s*,\s*id\s*,\s*price\s*,\s*category\s*\}/);
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-10
|
||||
|
||||
# --description--
|
||||
|
||||
You need to display the available products in your HTML. Start by using the addition assignment operator to add an empty template literal string to the `innerHTML` property of the `dessertCards` variable.
|
||||
Du musst die verfügbaren Produkte in deinem HTML anzeigen. Start by using the addition assignment operator to add an empty template literal string to the `innerHTML` property of the `dessertCards` variable.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+2
-2
@@ -7,7 +7,7 @@ dashedName: step-11
|
||||
|
||||
# --description--
|
||||
|
||||
In your template literal, create a `div` element with a class of `dessert-card`. In that `div`, create an `h2` element and give it the text of the `name` variable.
|
||||
In your template literal, create a `div` element with a class of `dessert-card`. In diesem `div` erstellst du ein `h2`-Element und gibst ihm den Text der `name`-Variablen.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -17,7 +17,7 @@ You should create a `div` element.
|
||||
assert.isAtLeast(document.querySelectorAll('div')?.length, 12);
|
||||
```
|
||||
|
||||
Your `div` element should have a class of `dessert-card`.
|
||||
Dein `div`-Element sollte eine Klasse von `dessert-card` haben.
|
||||
|
||||
```js
|
||||
assert.equal(document.querySelectorAll('.dessert-card')?.length, 12);
|
||||
|
||||
+3
-3
@@ -7,7 +7,7 @@ dashedName: step-12
|
||||
|
||||
# --description--
|
||||
|
||||
After your `h2` element, create two `p` elements. Give the first a `class` of `dessert-price`, and the text of the `price` variable with a dollar sign in front of it. Give the second a `class` of `product-category`, and the text `Category:` followed by the value of the `category` variable.
|
||||
After your `h2` element, create two `p` elements. Gib dem Ersten eine `class` von `dessert-price` und den Text der `price`-Variablen mit einem vorangestellten Dollarzeichen. Give the second a `class` of `product-category`, and the text `Category:` followed by the value of the `category` variable.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -32,13 +32,13 @@ Dein erstes `p`-Element sollte eine `class` auf `dessert-price` gesetzt haben.
|
||||
assert.equal(document.querySelector('.dessert-card')?.children[1].className, 'dessert-price');
|
||||
```
|
||||
|
||||
Your first `p` element should have the text of the `price` variable with a dollar sign in front of it.
|
||||
Dein erstes `p`-Element sollte den Text der `price`-Variablen mit einem vorangestellten Dollarzeichen enthalten.
|
||||
|
||||
```js
|
||||
assert.equal(document.querySelector('.dessert-card')?.children[1].textContent, '$12.99');
|
||||
```
|
||||
|
||||
Your second `p` element should have a `class` of `product-category`.
|
||||
Dein zweites `p`-Element sollte die `class` `product-category` haben.
|
||||
|
||||
```js
|
||||
assert.equal(document.querySelector('.dessert-card')?.children[2].className, 'product-category');
|
||||
|
||||
+2
-2
@@ -7,7 +7,7 @@ dashedName: step-13
|
||||
|
||||
# --description--
|
||||
|
||||
Finally, after your `p` elements, create a `button` element. Give it an `id` set to the value of the `id` variable, a `class` of `btn add-to-cart-btn`, and use `Add to cart` for the text.
|
||||
Abschließend erstellst du nach deinen `p`-Elementen ein `button`-Element. Give it an `id` set to the value of the `id` variable, a `class` of `btn add-to-cart-btn`, and use `Add to cart` for the text.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -30,7 +30,7 @@ Dein `-button`-Element sollte eine `id` auf den Wert der `id`-Variable gesetzt h
|
||||
assert.equal(document.querySelector('.dessert-card button')?.id, '1');
|
||||
```
|
||||
|
||||
Your `button` element should have a `class` of `btn add-to-cart-btn`.
|
||||
Dein `button`-Element sollte die `class` `btn add-to-cart-btn` haben.
|
||||
|
||||
```js
|
||||
assert.include(document.querySelector('.dessert-card button')?.className, 'btn');
|
||||
|
||||
+2
-2
@@ -9,13 +9,13 @@ dashedName: step-14
|
||||
|
||||
You are already familiar with an HTML `class`, but JavaScript also has a <dfn>class</dfn>. In JavaScript, a class is like a blueprint for creating objects. It allows you to define a set of properties and methods, and instantiate (or create) new objects with those properties and methods.
|
||||
|
||||
The `class` keyword is used to declare a class. Here is an example of declaring a `Computer` class:
|
||||
Das `class`-Schlüsselwort wird verwendet, um eine Klasse zu deklarieren. Hier ist ein Beispiel für die Deklaration einer `Computer`-Klasse:
|
||||
|
||||
```js
|
||||
class Computer {};
|
||||
```
|
||||
|
||||
Declare a `ShoppingCart` class.
|
||||
Deklariere eine `ShoppingCart`-Klasse.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+2
-2
@@ -7,7 +7,7 @@ dashedName: step-15
|
||||
|
||||
# --description--
|
||||
|
||||
Classes have a special `constructor` method, which is called when a new instance of the class is created. The `constructor` method is a great place to initialize properties of the class. Here is an example of a class with a `constructor` method:
|
||||
Klassen haben eine besondere `constructor`-Methode, die aufgerufen wird, wenn eine neue Instanz der Klasse erstellt wird. The `constructor` method is a great place to initialize properties of the class. Hier ist ein Beispiel für eine Klasse mit einer `constructor`-Methode:
|
||||
|
||||
```js
|
||||
class Computer {
|
||||
@@ -16,7 +16,7 @@ class Computer {
|
||||
}
|
||||
```
|
||||
|
||||
Add an empty `constructor` method to the `ShoppingCart` class.
|
||||
Füge eine leere `constructor`-Methode zur `ShoppingCart`-Klasse hinzu.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+2
-2
@@ -7,7 +7,7 @@ dashedName: step-16
|
||||
|
||||
# --description--
|
||||
|
||||
The `this` keyword in JavaScript is used to refer to the current object. Depending on where `this` is used, what it references changes. In the case of a class, it refers to the instance of the object being constructed. You can use the `this` keyword to set the properties of the object being instantiated. Here is an example:
|
||||
Das `this`-Schlüsselwort in JavaScript wird verwendet, um auf das aktuelle Objekt zu verweisen. Depending on where `this` is used, what it references changes. In the case of a class, it refers to the instance of the object being constructed. You can use the `this` keyword to set the properties of the object being instantiated. Here is an example:
|
||||
|
||||
```js
|
||||
class Computer {
|
||||
@@ -17,7 +17,7 @@ class Computer {
|
||||
}
|
||||
```
|
||||
|
||||
In your constructor, use the `this` keyword to set the `items` property to an empty array. Also, set the `total` property to `0`, and the `taxRate` property to `8.25`.
|
||||
Verwende in deinem Konstruktor das `this`-Schlüsselwort, um die `items`-Eigenschaft auf ein leeres Array zu setzen. Setze ebenfalls die `total`-Eigenschaft auf `0` und die `taxRate`-Eigenschaft auf `8.25`.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+2
-2
@@ -7,7 +7,7 @@ dashedName: step-17
|
||||
|
||||
# --description--
|
||||
|
||||
Your `ShoppingCart` class needs the ability to add items. Create an empty `addItem` method, which takes two parameters: `id` and `products`. Creating a method might look like this:
|
||||
Your `ShoppingCart` class needs the ability to add items. Erstelle eine leere `addItem`-Methode, die zwei Parameter benötigt: `id` und `products`. So könnte die Erstellung einer Methode aussehen:
|
||||
|
||||
```js
|
||||
class Computer {
|
||||
@@ -21,7 +21,7 @@ class Computer {
|
||||
}
|
||||
```
|
||||
|
||||
The first parameter, `id`, is the `id` of the product the user has added to their cart. The second parameter, `products`, is an array of product objects. By using a parameter instead of directly referencing your existing `products` array, this method will be more flexible if you wanted to add additional product lists in the future.
|
||||
Der erste Parameter, `id`, ist die `id` des Produkts, das der Nutzer in seinen Einkaufswagen gelegt hat. Der zweite Parameter, `products`, ist ein Array von Produktobjekten. By using a parameter instead of directly referencing your existing `products` array, this method will be more flexible if you wanted to add additional product lists in the future.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-18
|
||||
|
||||
# --description--
|
||||
|
||||
You need to find the product that the user is adding to the cart. Remember that arrays have a `.find()` method. In your `addItem` function, declare a `product` variable, and assign it the value of calling the `.find()` method on the `products` array.
|
||||
Du musst das Produkt finden, das der Nutzer in den Einkaufswagen legt. Remember that arrays have a `.find()` method. Deklariere in deiner `addItem`-Funktion eine `product`-Variable und weise ihr den Wert des Aufrufs der `.find()`-Methode für das `products`-Array zu.
|
||||
|
||||
For the callback to `.find()`, pass a function that takes a single parameter `item`, and returns whether the `id` property of `item` is strictly equal to the `id` parameter passed to `addItem`.
|
||||
|
||||
|
||||
+2
-2
@@ -7,7 +7,7 @@ dashedName: step-19
|
||||
|
||||
# --description--
|
||||
|
||||
Use `const` and destructuring to extract `name` and `price` variables from `product`.
|
||||
Nutze `const` und die Destrukturierung, um die `name`- und `price`-Variablen aus `product` zu extrahieren.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -25,7 +25,7 @@ const afterAdd = code.split("addItem")[1];
|
||||
assert.match(afterAdd, /const\s*\{\s*name\s*,\s*price\s*\}/);
|
||||
```
|
||||
|
||||
You should use destructuring to get the `name` and `price` variables from `product`.
|
||||
Du solltest die Destrukturierung verwenden, um die `name`- und `price`-Variablen vom `product` zu erhalten.
|
||||
|
||||
```js
|
||||
const afterAdd = code.split("addItem")[1];
|
||||
|
||||
+2
-2
@@ -7,7 +7,7 @@ dashedName: step-20
|
||||
|
||||
# --description--
|
||||
|
||||
Now you need to push the `product` into the cart's `items` array. Remember to use the `this` keyword.
|
||||
Jetzt musst du das `product` in das `items`-Array des Einkaufswagens schieben. Denke daran, das `this`-Schlüsselwort zu verwenden.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -18,7 +18,7 @@ const cart = new ShoppingCart();
|
||||
assert.match(cart.addItem.toString(), /items\.push\(/);
|
||||
```
|
||||
|
||||
Remember you need to use the `this` keyword to access the `items` array.
|
||||
Denke daran, das `this`-Schlüsselwort zu verwenden, um auf das `items`-Array zuzugreifen.
|
||||
|
||||
```js
|
||||
const cart = new ShoppingCart();
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-21
|
||||
|
||||
# --description--
|
||||
|
||||
You now need a total count of each product that the user has in the cart. Declare a `totalCountPerProduct` variable, and assign it an empty object.
|
||||
Du brauchst jetzt die Gesamtzahl aller Produkte, die der Nutzer im Einkaufswagen hat. Deklariere eine `totalCountPerProduct`-Variable und weise ihr ein leeres Objekt zu.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -18,7 +18,7 @@ const cart = new ShoppingCart();
|
||||
assert.match(cart.addItem.toString(), /items\.forEach\(/);
|
||||
```
|
||||
|
||||
Remember to use the `this` keyword to access the `items` array.
|
||||
Denke daran, das `this`-Schlüsselwort zu verwenden, um auf das `items`-Array zuzugreifen.
|
||||
|
||||
```js
|
||||
const cart = new ShoppingCart();
|
||||
|
||||
+3
-3
@@ -7,7 +7,7 @@ dashedName: step-23
|
||||
|
||||
# --description--
|
||||
|
||||
In your `forEach` callback, you need to update the `totalCountPerProduct` object. Using the `id` of the current `dessert` as your property, update the value of the property to be the current value plus one. Do not use the addition assignment operator for this.
|
||||
In deinem `forEach`-Callback musst du das `totalCountPerProduct`-Objekt aktualisieren. Verwende die `id` des aktuellen `dessert` als deine Eigenschaft und aktualisiere den Wert der Eigenschaft auf den aktuellen Wert plus eins. Do not use the addition assignment operator for this.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -18,7 +18,7 @@ const cart = new ShoppingCart();
|
||||
assert.match(cart.addItem.toString(), /dessert\.id/);
|
||||
```
|
||||
|
||||
You should use bracket notation to access the property of `totalCountPerProduct` that corresponds to `dessert.id`.
|
||||
Du solltest die Klammerschreibweise verwenden, um auf die Eigenschaft von `totalCountPerProduct` zuzugreifen, die der `dessert.id` entspricht.
|
||||
|
||||
```js
|
||||
const cart = new ShoppingCart();
|
||||
@@ -32,7 +32,7 @@ const cart = new ShoppingCart();
|
||||
assert.match(cart.addItem.toString(), /totalCountPerProduct\[\s*dessert\.id\s*\]\s*=/);
|
||||
```
|
||||
|
||||
You should update the value of `totalCountPerProduct` to be the current value plus one.
|
||||
Du solltest den Wert von `totalCountPerProduct` auf den aktuellen Wert plus eins aktualisieren.
|
||||
|
||||
```js
|
||||
const cart = new ShoppingCart();
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-25
|
||||
|
||||
# --description--
|
||||
|
||||
Now you need to get prepared to update the display with the new product the user added. Declare a `currentProductCount` variable, and assign it the value of the `totalCountPerProduct` object's property matching the `id` of `product`.
|
||||
Jetzt musst du dich darauf vorbereiten, die Anzeige mit dem neuen Produkt zu aktualisieren, das der Nutzer hinzugefügt hat. Declare a `currentProductCount` variable, and assign it the value of the `totalCountPerProduct` object's property matching the `id` of `product`.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -11,7 +11,7 @@ You haven't written the code to generate the HTML yet, but if a product has alre
|
||||
|
||||
Use `.getElementById()` to get the matching element - you'll be setting the `id` value to `product-count-for-id${product.id}`, so use a template literal to query that value.
|
||||
|
||||
Assign your query to a `currentProductCountSpan` variable.
|
||||
Weise deine Query einer `currentProductCountSpan`-Variablen zu.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-28
|
||||
|
||||
# --description--
|
||||
|
||||
For your truthy expression, removing the `undefined`, you need to update the `textContent` of the `currentProductCountSpan` to be the `currentProductCount` followed by an `x`. Use a template literal to do so.
|
||||
Für deinen wahrheitsgemäßen Ausdruck, bei dem du den `undefined` entfernst, musst du den `textContent` des `currentProductCountSpan` so aktualisieren, dass er der `currentProductCount` gefolgt von einem `x` ist. Use a template literal to do so.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+2
-2
@@ -18,7 +18,7 @@ const cart = new ShoppingCart();
|
||||
assert.notMatch(cart.addItem.toString(), /undefined/);
|
||||
```
|
||||
|
||||
You should use the addition assignment operator to add HTML to the `productsContainer`. Remember that HTML goes in the `innerHTML` property.
|
||||
You should use the addition assignment operator to add HTML to the `productsContainer`. Denke daran, dass HTML in die `innerHTML`-Eigenschaft gehört.
|
||||
|
||||
```js
|
||||
const cart = new ShoppingCart();
|
||||
@@ -47,7 +47,7 @@ cart.addItem(1, products);
|
||||
assert.equal(productsContainer.children?.[0]?.className, "product");
|
||||
```
|
||||
|
||||
Your `div` should have the `id` set to `dessert${id}`.
|
||||
Dein `div` sollte die `id` auf `dessert${id}` gesetzt haben.
|
||||
|
||||
```js
|
||||
const cart = new ShoppingCart();
|
||||
|
||||
+3
-3
@@ -7,7 +7,7 @@ dashedName: step-31
|
||||
|
||||
# --description--
|
||||
|
||||
In your first `p` element, add a `span` element. Give the `span` a class of `product-count` and an `id` of `product-count-for-id${id}`. Then, after the span, give your `p` element the text of the `name` variable.
|
||||
Füge in dein erstes `p`-Element ein `span`-Element ein. Gib dem `span` eine Klasse von `product-count` und eine `id` von `product-count-for-id${id}`. Dann, nach der Span, gibst du deinem `p`-Element den Text der `name`-Variable.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -22,7 +22,7 @@ assert.equal(p.children.length, 1);
|
||||
assert.equal(p.children[0].tagName, 'SPAN');
|
||||
```
|
||||
|
||||
Your `span` element should have a `class` of `product-count`.
|
||||
Dein `span`-Element sollte die `class` `product-count` haben.
|
||||
|
||||
```js
|
||||
const cart = new ShoppingCart();
|
||||
@@ -32,7 +32,7 @@ const p = div.querySelector('p');
|
||||
assert.equal(p.children[0].className, 'product-count');
|
||||
```
|
||||
|
||||
Your `span` element should have an `id` of `product-count-for-id${id}`.
|
||||
Dein `span`-Element sollte die `id` `product-count-for-id${id}` haben.
|
||||
|
||||
```js
|
||||
const cart = new ShoppingCart();
|
||||
|
||||
+3
-3
@@ -7,13 +7,13 @@ dashedName: step-32
|
||||
|
||||
# --description--
|
||||
|
||||
There is still more functionality that your `ShoppingCart` class needs, but first you need to be able to test the code you have currently written. You'll need to <dfn>instantiate</dfn> a new `ShoppingCart` object and assign it to a variable. Here is an example of instantiating the `Computer` class from earlier examples:
|
||||
There is still more functionality that your `ShoppingCart` class needs, but first you need to be able to test the code you have currently written. Du musst ein neues `ShoppingCart`-Objekt <dfn>instantiieren</dfn> und es einer Variablen zuweisen. Hier ist ein Beispiel für die Instanziierung der `Computer`-Klasse aus früheren Beispielen:
|
||||
|
||||
```js
|
||||
const myComputer = new Computer();
|
||||
```
|
||||
|
||||
Declare a `cart` variable, and assign it a new `ShoppingCart` object. Note the use of the `new` keyword when instantiating the object.
|
||||
Deklariere eine `cart`-Variable, und weise ihr ein neues `ShoppingCart`-Objekt zu. Note the use of the `new` keyword when instantiating the object.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -23,7 +23,7 @@ You should use `const` to declare a `cart` variable.
|
||||
assert.match(code, /const\s+cart\s*=/);
|
||||
```
|
||||
|
||||
You should use the `new` keyword to instantiate a new `ShoppingCart` object.
|
||||
Du solltest das `new`-Schlüsselwort verwenden, um ein neues `ShoppingCart`-Objekt zu instanziieren.
|
||||
|
||||
```js
|
||||
assert.match(code, /new\s+ShoppingCart\s*\(\s*\)/);
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-33
|
||||
|
||||
# --description--
|
||||
|
||||
You need to get all of the `Add to cart` buttons that you added to the DOM earlier. Declare an `addToCartBtns` variable, and assign it the value of calling the `getElementsByClassName()` method on the `document` object, passing in the string `add-to-cart-btn`.
|
||||
Du musst alle `Add to cart`-Buttons, die du zuvor zum DOM hinzugefügt hast, abrufen. Deklariere eine `addToCartBtns`-Variable und weise ihr den Wert des Aufrufs der `getElementsByClassName()`-Methode auf dem `document`-Objekt zu, indem du den String `add-to-cart-btn` übergibst.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -9,7 +9,7 @@ dashedName: step-34
|
||||
|
||||
You need to iterate through the buttons in your `addToCartBtns` variable. However, `.getElementsByClassName()` returns a Collection, which does not have a `forEach` method.
|
||||
|
||||
Use the spread operator on the `addToCartBtns` variable to convert it into an array. Then, use the `forEach` method to iterate through the array. Do not pass a callback function yet.
|
||||
Use the spread operator on the `addToCartBtns` variable to convert it into an array. Then, use the `forEach` method to iterate through the array. Übergib noch keine Callback-Funktion.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -9,7 +9,7 @@ dashedName: step-36
|
||||
|
||||
In your event listener callback, call the `.addItem()` method of your `cart` object, and pass in the `event.target.id`. Remember that the `id` here will be a string, so you need to convert it to a number.
|
||||
|
||||
Pass your `products` array as the second argument.
|
||||
Übergib dein `products`-Array als zweites Argument.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+3
-3
@@ -7,9 +7,9 @@ dashedName: step-41
|
||||
|
||||
# --description--
|
||||
|
||||
You need a way to access the total number of items in the cart. The best way to do this is to add another method to your `ShoppingCart` class, rather than accessing the `items` array directly.
|
||||
Du brauchst eine Lösung, um auf die Gesamtzahl der Artikel im Einkaufswagen zuzugreifen. Der beste Weg, dies zu tun, ist, eine weitere Methode zu deiner `ShoppingCart`-Klasse hinzuzufügen, anstatt direkt auf das `items`-Array zuzugreifen.
|
||||
|
||||
Add a `getCounts` method to the `ShoppingCart` class. Sie sollte die Anzahl der Elemente im `items`-Array zurückgeben.
|
||||
Füge der `ShoppingCart`-Klasse eine `getCounts`-Methode hinzu. Sie sollte die Anzahl der Elemente im `items`-Array zurückgeben.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -19,7 +19,7 @@ Deine `ShoppingCart`-Klasse sollte eine `getCounts`-Methode haben.
|
||||
assert.isFunction(cart.getCounts);
|
||||
```
|
||||
|
||||
Remember to use the `this` keyword to access the `items` array.
|
||||
Denke daran, das `this`-Schlüsselwort zu verwenden, um auf das `items`-Array zuzugreifen.
|
||||
|
||||
```js
|
||||
const afterCounts = code.split('getCounts')[1];
|
||||
|
||||
+2
-2
@@ -7,7 +7,7 @@ dashedName: step-42
|
||||
|
||||
# --description--
|
||||
|
||||
Now you can update the total number of items on the webpage. Assign the value of your `cart` object's `.getCounts()` method to the `textContent` of the `totalNumberOfItems` variable.
|
||||
Jetzt kannst du die Gesamtzahl der Artikel auf der Website aktualisieren. Weise den Wert der `.getCounts()`-Methode deines `cart`-Objekts dem `textContent` der `totalNumberOfItems`-Variable zu.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -17,7 +17,7 @@ Greife auf die `textContent`-Eigenschaft der `totalNumberOfItems`-Variablen zu.
|
||||
assert.match(code, /totalNumberOfItems\s*\.\s*textContent/)
|
||||
```
|
||||
|
||||
You should assign the value of your `cart` object's `.getCounts()` method to the `textContent` property of the `totalNumberOfItems` variable.
|
||||
Der Wert der `.getCounts()`-Methode deines `cart`-Objekts sollte der `textContent`-Eigenschaft der `totalNumberOfItems`-Variablen zugewiesen werden.
|
||||
|
||||
```js
|
||||
assert.match(code, /totalNumberOfItems\s*\.\s*textContent\s*=\s*cart\s*\.\s*getCounts\(\s*\)/)
|
||||
|
||||
+4
-4
@@ -7,11 +7,11 @@ dashedName: step-43
|
||||
|
||||
# --description--
|
||||
|
||||
You also need to update the total price of the cart when the user adds an item. Create a `calculateTotal` method in the `ShoppingCart` class.
|
||||
Außerdem musst du den Gesamtpreis des Einkaufswagens aktualisieren, wenn der Nutzer einen Artikel hinzufügt. Erstelle eine `calculateTotal`-Methode in der `ShoppingCart`-Klasse.
|
||||
|
||||
In that method, declare a `subTotal` variable and use the `reduce` method on the `items` array to calculate the sum of the `price` property of each item in the array. Use `total` and `item` as the parameters for your callback.
|
||||
In that method, declare a `subTotal` variable and use the `reduce` method on the `items` array to calculate the sum of the `price` property of each item in the array. Verwende `total` und `item` als Parameter für deinen Callback.
|
||||
|
||||
Remember to set your initial value in the `reduce` method.
|
||||
Denke daran, deinen Anfangswert in der `reduce`-Methode festzulegen.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -42,7 +42,7 @@ const afterCalculateTotal = code.split('calculateTotal')[1];
|
||||
assert.match(afterCalculateTotal, /\(\s*total\s*,\s*item\s*\)\s*=>/);
|
||||
```
|
||||
|
||||
Your `reduce` callback should return the sum of `total` and `item.price`. Use an implicit return.
|
||||
Your `reduce` callback should return the sum of `total` and `item.price`. Verwende eine implizite Rückgabe.
|
||||
|
||||
```js
|
||||
const afterCalculateTotal = code.split('calculateTotal')[1];
|
||||
|
||||
+2
-2
@@ -7,7 +7,7 @@ dashedName: step-44
|
||||
|
||||
# --description--
|
||||
|
||||
Part of the total cost will include the tax, so you need to calculate that as well. Create a `calculateTaxes` method in the `ShoppingCart` class. This method should take an `amount` parameter.
|
||||
Part of the total cost will include the tax, so you need to calculate that as well. Erstelle eine `calculateTaxes`-Methode in der `ShoppingCart`-Klasse. This method should take an `amount` parameter.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -17,7 +17,7 @@ Du solltest eine `calculateTaxes`-Methode in der `ShoppingCart`-Klasse erstellen
|
||||
assert.isFunction(cart.calculateTaxes);
|
||||
```
|
||||
|
||||
Your `calculateTaxes` method should take an `amount` parameter.
|
||||
Deine `calculateTaxes`-Methode sollte einen `amount`-Parameter verwenden.
|
||||
|
||||
```js
|
||||
assert.match(cart.calculateTaxes.toString(), /\(\s*amount\s*\)/);
|
||||
|
||||
+3
-3
@@ -13,7 +13,7 @@ For clarity, wrap the `taxRate / 100` calculation in parentheses.
|
||||
|
||||
# --hints--
|
||||
|
||||
Du solltest die `taxRate` in deiner `calculateTaxes`-Methode durch 100 teilen. Remember to use the `this` keyword.
|
||||
Du solltest die `taxRate` in deiner `calculateTaxes`-Methode durch 100 teilen. Denke daran, das `this`-Schlüsselwort zu verwenden.
|
||||
|
||||
```js
|
||||
const afterCalculateTaxes = code.split('calculateTaxes')[1];
|
||||
@@ -27,14 +27,14 @@ const afterCalculateTaxes = code.split('calculateTaxes')[1];
|
||||
assert.match(afterCalculateTaxes, /\(\s*this\s*\.\s*taxRate\s*\/\s*100\s*\)/);
|
||||
```
|
||||
|
||||
You should multiply the `amount` parameter by the `taxRate` divided by 100 in your `calculateTaxes` method.
|
||||
Du solltest den `amount`-Parameter mit `taxRate`, geteilt durch 100 in deiner `calculateTaxes`-Methode multiplizieren.
|
||||
|
||||
```js
|
||||
const afterCalculateTaxes = code.split('calculateTaxes')[1];
|
||||
assert.match(afterCalculateTaxes, /amount\s*\*\s*\(\s*this\s*\.\s*taxRate\s*\/\s*100\s*\)|\(\s*this\s*\.\s*taxRate\s*\/\s*100\s*\)\s*\*\s*amount/);
|
||||
```
|
||||
|
||||
Your `calculateTaxes` method should return the value of the `taxRate` (divided by 100, to convert it to a percent) multiplied by the `amount` parameter.
|
||||
Deine `calculateTaxes`-Methode sollte den Wert von `taxRate` zurückgeben (geteilt durch 100, um ihn in eine Prozentzahl umzuwandeln), multipliziert mit dem `amount`-Parameter.
|
||||
|
||||
```js
|
||||
console.log(cart.calculateTaxes(10), (cart.taxRate / 100) * 10);
|
||||
|
||||
+3
-3
@@ -7,9 +7,9 @@ dashedName: step-46
|
||||
|
||||
# --description--
|
||||
|
||||
Because of the way computers store and work with numbers, calculations involving decimal numbers can result in some strange behavior. For example, `0.1 + 0.2` is not equal to `0.3`. This is because computers store decimal numbers as binary fractions, and some binary fractions cannot be represented exactly as decimal fractions.
|
||||
Because of the way computers store and work with numbers, calculations involving decimal numbers can result in some strange behavior. Zum Beispiel ist `0.1 + 0.2` nicht gleich `0.3`. This is because computers store decimal numbers as binary fractions, and some binary fractions cannot be represented exactly as decimal fractions.
|
||||
|
||||
We want to clean up the number result from your calculation. Wrap your calculation in parentheses (don't include the `return` statement!) and call the `.toFixed()` method on it. Pass the `.toFixed()` method the number `2` as an argument. This will round the number to two decimal places and return a string.
|
||||
We want to clean up the number result from your calculation. Wrap your calculation in parentheses (don't include the `return` statement!) and call the `.toFixed()` method on it. Übergib der `.toFixed()`-Methode die Zahl `2` als Argument. Dies rundet die Zahl auf zwei Dezimalstellen ab und gibt einen String zurück.
|
||||
|
||||
# --hints--
|
||||
|
||||
@@ -20,7 +20,7 @@ const afterCalculateTaxes = code.split('calculateTaxes')[1];
|
||||
assert.match(afterCalculateTaxes, /return\s*\(\s*\(\s*this\s*\.\s*taxRate\s*\/\s*100\s*\)\s*\*\s*amount\s*\)/)
|
||||
```
|
||||
|
||||
You should call the `.toFixed()` method on your calculation.
|
||||
Du solltest die `.toFixed()`-Methode für deine Berechnung aufrufen.
|
||||
|
||||
```js
|
||||
const afterCalculateTaxes = code.split('calculateTaxes')[1];
|
||||
|
||||
+2
-2
@@ -7,9 +7,9 @@ dashedName: step-47
|
||||
|
||||
# --description--
|
||||
|
||||
The issue with `.toFixed()` returning a string is that you want to be able to perform calculations with the tax rate. To fix this, you can pass the `.toFixed()` call (including the calculation) to the `parseFloat()` function. This will convert the fixed string back into a number, preserving the existing decimal places.
|
||||
The issue with `.toFixed()` returning a string is that you want to be able to perform calculations with the tax rate. Um dies zu beheben, kannst du den `.toFixed()`-Aufruf (einschließlich der Berechnung) an die `parseFloat()`-Funktion übergeben. This will convert the fixed string back into a number, preserving the existing decimal places.
|
||||
|
||||
Pass your `.toFixed()` call to `parseFloat()`.
|
||||
Übergib deinen `.toFixed()`-Aufruf an `parseFloat()`.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-37
|
||||
|
||||
# --description--
|
||||
|
||||
Your cart currently isn't visible on the webpage. To make it visible, start by adding an event listener to the `cartBtn` variable, listening for the click event. The callback does not need any parameters.
|
||||
Dein Einkaufswagen ist derzeit nicht auf der Website sichtbar. To make it visible, start by adding an event listener to the `cartBtn` variable, listening for the click event. Der Callback benötigt keine Parameter.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
+1
-1
@@ -23,7 +23,7 @@ You should use ternary syntax to check if `isCartShowing` is true.
|
||||
assert.match(code, /showHideCartSpan\s*\.\s*textContent\s*=\s*isCartShowing\s*\?\s*/)
|
||||
```
|
||||
|
||||
You should set the `textContent` of the `showHideCartSpan` variable to `Hide` if `isCartShowing` is true.
|
||||
Du solltest den `textContent` der `showHideCartSpan`-Variable auf `Hide` setzen, wenn `isCartShowing` wahr (true) ist.
|
||||
|
||||
```js
|
||||
assert.match(code, /showHideCartSpan\s*\.\s*textContent\s*=\s*isCartShowing\s*\?\s*('|"|`)Hide\1\s*:\s*/)
|
||||
|
||||
+2
-2
@@ -11,13 +11,13 @@ Update the `total` value to be the sum of the `subTotal` and `tax` values.
|
||||
|
||||
# --hints--
|
||||
|
||||
Du solltest den `total`-Wert aktualisieren. Remember to use the `this` keyword.
|
||||
Du solltest den `total`-Wert aktualisieren. Denke daran, das `this`-Schlüsselwort zu verwenden.
|
||||
|
||||
```js
|
||||
assert.match(cart.calculateTotal.toString(), /this\.total/);
|
||||
```
|
||||
|
||||
You should set the `total` value to be the sum of the `subTotal` and `tax` values.
|
||||
Du solltest den `total`-Wert so einstellen, dass er die Summe der `subTotal`- und `tax`-Werte ergibt.
|
||||
|
||||
```js
|
||||
assert.match(cart.calculateTotal.toString(), /this\.total\s*=\s*(subTotal\s*\+\s*tax|tax\s*\+\s*subTotal)/);
|
||||
|
||||
+1
-1
@@ -7,7 +7,7 @@ dashedName: step-51
|
||||
|
||||
# --description--
|
||||
|
||||
Following the same pattern as your `cartSubTotal`, update the `cartTaxes` to display the `tax` value, and your `cartTotal` to display the `total` property.
|
||||
Nach dem gleichen Muster wie bei `cartSubTotal` aktualisierst du `cartTaxes`, um den `tax`-Wert anzuzeigen, und `cartTotal`, um die `total`-Eigenschaft anzuzeigen.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user