Live data from Hacker News

How Does React Tell a Class from a Function?

overreacted.io

11–20 of 142 posts

Re: How Does React Tell a Class from a Function?

#11
post #7

I've read at least two dozen explanations of prototypes that didn't offer 10% of the clarity of this post. And another brilliantly told story of how React does its work. Bravo.

I agree, this is the best explanation of JavScript's new/this/prototype/__proto__ I've seen yet. It was definitely worth the read.

Re: How Does React Tell a Class from a Function?

#14

TL;DR -- it uses `instanceof`

You probably need to continue reading the post :)

  > That’s not what React does though. 
  >
  > One caveat to the instanceof solution is that it doesn’t work when there are multiple copies of React on the page, and the component we’re checking inherits from another React copy’s React.Component.
Real TL;DR:

  > If you don’t extend React.Component, React won’t find isReactComponent on the prototype, and won’t treat component as a class.

Re: How Does React Tell a Class from a Function?

#16
post #15

So React added isReactComponent to Component class but the author doesn't explain why they couldn't just check for render() method. It works in this React-like library: https://github.com/wisercoder/uibuilder/blob/master/UIBuilde...

Someone else asked that same question on Reddit [0], and Dan pointed out the paragraph in the post that answers it :

> One other possible heuristic could be to check for presence of a render method on the prototype. However, at the time it wasn’t clear how the component API would evolve. Every check has a cost so we wouldn’t want to add more than one. This would also not work if render was defined as an instance method, such as with the class property syntax.

[0] https://www.reddit.com/r/reactjs/comments/a2j6xk/how_does_re...

Re: How Does React Tell a Class from a Function?

#17
I have written maybe 200 lines of JavaScript in my life, and this article has strongly reinforced my desire to never have to write a single one more. The next time someone asks me what the problem with JavaScript is, I will send them this article. "Scheme for the browser" what a joke.

Some excerpts for those that didn't have the strength to sit through the entire thing without pulling their hair out:

> If you called Person('Fred') without new, this inside it would point to something global and useless (for example, window or undefined). So our code would crash or do something silly like setting window.name.

> However, JavaScript also allows a function called with new to override the return value of new by returning some other object. Presumably, this was considered useful for patterns like pooling where we want to reuse instances:

> However, new also completely ignores a function’s return value if it’s not an object. If you return a string or a number, it’s like there was no return at all.

> And yet I still find it very confusing that a property called prototype does not give you a value’s prototype (for example, fred.prototype is undefined because fred is not a function). Personally, I think this is the biggest reason even experienced developers tend to misunderstand JavaScript prototypes.

> However, some class implementations we wanted to target did not copy static properties (or set the non-standard __proto__), so the flag was getting lost

Edit: And I missed the best/worst one yet: You can have MULTIPLE VERSIONS of the SAME DEPENDENCY running around in your codebase, interacting in ways that only god knows. In retrospect, this should have been obvious from the way javascript "imports" work, but, holy shit! If Satan himself had to design a language, he could not have done a better job. And I'm sure he would not have the stroke of genius required to make it the only programming language you can use if you want to target the most widely available platform for code in the world.

The next time I have to allow NoScript to let some js in, I will wonder how many goat sacrifices went into making the thing work.

Re: How Does React Tell a Class from a Function?

#18
post #17

I have written maybe 200 lines of JavaScript in my life, and this article has strongly reinforced my desire to never have to write a single one more. The next time someone asks me what the problem with JavaScript is, I will send them this article. "Scheme for the browser" what a joke. Some excerpts for those that didn't have the strength to sit through the entire thing without pulling their hair out: > If you called…

One of the points of the post was that you almost definitely don't need to worry about this yourself, especially if you're using React.

Re: How Does React Tell a Class from a Function?

#20
post #17

I have written maybe 200 lines of JavaScript in my life, and this article has strongly reinforced my desire to never have to write a single one more. The next time someone asks me what the problem with JavaScript is, I will send them this article. "Scheme for the browser" what a joke. Some excerpts for those that didn't have the strength to sit through the entire thing without pulling their hair out: > If you called…

You don't write js because you like, is because is a competitive advantage:

- Write in one language only for both client and server side. Why is good? You just need js devs, no need to duplicate validation and other logic. I'm making a game right now and has js on the backend. I want to make the game single player, now I can just import a file from the client side and > now is single player. If your backend is in java, good luck to make it single player.

- Compare a website to an installable app. Who is more likely to gain more customers all things being equal? If you click on a link from google, is more likely to browse a website rather than installing an app.

You could compile java to js, but is a nightmare to debug and you are far away from the real code. You will have a lot of issues.

There are more benefits of js of course.

Post reply on HN