@react_js - страница 1807 - Telegram web archive

Maxim

Китикет

Когда у меня в коде есть arr.forEach, мне достаточно ненапряжно воткнуть перед ним фильтр или мап. С циклом не так просто. Да и объявление констант для каждой итерации, да и вообще как по мне — циклы фу

Ну у меня такой ситуации ни разу не возникало)

Ivan

О, качественные микробенчмарки подъехали

Андрей

Эм... А вы правда в бенчмарки умеете?)

Андрей

Когда у меня в коде есть arr.forEach, мне достаточно ненапряжно воткнуть перед ним фильтр или мап. С циклом не так просто. Да и объявление констант для каждой итерации, да и вообще как по мне — циклы фу

Если честно, то я не могу придумать ситуации когда мне нужен был for/forEach без принудительного return посреди перебора.

Ivan

Если честно, то я не могу придумать ситуации когда мне нужен был for/forEach без принудительного return посреди перебора.

А я не могу вспомнить, когда мне вообще был нужен for/forEach Кек)

Андрей

А я не могу вспомнить, когда мне вообще был нужен for/forEach Кек)

for(...) { if (cond()) { return true; } } return false; :D

Андрей

Раз в пару месяцев подобное пишу.

Alexey

о, стоит упомянуть девочек, как сразу споры начинаются :) forEach хорошо, если везде функциональщина

artalar

не совсем понимаю смысла, в текущем компоненте нету пропсов, тоесть его бесмысленно рендерить, а если его родитель будет обернут в memo и будет рендер то компонент всеравно перерендериться хотя ему это не нужно

В родительском компоненте импортите дочерний, оборачивание в мемо (если нужно) и используете.

Ivan

Раз в пару месяцев подобное пишу.

Ну можно и перестать уже https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/some

Alexey

в общем это больше для ребят, которые бэк на скале пишут, а фронт заболел рамду в руки и поехали

Maxim

В родительском компоненте импортите дочерний, оборачивание в мемо (если нужно) и используете.

Это имеешь ввиду?

Китикет

о, стоит упомянуть девочек, как сразу споры начинаются :) forEach хорошо, если везде функциональщина

Ну в функциональщине forEach как раз подходит для вызова сайд-эффектов в конце цепочки Ну а если он где-то на ровном месте, то это и не функциональщина)

Андрей

Ну можно и перестать уже https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/some

Это правда. Не всегда помню всю стандартную либу.

Alexey

Ну в функциональщине forEach как раз подходит для вызова сайд-эффектов в конце цепочки Ну а если он где-то на ровном месте, то это и не функциональщина)

я именно про фуннкиональное везде по проекту

Китикет

Я использую some, every, map, filter, sort, reduce и тд когда прямо они просятся в код, то есть идеально подходят для цели, но вот иногда бывают такие преобразования данных, что приходится все подгонять под эти методы, а такую практику я правильной не считаю

Андрей

Функциональное...

Андрей

Лучше пытайтесь понятно писать, а не функионально/императивно.

Vadim

Это имеешь ввиду?

Да

Maxim

Но делать так каждый раз тоже как то попахивает

Alexey

Лучше пытайтесь понятно писать, а не функионально/императивно.

оно иногда и читается понятнее =) https://github.com/ramda/ramda/wiki/Cookbook

Vadim

Но делать так каждый раз тоже как то попахивает

Когда необходимо, тогда и делать. Точно не каждый раз

Китикет

Я бы в такой код не заходил уставшим)

Dilame

ДРАТУТИ!!! Подскажите плиз, можно ли как-то по-человечески использовать export function SomeFuncComponent вместо export const SomeFuncComponent = () => {}, не потеряв при этом типизацию?

Alexey

не вижу типизации

Китикет

ДРАТУТИ!!! Подскажите плиз, можно ли как-то по-человечески использовать export function SomeFuncComponent вместо export const SomeFuncComponent = () => {}, не потеряв при этом типизацию?

А каким образом ты теряешь типизацию? И почему не использовать вариант со стрелкой?

Dilame

А каким образом ты теряешь типизацию? И почему не использовать вариант со стрелкой?

Простите, слишком утрировал пример.

Андрей

оно иногда и читается понятнее =) https://github.com/ramda/ramda/wiki/Cookbook

Иногда)

Alexey

Простите, слишком утрировал пример.

а можно в виде текста без этих недоподсказок ИДЕшных

Андрей

Простите, слишком утрировал пример.

И где тут потеря типизации?

Dilame

А каким образом ты теряешь типизацию? И почему не использовать вариант со стрелкой?

Вариант со стрелкой не использовать потому что во первых есть более уместная запись. Я экспортирую ф-цию, значит я хочу написать export function. Во-вторых он банально менее читабельный из-за визуального мусора в виде = () => {}

Dilame

И где тут потеря типизации?

Здесь всё на месте. Потому что используется export const. Можно ли отрефакторить это на export function, не потеряв типизацию?

Андрей

Здесь всё на месте. Потому что используется export const. Можно ли отрефакторить это на export function, не потеряв типизацию?

Можно. Не читал в доке как типизируются функции?)

Alexey

можно, для тс одно и то же

Dilame

Можно. Не читал в доке как типизируются функции?)

К сожалению нет, поэтому пришёл сюда за помощью

Андрей

К сожалению нет, поэтому пришёл сюда за помощью

Эм. Прочитай.

Alexey

К сожалению нет, поэтому пришёл сюда за помощью

@ts_ru

Андрей

Dilame

Ребят, у меня чёрный пояс по TS, я пришёл сюда конкретно с вопросом по реакту

Alexey

а в реакте другой ts ?

Dilame

а в реакте другой ts ?

Да, tsx называется

Андрей

Ребят, у меня чёрный пояс по TS, я пришёл сюда конкретно с вопросом по реакту

Короч, но ты не поверишь. Функции типизируются так же как и функции. function C(props: Props): ReturnType {}

Андрей

Не благодари.

Alexey

Да, tsx называется

-_-

Dilame

-_-

toxic detected

Андрей

toxic detected

Ленивая жопа detected.

Alexey

toxic detected

ну а как ещё на это реагировать при условии, что у тебя черный пояс по тс?

Stanislav

Чет братан передул походу

N

Как объявлять переменный в style: style={{backgroundImage: 'url("{value.pic}")'}}

アレクサンダー・バキマトフ

Как объявлять переменный в style: style={{backgroundImage: 'url("{value.pic}")'}}

также как и не в style?

Dilame

Я задал вопрос конкретно про React FC. Сигнатура тут чутка замороченная, не удобно просто брать и проецировать её на export function. Вот спрашиваю, есть ли вариант делать это по-другому?

Dilame

Ленивая жопа detected.

Чё синдром вахтёра, тебе позволено типа, модератор все дела?

アレクサンダー・バキマトフ

Чё синдром вахтёра, тебе позволено типа, модератор все дела?

эээ, а что он такого сказал?)

Китикет

А кто мне норм обьяснит плюс использования function вместо стрелки для компонентов? Ведь const Component семантически подразумевает под собой определенную сущность для архитектуры, а function это просто средство обработать данные и вернуть результат / сделать какой-то сайд-эффект, что как бы больше никакого смысла не несет

Dilame

эээ, а что он такого сказал?)

Называть человека ленивой жопой за вопрос как-то моветон

N

Спасибо

アレクサンダー・バキマトフ

Называть человека ленивой жопой за вопрос как-то моветон

Он тебя не за вопрос назвал ленивой жопой, а за то что ты поленился сначала погуглить))

Dilame

Он тебя не за вопрос назвал ленивой жопой, а за то что ты поленился сначала погуглить))

Я погуглил, и не нашёл как сделать это. Везде юзают export const. Только после гугления я пришёл сюда. Здесь, кстати, тоже так никто и не подсказал

Alexey

А кто мне норм обьяснит плюс использования function вместо стрелки для компонентов? Ведь const Component семантически подразумевает под собой определенную сущность для архитектуры, а function это просто средство обработать данные и вернуть результат / сделать какой-то сайд-эффект, что как бы больше никакого смысла не несет

const Component = function Component() { ... }

Андрей

Называть человека ленивой жопой за вопрос как-то моветон

- Ну ты токсик - А ты ленивая жопа - А меня то за что обзываешь?

Китикет

const Component = function Component() { ... }

Идеально, ага)

アレクサンダー・バキマトフ

К сожалению нет, поэтому пришёл сюда за помощью

.

Dilame

.

Нет, я не читал доку. Это не отменяет того, что я гуглил

アレクサンダー・バキマトフ

Нет, я не читал доку. Это не отменяет того, что я гуглил

-_-

Андрей

Нет, я не читал доку. Это не отменяет того, что я гуглил

Если ты хочешь объявлять компоненты в фиде функций, то описываешь пропсы и делаешь function C(props: Props): JSX.Element {} Всё.

Андрей

Я тебе об этом уже выше писал.

Андрей

Но у ts или тайпингов(не разбирался), к сожалению, какое-то кривое понимание jsx и на многие корректные конструкции он тупо ругается(

Alexey

а пример можно такого поведения?

Dilame

Если ты хочешь объявлять компоненты в фиде функций, то описываешь пропсы и делаешь function C(props: Props): JSX.Element {} Всё.

(props: PropsWithChildren, context?: any): ReactElement | null; То есть единственный вариант - это спроецировать эту сигнатуру?

Dilame

Да, tsx называется

Забавно, а над моим таким же коментом порофлили)

Андрей

(props: PropsWithChildren, context?: any): ReactElement | null; То есть единственный вариант - это спроецировать эту сигнатуру?

Да, за исключением того, что у компонентов нет, вроде как, второго аргумента.

Dilame

Да, за исключением того, что у компонентов нет, вроде как, второго аргумента.

interface FunctionComponent { (props: PropsWithChildren, context?: any): ReactElement | null; propTypes?: WeakValidationMap; contextTypes?: ValidationMap<any>; defaultProps?: Partial; displayName?: string; } Ну это интерфейс из декларации

Андрей

interface FunctionComponent { (props: PropsWithChildren, context?: any): ReactElement | null; propTypes?: WeakValidationMap; contextTypes?: ValidationMap<any>; defaultProps?: Partial; displayName?: string; } Ну это интерфейс из декларации

Ок, буду знать. Спасибо.

Андрей

а пример можно такого поведения?

https://www.typescriptlang.org/play/index.html?jsx=2#code/GYVwdgxgLglg9mABAYQBQEpEG9ECcCmUIuSwAhgDYDO+iAvgFAMA8yiA9AHwDcQA В доке явно говорится, что это корректный код. https://reactjs.org/docs/react-component.html#reference

Dilame

Ок, буду знать. Спасибо.

Благодарю за помощь)

Alexey

https://www.typescriptlang.org/play/index.html?jsx=2#code/GYVwdgxgLglg9mABAYQBQEpEG9ECcCmUIuSwAhgDYDO+iAvgFAMA8yiA9AHwDcQA В доке явно говорится, что это корректный код. https://reactjs.org/docs/react-component.html#reference

cannot find name 'React'

Андрей

cannot find name 'React'

Ну добавь импорт. Ошибка всё равно будет) https://www.typescriptlang.org/play/index.html?jsx=2#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wG4AoTAVwDsNgIa4BhACgEo4BvOImKqE0woANgGckcAL7lyAHmZwA9AD5SQA

Alexey

Ну добавь импорт. Ошибка всё равно будет) https://www.typescriptlang.org/play/index.html?jsx=2#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wG4AoTAVwDsNgIa4BhACgEo4BvOImKqE0woANgGckcAL7lyAHmZwA9AD5SQA

import React from 'react'; function C(): any { return false } <C />;

Андрей

import React from 'react'; function C(): any { return false } <C />;

Эм, серьёзно? any?