CommonJs && ES6
node기반 프로젝트 작업시 빈번하게 등장하는 모듈(module)
프로젝트 진행시 관련 자룔르 찾아보면 CommonJs방식과 ES6방식이 혼합되어 있다.
이에 이를 구분해 원활한 코드 습득을 위해 정리한다.
- CommonJs : NodeJs 환경에서 사용하는 Javascript 모듈 시스템
- module.exports 모듈 객체에 담아 내보냄
- require 모듈화
// ex_export.js
const a = 'a';
const b = 'b';
module.exports = {a, b};
// ex.js
const str = require("ex_export");
console.log(str); // { a: 'a', b: 'b' }- ES(ECMAScript)6 : JavaScript 언어가 사용하는 6번째 표준 스펙
- export 모듈 객체에 담아 내보냄 -> import시 중괄호 필요
- default export 기본 함수 내보내기 가능 (모듈당 한개) -> 중괄호 필요X
- import 모듈화
// ex_export.js
const a = 'a';
const b = 'b';
const c = 'c';
export {a, b};
export default c
// ex.js
import {a, b} as str from 'export';
import c from 'export';
console.log(str); // { a: 'a', b: 'b' }babel
ES6+ 버전 이상의 자바스크립트나 JSX, 타입스크립트 코드를 하위 버전의 자바스크립트 코드로 변환 시켜 IE나 다른 브라우저에서 동작할 수 있도록 하는 역할을 하는 일종의 자바스크립트 컴파일러
- presets : 플러그인 모음
ref && reactive
반응형 데이터 -> Vue는 반응형 데이터가 변경됨을 감지하고 필요한 업데이트를 발생
-
ref
- 전달된 값을 갖게 되됨
- 단일 속성 .value가 있는 변경 가능한 반응형 ref 객체를 반환
-
reactive
- 같은건데 타입이 제한됨
- 더 뭐가 있는데 안찾아봄
depdepdepdepdepdepdepdepdepdepdepdep