[javascript] promise의 값 가져오기

김지영·2021년 7월 14일
10

TIL

목록 보기
1/1
post-thumbnail

콘솔 창에 찍히는 promise의 promiseresult를 보고 발 동동일 미래의 나를 위하여.

//func.js
function getPromise() {
  return fetch(endpoint)
    .then(res => res.json())
    .then(funcData => console.log(`이것이 바로 우리가 추출하고 싶어하는 value : ${funcData}`)
}

위 함수의 값은 promise로 반환된다.
위 함수가 다른 파일에서 import해온 것이라면
도대체 어떻게 해야 res.json()의 값을 가져올 수 있는지 알 수가 없다.
콘솔의 promisersult에 찍히는 내가 원하는 그 value(=funcData)를 보며 발만 동동였다.

then을 하나 더 붙이거나 fetch값 자체를 특정 변수에 할당을 하더라도 결국 promise 형태로 할당이 된다.

//App.js
//import {getPromise} form './func'
const promise = getPromise();
const getData = () => {
  promise.then((appData) => {
    console.log(appData);
  });
};

getData()

그럴 땐 우리가 해당 값을 얻고자 하는 파일 (여기서는 App.js)에서
위와 같이 함수를 만들자.
콘솔창에 그렇게 원하던 appData 찍히는 것을 볼 수 있다.
콘솔로그 대신 원하는 동작을 작성하고
밑에 함수를 실행하면 된다.


그동안 블로깅을 게으르게 했지만 이번에 알게된 것은 꼭 블로깅을 해둬야
나중에 되새김질 할 수 있을 거 같아서 작성한다.
사실 이 내용이 필요할 때 다시 찾아낼 자신이 없다.
내 검색 능력이 부족한 건지, 한국어로는 이런 내용 절대로 못 찾겠더라.

profile
개발자 첫걸음

2개의 댓글

comment-user-thumbnail
2022년 4월 15일

복받으세용.... 많이....

답글 달기
comment-user-thumbnail
2022년 8월 9일

async/await를 사용해 async function내에서 await로 변수를 받으면 .then을 사용하지 않고 직관적으로 받을 수 있습니다요!
ex) const getdata = await promise.appData

답글 달기