본문 바로가기

JS

이터레이터 프로토콜 iterator protocol 특정 객체의 요소를 어떤 방식과 순서로 순회할 지 정의하며 순회가 끝났는지를 나타내는 불리언 값인 done, 현재 원소 값인 value를 담은 객체를 반환하는 메서드를 이터레이터(반복자)라고 한다. const Iterator = (arr)=>{ let i = 0 return{ next:()=>{ return i
for of 순회 가능한 컬렉션(배열 O, 객체 X)의 각 요소에 접근한다. for문, for in문과 차이가 있다. var iterable = [10, 20, 30]; for (var value of iterable) { console.log(value); // 10, 20, 30}for of를 쓰면 iterable이라는 컬렉션의 값은 index가 아닌 원소 값이다. for in을 쓴다면 value는 index가 된다.var iterable = [10, 20, 30]; for (var value in iterable) { console.log(value); // 0,1,2 for of는 forEach에서는 불가능한 실행 흐름 제어를 break 또는 continue로 할 수 있다.
forEach 배열의 각 원소마다 주어진 함수를 실행한다. const arr=[] for(var i=1;i
문자열 치환 자바스크립트에서는 문자열에 값을 더하고 또 문자열을 더하는 것은 매우 불편했다.'abc' + val + 'efg' 문자열 포매팅을 하면 런타임에 치환이 된다.템플릿 리터럴 `` 사이에 변수를 넣는데 그냥 넣는 게 아니고 ${변수}를 넣는다.${} const alpha='d' console.log(`abc${alpha}efg`)
멀티라인 문자열 템플릿 리터럴을 사용하면 여러줄의 문자열을 간단하게 쓸 수 있다. `` 안에 있는 문자열의 공백, 줄바꿈을 모두 문자열로 인식한다. const str=`안녕하십니까반갑습니다안녕 하세요?`console.log(str) 안녕하십니까반갑습니다안녕 하세요?
화살표 함수 arrow function this가 실행 시점이 아닌 정의 시점에 결정되는 함수를 정의할 수 있다.const Print = (n) => {//Print 함수에서 n으로 인자 받기 console.log(n)} Print(10)//인수 10 전달 인자가 하나인 경우 () 생략 가능 함수를 구성하는 표현식이 한 줄일 때는 {}생략 가능, 표현식이 반환됨. function을 사용한 함수와 화살표 함수와의 차이1. 생성자로 사용할 수 없다.2. 함수 내에 인수 바인딩이 없다.3. prototype 속성이 없다.
기본 인자 기존 자바스크립트에서는 함수의 인자와 함수 호출 시 인수의 갯수가 다르면 인자에 undefined가 할당되었다. 값이 제대로 들어 갔는 지 확인하려면 일일이 undefined과 값을 비교해야 했는데 ECMAscript에서는 인자에 기본 값을 설정할 수 있게 되었다. function func(a,b,c=3){ console.log(a,b,c)} func(1,2) 왼쪽부터 차례대로 할당된다. 만약 c에 기본 값이 할당되지 않으면 오류가 난다.
객체 리터럴 변경사항 트레일링 콤마 원소를 추가할 때 ,를 붙일 필요 없다.const comma={ a:1, b:2,} 단축 속성명const [a,b]=[1,2]const obj={a:a,b:b}const obj2={a,b} console.log(obj)console.log(obj2) 단축 메서드명// oldconst objWithFunction = { f: function () { console.log(1); } }; objWithFunction.f(); // 1 ​ // new (ES6~ ) const objWithFunction2 = { f() { console.log(1); } }; objWithFunction2.f(); // 1 계산된 속성 이름객체에서 키를 대괄호 []로 감쌀 경우 키의 값을 속성 이름으로 사용한다..