ES6 Class
·
Programming/Javascript
ES6 Class 문법에 대한 정리에 앞서.. 자바스크립트는 객체 기반 또는 프로토타입 기반(Prototype-based) 언어입니다. 그래서 클래스 기반(Class-based)의 객체지향 언어들과는 달리 프로토타입 체인과 클로저 등을 이용하여 상속과 캡슐화같은 개념들을 만들어 냈습니다. 하지만, ES6(ECMAScript 6)에서 Class문법이 추가되었습니다. 이 문법에 대해서 syntax sugar인가 아닌가에 대해 다양한 의견들이 있습니다. 이에 대해선 스스로 다양한 글을 읽고 판단하시는 것을 추천합니다. 자바스크립트에 Class문법이 추가되었다고 했지만, 사실은 Class로 선언된 객체의 속성을 알아보면 Function이라 나옵니다. (더보기 참고) 더보기 // ES5 function Human..
ES6 Set과 Destructuring 을 이용한 로또 번호 생성기
·
Programming/Javascript
const SETTING = { name: "LUCKY LOTTO!", count: 6, maxNumber: 46, }; function getRandomNumber() { const lotto = new Set(); // 파라미터에서 디스트럭쳐링 할 수도 있음. const { count, maxNumber } = SETTING; while (lotto.size < count) { // 0~46이 아니라 실제 로또처럼 1~45가 나오게 끔 함. lotto.add(Math.floor(Math.random() * (maxNumber - 1)) + 1); } console.log(lotto); } getRandomNumber(); lotto.has()를 써서 중복검사 처리를 할려다가 lotto.size를 이용..
ES6 Map과 WeakMap
·
Programming/Javascript
Map 이란 Map()을 통해 Map을 생성할 수 있습니다. Map은 자바스크립트에 내장된 표준 객체(Standard Built-in Object) 이며, key-value 쌍의 컬렉션입니다. Map의 특징 key를 사용해서 value를 get, set할 수 있습니다. key 값은 중복이 될 수 없으며, 하나의 key에는 하나의 value만 올 수 있습니다. Object와의 차이점 Object는 String과 Symbol 타입만 key로 사용가능 하지만, key는 String, Symbol, Object, Function을 사용할 수 있습니다. Map은 Object와 달리 iterable 입니다. Map의 메서드 WeakMap 이란 key가 약하게 참조되는 key-value 쌍의 컬렉션입니다. Map과의..
ES6 Set과 WeakSet
·
Programming/Javascript
SET 이란 new Set() 을 통해 Set을 생성할 수 있습니다. Set은 자바스크립트에 내장된 표준 객체(Standard Built-in Object) 이며, 중복된 값을 허용하지 않는 데이터 집합입니다. 그렇기 때문에, Set에 중복된 값을 넘기게 되면 Set은 알아서 중복된 값을 제외한 배열을 생성합니다. let myset = new Set([1, 2, 3, 4, 1, 2, 1, 5, 6, 7, 7, 8]); console.log(myset); // Set(8) {1, 2, 3, 4, 5, 6, 7, 8} SET의 장점 Set은 중복을 허락하지 않기 때문에, 이미 중복된 값이 존재하는지 체크하지 않아도 됩니다. const myset = new Set([1, 2]); console.log(myse..
ES6 디스트럭쳐링(Destructuring)
·
Programming/Javascript
디스트럭쳐링(Destructuring) 이란? 구조화된 배열 또는 객체를 Destructuring(비구조화, 파괴)하여 개별적인 변수에 할당하는 것입니다. 배열 또는 객체 리터럴에서 필요한 값만을 추출하여 변수에 할당하거나 반환할 때 유용합니다. 배열 디스트럭쳐링 (Array Destructuring) // ES5 var arr = [1, 2, 3]; var one = arr[0]; var two = arr[1]; var three = arr[2]; // ES6 // 배열의 인덱스를 기준으로 값이 저장됩니다. const arr = [1, 2, 3]; const [one, two, three] = arr; 객체 디스트럭쳐링 (Object Destructuring) // ES5 var obj = { firs..
ES6 String에 추가된 메서드들
·
Programming/Javascript
1.str.startsWidth() startsWidth 메서드는 해당 문자열의 시작 단어와 매개변수로 받는 문자열이 일치하는지 판단하기 위해서 사용합니다. let str = "Hello World"; let match = "Hello"; console.log(str.startsWidth(match)); // true 2.str.endsWidth() endsWidth 메서드는 해당 문자열의 마지막 단어와 매개변수로 받는 문자열이 일치하는지 판단하기 위해서 사용합니다. let str = "Hello World"; let match = "World"; console.log(str.endsWidth(match)); // true 3.str.includes() includes 메서드는 해당 문자열의 내부에 매개..