본문 바로가기

ECMAScript613

10 ECMAScript - Map, Set 10. Map, Set JAVA에서 사용할 수 있는 Map, Set을 ES6에서 지원한다. 먼저 자바에서 set과 map의 특징은 다음과 같다. Map- key와 value로 저장한다.- 순서가 없고, key는 중복된 값을 가질 수 없다. Set- 배열이다.- 순서가 없다.- 중복된 데이터를 가질 수 없다. ES6에서도 거의 유사하지만 자바와는 다르게 set, map 모두 순서가 있다.그래서 for문으로 돌려 값을 가져올 수 있다. 이제 하나씩 예제를 보면서 알아보자 (1) Map 기본적으로 .set(key, value) 메서드로 데이터를 저장하고, .get(key) 메서드로 데이터를 가져온다.Map의 크기는 length가 아닌 size를 사용하여 구하며, .has(값) 메서드로 해당 값으로 되어 있는 .. 2018. 4. 4.

09 ECMAScript6 - Class 9. Class JAVA처럼 class를 선언하고 사용할 수 있다.Javascript를 JAVA처럼 사용할 수 있게 지원하는 내용이기에 JAVA에 대한 기본 지식이 없다면 이해하기 힘들 수 있다.최대한 자세히 설명하겠지만 JAVA에 대해 공부하고 이 글을 보는 걸 추천한다. (1) 선언 방법 기본적으로 아래 같이 set, get을 선언해서 사용할 수 있다.JAVA와 달리 Class 안에 변수를 선언하지 않고, set메서드에서 this. 을 이용해서 변수를 선언해서 사용한다. 다음과 같이 선언할 수도 있으며, set get으로 지정하면 method 형태가 아닌 property 형태로 사용할 수 있다. 그리고 function을 정의하는 방법과 동일하게 class Person 대신 var Person = cl.. 2018. 4. 4.

08 ECMAScript6 - Array 2 (copyWithin, fill, entries, keys, find, findIndex) (6) copyWithin()Index 범위의 값을 복사하여 같은 배열의 지정한 위치에 설정한다. 문법: arr.copyWithin( a, [b, c] );a: 복사된 값을 설정하기 위한 시작 index. b: 값을 복사하기 위한 시작 indexc: 값을 복사하기 위한 끝 index 결국 b에서 부터 c-1까지 복사해서 a 위치부터 설정한다. (7) fill()Index 범위의 값을 지정한 값으로 변경한다. 문법: arr.fill( a, [b, c] );a: 설정할 값. b: 값을 설정하기 위한 시작 index c : 값을 설정하기 위한 끝 index 결국 b에서 부터 c-1까지 a 값으로 설정한다. (8) entries()배열을 {key:value} 형태로 반환한다. key는 배열 index값이고 va.. 2018. 4. 4.

08 ECMAScript6 - Array 1 (Array-like, Array.form, Array.of(), forEach) 8. Array (1) Array-like 객체 ES6에서 사용되는 객체로서, 형태의 객체 특징 + 배열의 특징 -> array-like 객체 문법: let arrLike = { 0:값, 1:값,…. , length:개수 }; (2) Array.form() 새로운 Array객체를 생성. 문법: Array.from( 값, [function, 객체] ); 값: array-like 객체 또는 iterable 객체 function: 배열 요소마다 호출되는 함수 객체: function에서 this 키워드 사용시 참조하는 인스턴스. (3) Array.of() 새로운 Array객체를 생성. 문법: Array.of( 값, [값2,값3,...] ); Array.of() 메서드가 호출되면 우선 Array 객체가 생성되고,.. 2018. 4. 3.

07 ECMAScript6 - template 7. Template 문자열 처리를 보다 더 효율적으로 처리하기 위한 방법이다. `` (back-tick) 이라는 역따옴표를 사용하여 표현한다. `` 안에 ${exp} 형식의 특별한 표현식을 삽입할 수 있다. 결국, 문자열과 ${exp} 형식의 값을 ``으로 감싸 표현하는 리터럴 값을 ‘template 리터럴’ 이라고 한다. - taged template 다음과 같이 tag를 작성한 template를 의미한다.문법: tag `문자열${exp} 문자열`;tag 위치에 함수명을 지정한다. 함수를 호출하기 전에 template 리터럴에서 문자열과 표현식을 분리하여 파라미터로 넘겨준다. 2018. 4. 3.

06 ECMAScript6 - Object 2 (method, function 제거, includes, startsWith, endsWith, repeat) (7) 메서드 선언 방식 변경ES5에서 사용했던 메서드명:function(){} 형식에서 :function이 제거된 형태로 사용할 수 있다. ECMAScript5 형식 ECMAScript6 형식 ES6에서는 get 과 set 키워드를 사용하여 메서드 사용시 가독성 향상 가능 (8) includes 대상 문자열에 지정된 문자열 존재 여부 판별한다.첫번째 인자에는 찾을 문자열 지정하고, 두번째 인자에는 시작 인덱스값(옵션)을 지정한다. (9) startsWith, endsWith- startsWith : 대상 문자열이 지정된 문자열로 시작 여부 판별, 두 번째 인자는 시작 index- endsWith : 대상 문자열이 지정된 문자열로 끝나는지 여부 판별, 두 번째 인자는 길이 (10) repeat대상 문자열.. 2018. 4. 3.

이전 1 2 3 다음

티스토리툴바