목록javascript (3)

`프론트엔드 개발자` 개형이의 벽돌집

[간단] export default로 export된 모듈 as로 별칭 붙이기

개발하다보면 이게 왜 안될까? 이걸 왜 몰랐지? 하는 순간이 있다. Next의 Image 컴포넌트를 사용하려고 하는데 여기에 별칭을 붙이고 싶었다. 근데 as로 단순하게 붙이려고 했더니 위처럼 syntax error가 잡혔다. 단순 export된 모듈은 import { ImageProps as NextImageProps } from 'next/image'로 사용 가능하지만 export default 모듈은 방식이 다르다. 정답은 아래와 같다. import { default as NextImage, ImageProps as NextImageProps } from 'next/image' 위처럼 default as {모듈} 로 사용하면 된다! 짧은 포스팅 끝.
자바스크립트 2024. 1. 18. 12:16
자바스크립트 객체 조건부로 프로퍼티 추가하기

🧐 API 호출 파라미터로 객체를 보내야 하는데… const params = { x: 'x', y: 'y' // 얘는 특정 조건이 만족했을 때만 포함이 되면 좋겠다. } api(params) ⇒ 특정 프로퍼티는 조건을 만족할 때만 추가가 되었으면 좋겠다. 🧐 조건이 안맞는다면 undefined를 보내도록 결심하는데… const params = { x: 'x', y: condition ? 'y' : undefined } api(params) // condition is false -> params: {x: 'x', y: undefined} ⇒ 이렇게 보내면 처리가 될 줄 알았지만 api에서 원하는 데이터를 출력하지 못했다. 🧐 조건이 성립되면 undefined로 보내지 않고 아예 프로퍼티 자체를 안넣는 문..
자바스크립트 2022. 12. 2. 10:35
자바스크립트 async, await 사용법. 어떻게 쓸까?

async, await - 깔끔하게 promise를 사용하게 해주는 것. promise는 비동기적으로 실행하는 것을 지원한다. function fetchData() { const result = fetchData // 백엔드로부터 데이터를 불러오는데 5초의 시간이 걸림 return result } const data = fetchData() console.log(data) 위 코드에서는 비동기로 설정해주지 않았기 때문에 동기로 실행된다. 백엔드로부터 데이터를 가져오는 데 5초의 시간이 걸리기 때문에 그 다음을 실행하기까지 5초의 딜레이가 생기는 것이다. 이를 비동기로 설정해준다면, 백엔드로부터 데이터를 가져오는 동안 다음 코드를 비동기적으로 실행하기 때문에 이후 과정에 딜레이가 생기지 않을 것이다. 1...
자바스크립트 2022. 2. 13. 22:29
Prev 1 Next