[JavaScript] Import / Export

✅ Import / Export

• 여전히 범용적으로 많이 쓰이는 기존 import 문법은

  < script src="./library.js">< /script>

• but ES6에서는 새로운 문법을 사용할 수 있다!!

🔸 export default

• 기본적으로 export 하는 값으로, import 시 자유로운 작명해도 기본값으로 데이터가 잘 들어옴

  // export.js
  var name = 'kim';
  export default name;

  // import.js
  import 이름 from './export.js'

🔸 export 여러 변수

• export와 import를 각각 해주거나 중괄호{}로 묶어 한번에 해줄 수 있다
• import 시에는 데이터의 변수 이름을 그대로 가져와줘야 한다!!
• 변수의 이름을 바꾸고 싶다면 'as'키워드를 사용할 수 있음

  // export.js
  var name = 'kim';
  var age = 27;
  export {name, age};

  // import.js
  import {name, age} from './export.js'
  // 이름을 바꾸고 싶다면? => as 사용
  import {name as 이름, age as 나이} from './export.js'

🔸 export default + export 여러변수

• 기존 default와 동일하게 아무 이름으로 import하면 default 값이 담김
• 다른 export 데이터들도 동일하게 가져올 수 있음
• 다만 한 번에 가져오려면, 순서를 default 데이터를 가장 앞에 두어야 오류에서 자유롭다!!

  // export.js
  var name = 'kim';
  var age = 27;
  var gender = 'male';
  export {name, age};
  export default gender;

  // import.js
  import gender, {name, age} from './export.js'