Правильность конвертирования в новый массив?

Question

[DeniSidorenko]

Добрый день, подскажите пожалуйста насколько правильна такая практика перебора в новый массив?
Задача: Получить данные из базы данных , пройтись и вернуть новый массив из объектов с value и label
( Для рендеринга в React Select )

const categoriesPossible:any[] = []
	useEffect(() => {
		GetAllCategories.map((tower:any) => {
			const newObject:SelectInterface = {
				value: "",
				label: ""
			}
			newObject.value = tower.id
			newObject.label = tower.name
			categoriesPossible.push(newObject)
		})

	}, [GetAllCategories])

Можно ли данный код по другому более универсально написать?

Answer 1

[G F]

const categoriesPossible = GetAllCategories.map((tower:any) => ({value: tower.id, label: tower.name}))

Ну и лучше не юзать any

Comments

[DeniSidorenko]

Сасибо, в конечно итоге код будет таким?

let categoriesPossible:any[] = []
	useEffect(() => {
		categoriesPossible = GetAllCategories.map((tower:any) => ({value: tower.id, label: tower.name}))
		console.log(categoriesPossible)
	}, [GetAllCategories])

[G F]

DeniSidorenko, ну да. Но вообще насколько мне известно в реакте есть всякие либы для асинхронности, саги там или react query например

[DeniSidorenko]

G F, Спасибо, посмотрю в данном направление

[G F]

Ну если саги выглядят несколько монструозно и могут быть сложны для новичков, то в react query все максимально легковесно и примитивно

[DeniSidorenko]

G F, В моем случае у меня GraphQL и apollo/client сейчас смотрю там как делать все асинхроно)

[DeniSidorenko]

G F, Скажите пожалуйста а правильно ли я понимаю что под Асинхроность имеятся ввиду выполнять скрипт когда он загружен, что бы не использовать useState? К примеру в GraphQL при запросе можно получить { loading, error, data }, и к примеру сделать проверку

if(!loading){
 // Run Code
}

Или вы про другое имейте ввиду?

[G F]

DeniSidorenko, а ну тогда ещё проще, там же тоже хуки есть свои для фетчинга

[DeniSidorenko]

G F, Да, поэтому сделал таким образом, в любом случае переменную надо было объявлять через let за пределами области условия

let categoriesPossible:any[] = []
	if(!loading){
		categoriesPossible = GetAllCategories.map((tower:any) => ({value: tower.id, label: tower.name}))
	}

[G F]

DeniSidorenko, не, под асинхронностью я имел ввиду запросы на сервер, но вообще в жсе полно асинхронных штук ивенты, таймауты, обсерверы...

[DeniSidorenko]

G F, Спасибо , посмотрю)