Language/Javascript
-
[ECMA Script6] 6. 모듈 과 CommonJSLanguage/Javascript 2020. 1. 4. 20:01
1. 모듈 모듈이란 외부의 JS 파일에서 일부 기능 또는 변수 정보들을 불러와, 활용 할 수 있는 것을 말합니다. 외부로 노출하는 방법은, 아래 예제처럼 export를 활용하면 됩니다. 1 2 3 //log.js export const print(message) => log(message, new Date()) export const log(message, time) => console.log(`${time.toString()}: ${message}`} cs 만일 노출되는 대상을 특정 이름으로만 익스포트 할 경우에는, 아래와 같이 default 키워드르 사용하면 됩니다. 아래는 filter 이름으로만 외부로 노출되는 예제입니다. 1 2 3 4 // uploader.js const filter = {"dl..
-
[ECMA Script6] 5. 클래스Language/Javascript 2019. 12. 21. 21:47
1. 클래스 ES6 이전에는 클래스가 존재하지는 않았으나, 프로토타입을 이용하여 메서드를 정의해 사용하였습니다. 1 2 3 4 5 6 7 8 9 10 11 12 function MyFunc(pName, pVersion){ this.pName = pName this.pVersion = pVersion } MyFunc.prototype.print = function(){ console.log("Name : ", this.pName +', Version : '+this.pVersion) } var func = new MyFunc("테스트","1.0.0.1") func.print() // Name : 테스트, Version : 1.0.0.1 cs ES6에는 전통적인 객체지향 언어에서 사용하던 클래스 선언 방식이..
-
[ECMA Script6] 4. 스프레드 연산자Language/Javascript 2019. 12. 14. 19:40
1. 스프레드 연산자 스프레드 연산자는 세 개의 점(...)으로 이루어진 연산자 입니다. 이 스프레드 연산자를 통해 배열의 내용을 조합 할 수 있습니다. 아래예제는 스프레드 연산자를 이용하여 arrNum, arrAlphabet 배열을 조합한 arrMerge 배열을 만드는 예제입니다. 1 2 3 4 5 var arrNum = ["1","2","3","4"] var arrAlphabet = ["A","B","C"] var arrMerge = [...arrNum, ...arrAlphabet] console.log(arrMerge.join(', ')) // 1, 2, 3, 4, A, B, C cs 만약에, arrNum배열의 마지막 원소를 변수에 담고싶다고 가정해보면 초기화 할 때 arrNum 배열의 내용을 re..
-
[ECMA Script6] 3. ES6객체와 배열Language/Javascript 2019. 12. 7. 14:23
ES6는 객채와 배열 안에서 변수의 영역을 제한하는 방법을 다양한 형태로 제공하고 있습니다. 이 글에서는 구조분해, 객체 리터럴 개선, 스프레드 연산자 등에 대하여 설명드리도록 하겠습니다. 1. 구조분해 1.1 구조분해 구조분해를 이해하기 위하여 아래 예제를 살펴 보도록 하겠습니다. 서브웨이(subway)에서 주문을 할때 빵(bread), 고기(meat), 야채(vegwtable), 소스(sauce)를 선택할 수 있습니다. 이 중 빵과 소스만을 선택하여 주문을 하려고 합니다. (subway 객체에서 bread와 sauce 필드 만 필요) 아래코드를 보시면 subway 객체에서 동일한 명칭의 변수인 bread와 sauce에 넣어주는 것이 가능하다는것을 확인 할 수 있습니다. 1 2 3 4 5 6 7 8 9..
-
[ECMA Script6] 2. 화살표 함수(arow function) 및 트랜스파일링Language/Javascript 2019. 11. 30. 23:56
화살표 함수는 ES6에서 새로 추가된 기능입니다. 기존 자바스크립트 함수를 선언하려면 function 키워드를 이용해야 했으나, 화살표 함수는 해당 키워드 없이도 생성이 가능하며 returen을 사용하지 않아도 식을 계산한 값이 자동으로 반환됩니다. 아래는 기존 방식의 자바스크립트 function을 선언하는 예제입니다. 1 2 3 4 5 6 var myFunc = function (pName){ return `내 이름은 ${pName}. 탐정이죠.` } console.log(myFunc("코난")) //내 이름은 코난 탐정이죠. console.log(myFunc("고난")) //내 이름은 고난 탐정이죠. cs 화살표 함수는 아래와 같이 선언 및 사용이 가능합니다. 한 줄로 함수 정의가 가능하며, func..
-
JSON 규격 RFC-7159 (Proposed Standard) The JavaScript Object Notation (JSON) Data Interchange FormatLanguage/Javascript 2019. 7. 15. 14:52
요즘 JSON 관련 공부를 하다가 규격 문서를 보게 되었는데... 당연하게도 영어!! 그래서 조금 보기 쉽게 변역기들의 도움을 받아서 번역하였는데 혼자보기 아까우니 공유합니다! 원문 주소는 아래에 첨부하니 좀더 정확한 내용을 알고 싶으신 분은 링크를 따라가시면 됩니다~ https://datatracker.ietf.org/doc/rfc7159/?include_text=1 1. 소개 JSON (JavaScript Object Notation)은 구조화 된 데이터의 직렬화를위한 텍스트 형식입니다. ECMAScript 프로그래밍 언어 표준, 제 3 판 [ECMA-262]에 정의 된대로 JavaScript의 객체 리터럴에서 파생됩니다. JSON은 네 개의 기본 유형 (문자열, 숫자, 부울 및 널) 및 두 개의 구..