본문 바로가기
Front-end/js-clean coding

제 41강 Shorthand Properties, Concise Method : 쉽게 작성하기

by somlang_bba 2023. 2. 20.
728x90

 

ES2015+ 부터 적용되는 문법 중 코드(객체)를 작성하는데 있어서 편리한 문법이 있다.

 

사실 많이 사용중이고 자주 사용중이어서 개념자체는 이해를 하고 있었지만 해당 문법을 지칭하는 용어를 몰랐기에 포스팅한다.

 

먼저 Shorthand Properties는 객체가 가지는 key의 이름과 value가 될 변수의 이름이 동일하면 key : value 형식으로 적지 않아도 JS가 알아서 매핑하여 넣어주는 것을 말한다.

 

예를 들면 다음과 같이 사용이 가능하다.

const name = 'kj';
const nickName = 'ssombba';

const obj = {
	'name': name,
    'nickName': nickName,
}

const objWithShorthand = {
	name,
    nickName,
}

console.log(obj); // { name : 'kj', nickName : 'ssombba' } 
console.log(objWithShorthand); // { name : 'kj', nickName : 'ssombba' }

 

728x90

 

Concise Method는 객체가 가진 함수 즉, 메소드를 편리하게 작성할 수 있도록 해주는 최신문법이다. 다음과 같이 사용 가능하다.

 

const obj = {
	func : function() {
    	return "something";
    }
}

const objWithConcise = {
	func() {
    	return "something";
    }	
}

 

728x90

'Front-end > js-clean coding' 카테고리의 다른 글

제 20강 값식문  (0) 2023.01.06
제 14강 isNaN  (0) 2022.02.05
제 13강 형변환 주의하기  (0) 2022.02.05
제 12강 eqeq 줄이기  (0) 2022.02.04