Skip to content

[BER-WDFT-JAN2023] Joy Huang #4065

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 6 commits into
base: master
Choose a base branch
from
Open

[BER-WDFT-JAN2023] Joy Huang #4065

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
bb3fd3c
feat: update instructions
ross-u Oct 30, 2023
fa0fc81
feat: update tests
ross-u Oct 30, 2023
568c61d
feat: update starter code
ross-u Oct 30, 2023
541bbb3
feat: remove bonus iterations
ross-u Nov 14, 2023
b76d80a
solve lab 1
TinyjoyTW Jan 11, 2024
c57759e
combine this lab 2 with lab 1 due to forking issue.
TinyjoyTW Jan 11, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
253 changes: 65 additions & 188 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,15 +11,13 @@

Upon completion of this exercise, you will be able to:

- Run predefined tests in Jasmine to verify that the program meets the technical requirements.
- Run predefined tests in Jasmine to check that the JavaScript program meets the technical requirements.
- Identify expected code behavior by reading and understanding test results and errors.
- Declare and invoke functions using function declaration, function expression, and arrow function syntax.
- Use the `return` keyword to return a value from a function.
- Pass primitive values as arguments to functions.
- Pass arrays to functions as arguments.
- Access items stored in arrays using the indexes,
- Add, remove and check for items in an array using the index and array methods (`unshift`, `push`, `splice`, `shift`, `pop`, `indexOf`, and `includes`).
- Iterate over arrays using the `for` and `forEach` loops.
- Create and invoke functions in JavaScript.
- Pass arrays and primitive values as arguments to functions.
- Use the `return` keyword to return a value from a function.
- Access, add, remove, and check for items in an array using the index and array methods (`unshift`, `push`, `splice`, `shift`, `pop`, `indexOf`, and `includes`).
- Use conditional statements and loops in a function.

<br>
<hr>
Expand All @@ -31,6 +29,8 @@
Array manipulation is a common task in programming. Whether you are calculating a total for a shopping cart, grabbing only the first names from a list of people, or moving a piece on a chessboard, you are probably modifying or manipulating an array somewhere in the code.
<br>



## Requirements

- Fork this repo
Expand All @@ -46,7 +46,9 @@ git commit -m "Solved lab"
git push origin master
```

- Create a Pull Request so that your TAs can check your work.
- Create a Pull Request and submit your assignment.



## Automated Testing Introduction

Expand All @@ -56,49 +58,72 @@ Automated software testing is the process of programmatically executing an appli

Testing should be viewed as a continuous process, not a discrete operation or single activity in the development lifecycle. Designing tests at the beginning of the product lifecycle can mitigate common issues that arise when developing complex code bases.

Having a strong *test suite* can provide you the ease of mind since you will be able to confidently improve upon your work while knowing that your not breaking a previously developed feature.
Having a strong *test suite* can provide you with ease of mind since you will be able to confidently improve upon your work while knowing that your not breaking a previously developed feature.
<br>



### Testing labs

This LAB and some labs you will work on during the bootcamp are equipped with unit tests to provide automated feedback on your lab progress.
This lab and some labs you will work on during the bootcamp are equipped with unit tests to provide automated feedback on your lab progress.
<br>



### Testing with Jasmine

Jasmine is an automated testing framework for JavaScript. It is designed to be used in Behavior-driven Development (**BDD**) programming, focusing more on the business value than the technical details.

We have already included Jasmine in the project you just forked, so let's see how to use it to implement our code.
<br>



### Usage

Before starting coding, we will explain the project structure we have provided you:

```
lab-js-functions-and-arrays
├── README.md
│
├── SpecRunner.html
├── jasmine
│
├── jasmine/
│ └── ...
├── src
│
├── src/
│ └── functions-and-arrays.js
└── tests
│
└── tests/
└── functions-and-arrays.spec.js
```

We will be working with the `src/functions-and-arrays.js`. You can find all the files in the `jasmine` folder needed to use Jasmine. All these files are already linked with the `SpecRunner.html` file.
All the needed Jasmine testing library files from the `jasmine/` folder are already linked with `SpecRunner.html` and everything is set up for you to start coding.

<br>



If you want to check the tests, they are in the `tests/functions-and-arrays.spec.js` file.
You should write your code and do all the work in the `src/functions-and-arrays.js` file.

If you want to check the tests, they are located in the `tests/` folder in the file `tests/functions-and-arrays.spec.js` file.



<br>


#### Run tests

Running automated tests with Jasmine is super easy. All you need to do is open the `SpecRunner.html` file in your browser. You will find something similar to this:
Running automated tests with Jasmine is super easy. All you need to do is open the `SpecRunner.html` file in your browser using the [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer) VSCode extension. You should see something similar to this:



[![image](https://user-images.githubusercontent.com/23629340/33389609-c2f3965c-d533-11e7-9a03-e0a89314dd98.png)](https://user-images.githubusercontent.com/23629340/33389609-c2f3965c-d533-11e7-9a03-e0a89314dd98.png)



#### Pass the tests

You should write your code on the `src/functions-and-arrays.js` file. While following the instructions for each iteration, you should check every test and ensure it's *passing*, before moving on.
Expand All @@ -111,33 +136,39 @@ To see the output of your JavaScript code, open the [Console in the Developer To

**Important:** Note that **you don't need to execute the functions yourself**; the tests will automatically load and execute the functions on each test run. All you need to do is declare the functions, ensure they handle the parameters passed and return what is indicated in the iteration instructions and the test description. We provide you with a sample array for some iterations, so you can do some **manual** testing if you wish.

<br>



## Instructions

While following the instructions for each iteration, carefully read the instructions and test descriptions to understand the task requirements fully. Do not rush. It would be best if you took your time to read every iteration carefully.

<br>

### Iteration #1: Find the maximum
### Iteration 1 | Find the Maximum

Implement the function `maxOfTwoNumbers` that takes two numbers as arguments and returns the bigger number.

<br>

### Iteration #2: Find the longest word


### Iteration 2 | Find the Longest Word

Implement the function `findLongestWord` that takes as an argument an array of words and returns the longest one. If there are 2 with the same length, it should return the first occurrence.

You can use the following array to test your solution:

```javascript
const words = ['mystery', 'brother', 'aviator', 'crocodile', 'pearl', 'orchard', 'crackpot'];
const words = ["mystery", "brother", "aviator", "crocodile", "pearl", "orchard", "crackpot"];
```

<br>

### Iteration #3: Calculate the sum

#### Iteration #3.1: Sum numbers

### Iteration 3 | Sum Numbers

Calculating a sum can be as simple as iterating over an array and adding each of the elements together.

Expand All @@ -151,31 +182,9 @@ const numbers = [6, 12, 1, 18, 13, 16, 2, 1, 8, 10];

<br>

#### Bonus - Iteration #3.2: A generic `sum()` function

In iteration 3, you created a function that returns the sum of an array of numbers. But what if we want to calculate the sum of the length of words in an array? What if it also includes _boolean_ values? To achieve this, we must create a function allowing this flexibility.

You should implement the function `sum()` in this iteration. The function should take an array of mixed values - numbers, strings, and booleans. The function should add all the string lengths, numeric values, and numeric values of booleans to the total sum and return the sum.

You can use the following array to test your solution:

```javascript
const mixedArr = [6, 12, 'miami', 1, true, 'barca', '200', 'lisboa', 8, 10];

// should return: 57
```


Note: Your function should only accept an array with numbers, strings, or booleans. If the array contains any other data type, such as an object, you should [throw an error](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/throw). In JavaScript, the syntax for throwing an error is as follows:
```javascript
throw new Error("Error message goes here");
```

When specifying the error message, you should be specific and descriptive in explaining the error.

<br>

### Iteration #4: Calculate the average
### Iteration 4 | Numbers Average

Calculating an average is a prevalent task. So let's practice it a bit.

Expand All @@ -186,176 +195,43 @@ Calculating an average is a prevalent task. So let's practice it a bit.

<br>

#### Iteration #4.1: Array of numbers

Implement the function `averageNumbers` that expects an array of numbers and returns the average of the numbers.

You can use the following array to test your solution:

```javascript
const numbers = [2, 6, 9, 10, 7, 4, 1, 9];
```
<br>

#### Iteration #4.2: Array of strings

Implement the function named `averageWordLength` that receives as a single argument an array of words and returns the average length of the words:
Implement the function `averageNumbers` that expects an array of numbers and returns the average of the numbers.

You can use the following array to test your solution:

```javascript
const words = ['seat', 'correspond', 'linen', 'motif', 'hole', 'smell', 'smart', 'chaos', 'fuel', 'palace'];
const numbers2 = [2, 6, 9, 10, 7, 4, 1, 9];
```

<br>

#### Bonus - Iteration #4.3: A generic `avg()` function

Create function `avg(arr)` that receives any mixed array and calculates the average. For example, consider an array filled with numbers and/or strings and/or booleans as a mixed array.

The non-numerical values should be counted as follows:

- Booleans: `true` counts as `1` and `false` counts as `0`.
- Strings: use the string `length` as the numeric value.

```javascript
const mixedArr = [6, 12, 'miami', 1, true, 'barca', '200', 'lisboa', 8, 10];

// should return: 5.7
```

<br>

### Iteration #5: Unique arrays

Take the following array, remove the duplicates, and return a new array. You are more than likely going to want to check out the Array methods [`indexOf`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf) and [`includes`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes).

Do this in the form of a function `uniquifyArray` that receives an array of words as an argument.



You can use the following array to test your solution:

```javascript
const words = [
'crab',
'poison',
'contagious',
'simple',
'bring',
'sharp',
'playground',
'poison',
'communion',
'simple',
'bring'
];
```

<br>

### Iteration #6: Find elements
### Iteration 5 | Find Element

Let's create a simple array search.

Declare a function named `doesWordExist` that will take in an array of words as one argument and a *word to search* for as the other. Return `true` if the word exists in the array; otherwise, return `false`.

You can use the following array to test your solution:

```javascript
const words = ['machine', 'subset', 'trouble', 'starting', 'matter', 'eating', 'truth', 'disobedience'];
```

Declare a function named `doesWordExist` that will take in an *array of words* as one argument and a *word to search* for as the other. Return `true` if the word exists in the array; otherwise, return `false`.
<br>

### Iteration #7: Count repetition
The function should return `null` if an empty array is passed as an argument.

Declare a function named `howManyTimes` that will take in an array of words as the first argument and a word to search for as the second argument. The function will return the number of times that word appears in the array.

You can use the following array to test your solution:

```javascript
const words = [
'machine',
'matter',
'subset',
'trouble',
'starting',
'matter',
'eating',
'matter',
'truth',
'disobedience',
'matter'
];
```

<br>



### Bonus - Iteration #8



#### Bonus - Iteration #8.1: Product of adjacent numbers

Given multiple arrays, find the greatest product of four adjacent numbers.

We consider adjacent any four numbers that are next to each other horizontally or vertically. For example, if we have a 5x5 Matrix like:

```bash
[ 1, 2, 3, 4, 5]
[ 1, 20, 3, 4, 5]
[ 1, 20, 3, 4, 5]
[ 1, 20, 3, 4, 5]
[ 1, 4, 3, 4, 5]
```

The greatest product will be the `20`x`20`x`20`x`4` = `32000`.

<br>



Declare a function named `greatestProduct(matrix)` to find it in the 20×20 grid below!
You can use the following array to test your solution:

```javascript
const matrix = [
[08, 02, 22, 97, 38, 15, 00, 40, 00, 75, 04, 05, 07, 78, 52, 12, 50, 77, 91, 08],
[49, 49, 99, 40, 17, 81, 18, 57, 60, 87, 17, 40, 98, 43, 69, 48, 04, 56, 62, 00],
[81, 49, 31, 73, 55, 79, 14, 29, 93, 71, 40, 67, 53, 88, 30, 03, 49, 13, 36, 65],
[52, 70, 95, 23, 04, 60, 11, 42, 69, 24, 68, 56, 01, 32, 56, 71, 37, 02, 36, 91],
[22, 31, 16, 71, 51, 67, 63, 89, 41, 92, 36, 54, 22, 40, 40, 28, 66, 33, 13, 80],
[24, 47, 32, 60, 99, 03, 45, 02, 44, 75, 33, 53, 78, 36, 84, 20, 35, 17, 12, 50],
[32, 98, 81, 28, 64, 23, 67, 10, 26, 38, 40, 67, 59, 54, 70, 66, 18, 38, 64, 70],
[67, 26, 20, 68, 02, 62, 12, 20, 95, 63, 94, 39, 63, 08, 40, 91, 66, 49, 94, 21],
[24, 55, 58, 05, 66, 73, 99, 26, 97, 17, 78, 78, 96, 83, 14, 88, 34, 89, 63, 72],
[21, 36, 23, 09, 75, 00, 76, 44, 20, 45, 35, 14, 00, 61, 33, 97, 34, 31, 33, 95],
[78, 17, 53, 28, 22, 75, 31, 67, 15, 94, 03, 80, 04, 62, 16, 14, 09, 53, 56, 92],
[16, 39, 05, 42, 96, 35, 31, 47, 55, 58, 88, 24, 00, 17, 54, 24, 36, 29, 85, 57],
[86, 56, 00, 48, 35, 71, 89, 07, 05, 44, 44, 37, 44, 60, 21, 58, 51, 54, 17, 58],
[19, 80, 81, 68, 05, 94, 47, 69, 28, 73, 92, 13, 86, 52, 17, 77, 04, 89, 55, 40],
[04, 52, 08, 83, 97, 35, 99, 16, 07, 97, 57, 32, 16, 26, 26, 79, 33, 27, 98, 66],
[88, 36, 68, 87, 57, 62, 20, 72, 03, 46, 33, 67, 46, 55, 12, 32, 63, 93, 53, 69],
[04, 42, 16, 73, 38, 25, 39, 11, 24, 94, 72, 18, 08, 46, 29, 32, 40, 62, 76, 36],
[20, 69, 36, 41, 72, 30, 23, 88, 34, 62, 99, 69, 82, 67, 59, 85, 74, 04, 36, 16],
[20, 73, 35, 29, 78, 31, 90, 01, 74, 31, 49, 71, 48, 86, 81, 16, 23, 57, 05, 54],
[01, 70, 54, 71, 83, 51, 54, 69, 16, 92, 33, 48, 61, 43, 52, 01, 89, 19, 67, 48]
];
const words2 = ["machine", "subset", "trouble", "starting", "matter", "eating", "truth", "disobedience"];
```

<br>



#### Bonus - Iteration #8.2: Product of diagonals
**Happy coding!** :blue_heart:

Following the logic you've used in iteration #8.1, declare a function called `greatestProductOfDiagonals(matrix)`. It takes a matrix as a parameter and returns the greatest product of any four values laid out diagonally, in either direction.

<br>

**Happy coding!** :heart:

<br>

Expand Down Expand Up @@ -537,10 +413,11 @@ Following the logic you've used in iteration #8.1, declare a function called `gr
</details>

<details>
<summary>How can I compare the length of each word in an array in JavaScript?</summary>
<summary>How can I compare the length of each string in an array in JavaScript?</summary>
<br>

To compare the length of each word in an array in JavaScript, you can use a loop to iterate through the array and compare the length of each element using the `.length` property.

To compare the length of each string in an array in JavaScript, you can use a loop to iterate through the array and compare the length of each string using the `.length` property.

Here is an example of how you loop over an array:

Expand Down
Loading