In this experience, you will explore functional programming concepts in Typescript. Before starting:
To play around with functional programming in Typescript, we will use the Typescript Playground. In the playground, you can write Typescript code and see the resulting JavaScript code. You can also run the code and see the output in the console.
Use forEach to implement a function called helloEveryone that accepts a list of objects and prints out “Hello” followed by the object to the console.
helloEveryone(["joe", "mary"]);
// prints to console:
// Hello joe
// Hello mary
Use map to implement a function called addFive that accepts a list of numbers and returns that list of numbers incremented by five.
addFive([1, 2, 3, 4, 5]);
// [6, 7, 8, 9, 10]
Use reduce to implement a function called concat that accepts a list of strings and returns a single string that is the concatenation of that list.
concat(["1", "2", "3"]);
// "123"
Use find to implement a function called longString that accepts a list of strings and returns the first string that is longer than 10 characters.
longString(["1", "2", "3000000000000000", "44444444444444444444444"]);
// "3000000000000000"
Use filter to implement a function called longStrings that accepts a list of strings and returns all the strings that are longer than 10 characters.
longStrings(["1", "2", "3000000000000000", "44444444444444444444444"]);
// ["3000000000000000", "44444444444444444444444"]
Use includes to implement a function called hasFoo that accepts a list of strings and returns true if there is at least one occurrence of “Foo” in the list.
hasFoo(["1", "2", "3000000000000000", "44444444444444444444444", "Foo"]);
// true
Use every to implement a function called allBig that accepts a list of BigObjects and returns true if the value of every num field in the list is greater than 100.
type BigObject = {num: number, name?: string};
allBig([{num: 101}, {num: 1000, name: "Roy"} ]);
// true
Use map to get the fish names and Array.from(new Set(arr))
to implement a function called fishNames that accepts a list of objects and returns a list of the values of the fish field with duplicates removed. Hint: you can use a Set to remove duplicates.
type FishObject = {fish: string, num: number};
fishNames([{fish: "Ahi", num: 100}, {fish: "Ahi", num: 10000}, {fish: "Opah", num: 800}, {fish: "Opah", num: 350} ]);
// ["Ahi", "Opah"]
Use sort to implement a function called mostFishList that accepts a list of objects and returns a new list in which the objects are ordered by the num field. Hint: Consider using the spread ...
operator or .slice()
to copy the array.
mostFishList([{fish: "Ahi", num: 100}, {fish: "Ahi", num: 10000}, {fish: "Opah", num: 800}, {fish: "Opah", num: 350}]);
// [{fish: "Ahi", num: 100}, {fish: "Opah", num: 350}, {fish: "Opah", num: 800}, {fish: "Ahi", num: 10000}]
Use map and reduce to implement a function called numFish that accepts a list of objects containing fish data, plucks the values of the num field, then reduces that list of fish numbers to return the total number of fish.
numFish([{fish: "Ahi", num: 100}, {fish: "Ahi", num: 10000}, {fish: "Opah", num: 800}, {fish: "Opah", num: 350}]);
// 11250
Use reduce to implement a function called fishGroups that accepts a list of objects and returns an object in which the original objects are now grouped by fish name.
fishGroups([{fish: "Ahi", num: 100}, {fish: "Ahi", num: 10000}, {fish: "Opah", num: 800}, {fish: "Opah", num: 350}]);
// {"Ahi": [{fish: "Ahi", num: 100}, {fish: "Ahi", num: 10000}], "Opah": [{fish: "Opah", num: 800}, {fish: "Opah", num: 350}]}
Hint You might want to create a function groupBy
that takes an array of any and a key and returns an object where the keys are the values of the key field and the values are lists of objects with that key value.
function groupBy(data: any[], key: string) {
return data.reduce((result:any, currentValue:any) => {
(result[currentValue[key]] = result[currentValue[key]] || []).push(currentValue);
return result;
}, {});
}
You will not submit anything for this experience. It’s just a warmup to get you comfortable using functional programming. That doesn’t make this an “optional” assignment: if you skip this one, you will find the other assignments significantly more difficult!