javaScript(가져오기 - import, 내보내기 - export)

Dev_Go·2022년 6월 29일
0

javascript(basic) 모음

목록 보기
19/23
post-thumbnail

javaScript 데이터 실습


export

다른 프로그램에서 선언과 함께 사용할 수 있도록 모듈에서 함수, 개체 또는 기본 값으로 라이브 바인딩을 내보내는 JavaScript 모듈을 만들 때 사용된다.

Default export

이름을 따로 지정하지 않고 내보내도 되는 통로

  • 한 개만 내보낼 수 있다.
export default function (data) {
  return Object.prototype.toString.call(data).slice(8, -1)
}

Named export

이름 꼭 지정해서 내보내야 되는 통로

  • 여러개도 내보낼 수 있다.
export function random() {
  return Math.floor(Math.random() * 10)
}
export const user = {
  name: 'winnie',
  age: 20
}

import

다른 모듈 에서 내보낸 import 읽기 전용 라이브 바인딩을 가져오는데 사용된다.

import { random, user as winnie } from './getRandom'
선언명을 바꿔줄 수 있는데 :기호를 그대로 쓰지는 못하고 as로 바꿔서 사용하면 된다.
user as winnie = user: winnie

import _ from 'lodash'
// Default export
import checkType from './getType'
// Named export
import { random, user as winnie } from './getRandom'

console.log(_.camelCase('the hello world'))
console.log(checkType([1, 2, 3]))
console.log(random(), random())
console.log(winnie)

결과

한번에 가져오기

import { random, user as winnie } from './getRandom'이렇게 따로 불러오지 않고 한 번에 가져오는 방법이다.

import * as R from './getRandom'

console.log(R)

결과

와일드카드(Wildcard Character, *)는 여러 내용을 한꺼번에 지정할 목적으로 사용하는 기호를 가리킨다.

profile
프론트엔드 4년차

0개의 댓글