7 - 19 TIL

클린코드

Shorthand Properties

이부분은 개발자의 취향차이이기도 하지만( 프로그래밍 공부를 진행하며 여러 강의를 들었는데 어떤분은 한번에 작성하는 게 좋다고하고 어떤분은 부분별로 쓰면 나중에 편해서 부분별로 쓰는 게 취향이다 라고 하기도 했다.)

.befor{
	background-color : #000;
    background-iamge : url('/test~');
    background-repeat : no-repeat;
    background-position : left top;
}
.after {
	background : #000 url('/test~') no-repeat left top
}

요런식으로 한번에 축약하는게 숏핸드 프로퍼티이다

React에서 redux를 사용할때 아래도 Shorthand Properties 이다

const counterApp = combineReducer({
	counter,
  	extra,
  	counter2,
    counter3,
})

Computed Property Name

계산된 이라는 뜻으로 객체를 설정할때 [name] : value와 같이 사용해본 적이 있을 것이다 []안에 들어가는 값은 동적인 값으로 계산이 된 값이 들어가는 예
js는 기본적으로 :을 기준으로 좌측이 프로퍼티, 키 이고 우측이 값이다
그래서 값이 함수를 가지면 method라고도 한다.

const funcName0 = 'func0';
const funcName1 = 'func1';
const funcName2 = 'func2';


const obj = {
	[funcName0]() {
    	reutrn 'func0';
    }
 	 [funcName1]() {
    	reutrn 'func1';
    }
	[funcName2]() {
    	reutrn 'func2';
    }
}

for(let i=0;i<3; i++){
	console.log(obj[`func${i}`]()) // func0, func1, func2
}

위의 식들도 Computed Property Name 활용한 것이다!