JavaScript

Three dots, ..., 점점점, 삼점 표기법 - JavaScript

파란배개 2020. 9. 18. 11:06

Three dots, 점점점, 삼점 표기법 등으로 표현되는 ...은 ES6에 추가된 문법으로

Rest Operator와

Spread Operator가 있다

 

 

let array = [1,2,3,4,5];
let arr = [c, d, ...arrayRest];
console.log(arr); // c, d, 1, 2, 3, 4, 5

let object = {a: 1, b: 2 , c: 3};
let {a, b, ...objRest} = object;
console.log(a, b, objRest); // 1, 2 { c: 3 }

레스트 오퍼레이터의 예시

rest... 나머지...

 

배열일 경우 그 배열의 나머지 배열을 요소로 반환하고

객체일 경우 객체의 나머지 키와 속성을 묶어 객체로 반환한다.

 

let a = [1,2,3];
let aa = [...a, ...a];
console.log(aa) // [1, 2, 3, 1, 2, 3]

export interface Component {
  defaultProps = {}
    props = {};
    
    setValue = (props) => {
    	this.props = {...this.defaultProps, ...props};
    }	
}

스프레드 오퍼레이터의 예시

spread... 펼친다...

 

스프레드 오퍼레이터는 배열이라면 해당 배열을 풀어서 요소로 바꿔준다.

객체라면 열거할 수 있는 속성들을 나열한다.

 

참고 : ddalpange.github.io/2018/01/11/js-es6-three-dots/