const self = this

Народ, есть ли какой-нибудь способ НЕ создавать методы на каждом инстансе как сейчас все делают, а именно использовать методы из прототипа без потери контекста?

Народ, есть ли какой-нибудь способ НЕ создавать методы на каждом инстансе как сейчас все делают, а именно использовать методы из прототипа без потери контекста?

Подскажите, каррирование улучшает производительность или нет? Если делать вместо onClick={() => this.clickHandler(item) вот так: onClick={this.clickHandler(item)} а clickHandler собственно будет таким: clickHandler = item => () => { ... }

А в чем смысл?

И? Не понял.

Ну погугли

onClick={this.clickHandler} - правильно

Смысл в том чтобы не плодить миллион одноообразных методов. Для этого и было придумано ООП. Для этого и существует прототип и методы класса.

А ты хочешь наследование в компонентах?

Что погуглить?

Я хочу то что написал в вопросе.

Я твой вопрос не понимаю.

представь, что мапаюсь по массиву и мне нужно передавать item в this.clickHandler

а, понял. Я бы в твоем случае сделал бы еще компонент и в нем уже сделал onClick={this.clickHanlder} и item передавал бы пропсом в этот компонент. И в clickHandler уже можно было бы делать const {item} = props

Что конкретно не понятно?

это вообще не отвечает на вопрос, мне просто интересно, каррирование улучшает производительность за счет того, что в рендере не пересоздаются функции - или нет?

это вообще не отвечает на вопрос, мне просто интересно, каррирование улучшает производительность за счет того, что в рендере не пересоздаются функции - или нет?

это вообще не отвечает на вопрос, мне просто интересно, каррирование улучшает производительность за счет того, что в рендере не пересоздаются функции - или нет?

это вообще не отвечает на вопрос, мне просто интересно, каррирование улучшает производительность за счет того, что в рендере не пересоздаются функции - или нет?

Что значит создавать методы в каждом инстансе? Инстанс это результат new из класса или функции.

Это настолько незначительно, что не стоит даже выкраивать из этого перфоманс

юзал) решил webpack поюзать

Да. Всё верно. И когда создаётся компонент тоже вызывается new. Я не хочу использовать методы объявленные на инстансе, я хочу использовать методы объявленные на прототипе.

Но это и так методы из прототипа!!!

Это настолько незначительно, что не стоит даже выкраивать из этого перфоманс

Это настолько незначительно, что не стоит даже выкраивать из этого перфоманс

Но это и так методы из прототипа!!!

зачем тогда useCallback придумали? Потому, что реакт делает сравнение по ссылке и делает пере подключение слушателя.

Для мемоизации придумали. Это не значит что все подряд нужно мемоизировать

Кто какой роутер сейчас использует, желательно на хуках? А то react-router-dom до сих пор не добавили хук для withRouter + у него есть баг из-за которого компонент на хуках не может нормально ререндерится и приходится делать костыли вроде forceUpdate через useCallback

Но это и так методы из прототипа!!!

Этот хук есть в следующей версии. А пока можно с этим пожить.

Почему?

Потому что это избыточно и увеличивает кодовую базу без острой необходимости

Ты уверен, что неконсистентность и возможность накосячить лучше чем избыточность?

Больше кода = больше багов)

Нет

Но когда создается обьект из конструктора, все методы из prototype становятся доступными объекту же.

Там this будет неправильным, поэтому их байндят, то есть копируют в инстанс

Ну this будет привязан к объекту из которого вызывают метод. Что не так? Почему это не правильно?

Народ, есть ли какой-нибудь способ НЕ создавать методы на каждом инстансе как сейчас все делают, а именно использовать методы из прототипа без потери контекста?

Заблуждение.

Если в ребёнке нет метода, то он берётся из прототипа, собственно, при вызове. И this в таком методе будет на инстанс указывать.

Замечательно. Было бы ещё лучше если бы вы на вопрос ответили.

в любом случае вот статья как применять мемо-хуки: https://kentcdodds.com/blog/usememo-and-usecallback

Вопрос тогда не понятен, сорри

Вопрос о том что в реакте при существующем подходе мы плодим миллион однообразных методов привязанных к инстансу компонента, вместо того чтобы использовать один из прототипа.

Например? Что за однообразные методы?

О чём я и говорю: Ты уверен, что неконсистентность и возможность накосячить лучше чем избыточность?

я встречный вопрос задам. Покажите как вы передаёте в кнопку в onClick метод из прототипа.

Мемоизировать каждый обработчик или нет, тут ещё вопрос в каком случае косяк будет

Вопрос о том что в реакте при существующем подходе мы плодим миллион однообразных методов привязанных к инстансу компонента, вместо того чтобы использовать один из прототипа.

Такое ощущение что в этом чате 90 % не знают что такое прототипы

При существующем подходе в реакте не испольузт классы для начала

При существующем подходе в реакте не испольузт классы для начала

Интересно)) а вот когда я пишу class MyComponent extend Component {} это что?))

Интересно)) а вот когда я пишу class MyComponent extend Component {} это что?))

И какой косяк будет в случае мемоизации?

Например замыкание на старый стейт

[deps]

И? Что ты пытаешься доказать? Что нужно в useCallback пихать все подряд?)

Вопрос о том что в реакте при существующем подходе мы плодим миллион однообразных методов привязанных к инстансу компонента, вместо того чтобы использовать один из прототипа.

Ощущение, что ты не можешь нормально написать что ты хочешь и о чём говоришь. Как передаю? Беру и передаю. Если говорить о классах, то вариантов четыре штуки: constructor(){this.onClick = this.onClick.bind(this)} onClick(){} render(){ return <button onClick={this.onClick}/> } onClick(){} render(){ return <button onClick={this.onClick.bind(this)}/> } onClick(){} render(){ return <button onClick={()=>this.onClick()}/> } onClick = () => {} render(){ return <button onClick={this.onClick}/> } В чём вопрос?

Ощущение, что ты не можешь нормально написать что ты хочешь и о чём говоришь. Как передаю? Беру и передаю. Если говорить о классах, то вариантов четыре штуки: constructor(){this.onClick = this.onClick.bind(this)} onClick(){} render(){ return <button onClick={this.onClick}/> } onClick(){} render(){ return <button onClick={this.onClick.bind(this)}/> } onClick(){} render(){ return <button onClick={()=>this.onClick()}/> } onClick = () => {} render(){ return <button onClick={this.onClick}/> } В чём вопрос?