Html Css JavaScript
-
두 목록(list)의 값 비교 방법들Html Css JavaScript 2023. 7. 24. 13:52
JSON.stringify() 사용 a1 = [11,22] a2 = [11,22] a1 === a2 //false JSON.stringify(a1) === JSON.stringify(a2) //true Array.filter()사용 a1 = [11,22] a2 = [11,22,33] a1.filter(x => a2.includes(x)) //교집합(intersection) 결과: [ 11, 22 ] a1.filter(x => !a2.includes(x)) //차집합(difference) 결과: [] a2.filter(x => !a1.includes(x)) //차집합(difference) 결과: [33]
-
Spread syntax (...)Html Css JavaScript 2023. 2. 14. 22:02
항목 나열 문법 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax 변수 정의에서 가변 인자 Destructuring assignment 구조 분해 할당(destructuring assignment) https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#rest_property Rest parameters(함수 정의에서 가변 인자) https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/res..
-
Javascript UMD (Universal Module Definition)Html Css JavaScript 2023. 1. 29. 22:24
AMD와 CommonJS가 서로 호환되지 않는 문제를 해결하기 위해 등장. UMD(Universal Module Definition)는 모듈 시스템이 AMD와 CommonJS를 쓰는 두 그룹으로 나누어지면서 서로 호환이 되지 않는 문제를 해결하도록 AMD나 CommonJS를 모두 사용할 수 있도록 구현한 구성 방식이다.(디자인 패턴에 더 가깝다) AMD는 define을 사용하고, CommonJS는 module.exports를 하는 특징을 활용한다. exports와 module이 존재하면 CommonJS 방식으로 동작하고, define의 타입이 함수이고 define.amd가 존재하는 경우에는 AMD 방식으로 동작하고,모두 존재하지 않는 경우에는 root인 window 객체로 모듈을 내보내는 방식이다.
-
Javascript AMD (Asynchronous Module Definition)Html Css JavaScript 2023. 1. 29. 22:20
AMD(Asynchronous Module Definition)는 CommonJS의 개선하기위해 만들어짐. AMD는 동적 로딩과 의존성 관리, 모듈화를 지원하는 API를 제공한다. 모듈과 종속성 파일들을 비동기적으로 로드할 수 있도록 모듈을 정의하기 위해 만들어짐. CommonJS와 ESM 모두 module로딩을 동기식 방식을 채택하고 있기 때문에 로드한 module가 아직 사용되지 않았음에도 미리 로딩해야 한다는 문제를 개선하기위해 만들어짐. AMD의 비동기적 모듈을 구현한 가장 유명한 스크립트는 RequireJS가 있다. 하지만 ES6의 등장과 함께 브라우저에서도 사용 가능한 ESM 내장 모듈 시스템이 등장했고, webpack과 같은 모듈 번들러에서는 비동기적으로 모듈 로딩을 처리해 주고있다.
-
Javascript ESM (ECMA Script Module)Html Css JavaScript 2023. 1. 29. 21:59
ECMA, Ecma International ECMAScript, ECMA-262 (javascript) ECMA-262의 제6판에 해당하는 ES2015(ES6)부터 지원하고 있는 모듈 시스템. 이전까지는 브라우저 환경에서 사용할 수 있는 표준 모듈 시스템이 없었기에, 의 형태로 파일을 직접 불러오는 방법을 사용했다, 파일이 많아지면서 중복된 변수 문제나 성능에 문제가 발생. ES2015의 주요 특징 export, import 문법 사용 ( 대조적으로 'Javascript CommonJS'의 경우 module.exports, require 문법 사용) 태그에 type="module"을 선언하면 Javascript파일은 모듈로 동작한다. 명확하게 표현하기 위해서 확장자는 mjs로 붙여주는 것을 권장한다. ..
-
Javascript CJS (CommonJS)Html Css JavaScript 2023. 1. 29. 21:52
ECMA, Ecma International ECMAScript, ECMA-262 (javascript) Kevin Dangoor가 주축으로 기존 Javascript의 문제점 개선을 위해 2009년부터 시작된 프로젝트. 나열한 Javascript의 문제점. - 웹 서버 또는 데이터베이스등을 위한 표준 인터페이스가 없다. - Javascript는 모듈 시스템이 없다. - Javascript는 표준 라이브러리가 없다.(브라우저 API, date, math만 존재) - Javascript는 의존성을 관리하고 설치할 수 있도록 해주는 패키지 관리 시스템이 없다. javascript를 브라우저에서만 아니라, 다른 곳에서도 사용할 수 있게 해주는 API. Javascript가 웹 브라우저에서 실행되는 것 뿐만 아니..