named default

윤수호·2022년 7월 13일
0

오늘은 named default라는 새로운 default방법을 배웠다.

방법은 원하는 디렉토리(ex:common)에 index.js파일과
asdf.js라는 함수를 내보내는 파일을 만든 후
asdf.js에는

asdf.js//

const asdf = () => {
  console.log('asdf');
};
export default asdf;

로 export default 해준뒤

index.js//

export { default as asdf } from './asdf';

index.js에서 default as asdf로 바로 export해준다.

그 후 asdf를 사용하고 싶은 파일에서

import { asdf } from '../user/common';

asdf() // asdf가 나온다.

이렇게 사용하면된다 common이라는 폴더까지만 적은 이유는 이렇게 적으면
index.html 처럼 자동으로 index.js를 기본값으로 적용하기 때문이다.

이러한 named default를 쓰는 이유는 여러개를 export할때 좀 더 깔끔하고
쉽게 내보낼 수 있기때문에 사용하지만
default를 쓰면 읽기 편하고, 유지보수성이 향상되고, treeshaking이 가능하고,
개념적 이해 등등이 가능하다라는 의견도 있기 때문에 본인이 원하는 또는 팀에서
효율적이라고 생각하는 방법으로사용하는것이 현명한 방법으로 보인다.

아마도 추측으로는 react를 사용할때 useState,useEffect를 쓸때도

import React, { useEffect, useState } from 'react';

이러한 방법으로 사용하는데 named default를 쓴게 아닌가 추측된다.

profile
기술블로그 시작

0개의 댓글