Someone give me an example of a functional programming based API vs an OOP based API
I have an assignment and I need to make an API but not sure what my project should look like.
You can see it right here
The project isnt suppose to use ReST API
I was just going to make an object with various methods then call. eg. (new Checkout).scan_item() Last time I did the assignment I only used functions.
My project feels messy and I’m not sure how to structure it.
In terms of an API, generally:
OO: locate the data and the operations on that data in the same place (an object, natch):
class Checkout {
constructor(items = []) {
this.items = items;
}
// Or, with class fields, just
// items = []
// rather than the constructor
scanItem(item) {
this.items.push(item);
}
};
checkout = new Checkout()
checkout.scanItem("foo");
Functional: the data and the functions that operate on it should be separate:
const items = [];
function scanItem(items, item) {
return [item, ...items];
}
scanItem(items, "foo");
Note that an OO approach to create individual items coupled with a functional approach to process those resultant objects would be useful
Your example in the FP would always return an array with one single item. So this example is plain wrong.
How do you figure that? items could contain one item, or ten, or a million, and the function would always return items with an extra item. It has none there, in the example, but the example wouldn’t run if items wasn’t defined. But you don’t hardcode data as an empty list in every application you write:
You call scanItem(items, "foo");, but don’t anything with the returned array. So the items array is never updated. Was what I was meant to say, derp.
return [item, ...items];
Returns a new array with item prepended onto the original items array, why would that be an issue? Running the function always gives me an updated array, it works as expected, I never want to mutate the original array. I can’t specify what would be done, it’s an example, same as the OOP version, nothing happens because it’s not a real application
Normal FP
I have some data -> I apply a function to the data -> I get updated data
As opposed to normal OOP
I have data -> I apply a function attached to that data that modifies it
In your OOP example you update the items at line 2 in your class, it is updated. You don’t update the const items in the FP example at line 1 so the examples do not reflect each other.
Shouldn’t this be this.items and need a constructor method? Maybe something has changed I am unaware about?
No, you’re misunderstanding, OP asked for differences between OOP and from functional APIs. items doesn’t get mutated, the function returns a new array
Ah, same thing, was using the class properties syntax
Will be in this year, not ratified yet because it was changed to include private properties as well
Has that been implemented outside of Babel yet?
Chrome (+ all Chome-based/Android), Firefox, Opera. Safari and old Edge (which won’t get any more updates afaik) seem to be only outliers atm, mobile Safari obviously last major one
Edit: that’s just for public fields mind
I knew it was coming soon, but thought I missed something about its implementation since you had it in your code example.
I think it would have been in everywhere last year (or the year before) if they hadn’t faffed on with the private fields syntax for so long; I’m just used to it from React/Node (or otherwise always having Babel plugged in) so it’s kinda automatic – I’ll edit the example tho
But you are not showing a proper working example of a functional API. So your example is misleading to whoever comes across your answer. It would of been excellent if you were to provide a proper working example. You have redundant code at line 1 for example (const items).
Well here you go, this is the API:
function scanItem(items, item) {
return [item, ...items];
}
now it won’t work without, say, passing an empty array for items
The empty array variable and the function execution are literally just usage examples so that the code can be run as-is, I’m not sure what you’re getting at. It’s a functional API, I bring a function to the data, the data + function are not stored together in an object like in the OOP example. It adds an item to an array of items, same, but the data has to be passed into the function, and the function does not modify the data.
push isn’t the only way to add something to an array, there are multiple other methods to do so. For example the above function returns a new array with the new item at position 0 followed by all the items in the original array. Would you understand it better if it was written like this (here prepending item to new array)?
function scanItem(items, item) {
const itemsCopy = items.slice();
itemsCopy.unshift(item);
return itemsCopy;
}
Or same, but appending item to the new array:
function scanItem(items, item) {
const itemsCopy = [...items];
itemsCopy.push(item);
return itemsCopy;
}
Or, again, returning new array with item appended:
function scanItem(items, item) {
return items.concat(item);
}
The original array items that goes into the function does not get mutated, if items was an empty array to start with it will still be an empty array after the function runs, this is fine, it doesn’t need to change.
Excellent! A better explination from you, I’m happy with that. (Btw this isn’t for me, I know exactly what you are doing, but beginners WILL get confused by your example, if they read your latest post though it should make total sense!).