Skip to content
This repository has been archived by the owner. It is now read-only.

Arrow versus regular functions for functional components in React #397

Closed
WillowHQ opened this issue May 12, 2018 · 9 comments
Closed

Arrow versus regular functions for functional components in React #397

WillowHQ opened this issue May 12, 2018 · 9 comments

Comments

@WillowHQ
Copy link

@WillowHQ WillowHQ commented May 12, 2018

I am wondering why you use a regular functional expression for functional (is this still the correct term?) components in react.

@kentcdodds
Copy link
Owner

@kentcdodds kentcdodds commented May 14, 2018

Hi @WillowHQ!

I decided to answer this question via audio: https://www.briefs.fm/3-minutes-with-kent/64

Good luck!

@kentcdodds kentcdodds closed this May 14, 2018
@tamouse
Copy link

@tamouse tamouse commented May 19, 2018

These don't really work if audio doesn't work for one.

@kentcdodds
Copy link
Owner

@kentcdodds kentcdodds commented May 21, 2018

Sorry, what doesn't work about it?

@tamouse
Copy link

@tamouse tamouse commented May 21, 2018

When one is hard of hearing / deaf, nothing works about it.

@kentcdodds
Copy link
Owner

@kentcdodds kentcdodds commented May 21, 2018

Sorry @tamouse,
It's definitely less accessible (and for the hard of hearing/deaf it's entirely inaccessible). I'm really doing my best to freely give of my time to help answer people's questions and often it's easier to respond to people via my 3 minute podcast. It's not that I'm intentionally trying to be exclusionary. It's just that sometimes if I want to spend time with my family and answer people's questions, I have to do things the easier way. :-(

@WillowHQ
Copy link
Author

@WillowHQ WillowHQ commented May 21, 2018

@kentcdodds
Copy link
Owner

@kentcdodds kentcdodds commented May 21, 2018

Thank you @WillowHQ

@joeycozza
Copy link
Collaborator

@joeycozza joeycozza commented Dec 10, 2018

Side note: I left off the intro in the audio answer that introduces the question.

Audio Transcription:

Functional components is what the react docs call them. I really don't like the term, maybe I should pull request to the react docs. But functional components kind of conflates functional programming which... function components should probably emulate some of those principles like pure functions and stuff but it doesn't really, so yeah. I never use the term functional components, I think that's silly. I use "function components" a component that is a function. There are also "class components", components that are a class. So anyway, that aside, I do use and what I'm doing is not a function expression, I'm using a function declaration. So a function expression would be like const x = function x(){//whatever} and so that would be a function expression. Or like in a callback, that's a function expression if you inline a function in there. A function declaration would be like on a newline function x(){//whatever} that's a function declaration. The reason I do that is because it doesn't matter what order that appears in the module or the closure. It will be hoisted to the top of the closure and available anywhere. I like that feature. I have a blogpost called, "Newspaper Code Structure" I think, where I kind of leverage that with the way I structure my modules. I don't really do that as much anymore. I used to put all my exports up at the top of the file, or my return statement at the top and then function declarations below the return statement or below the export. But I've decide just to move everything like returns and exports down to the bottom of the closure. So anyway, I do still prefer functions most of the time. I'm starting to warm up to arrow functions cause then you don't have to have the return statement. But the nice thing about functions, like a function declaration, is that because you already have the body and the return statement, you can put console.logs in there easier you can refactor things a little easier. Anyways, it's not a huge deal to me, I don't really care what you do. But that is kind of why I do function declarations instead of arrow functions. Good luck!

@kentcdodds
Copy link
Owner

@kentcdodds kentcdodds commented Dec 10, 2018

Thanks @joeycozza!!

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
5 participants