ES6 문법 정리2

Yoon·2024년 1월 30일
0

ES6

목록 보기
2/2

Template Literals(템플릿 리터럴)

문자열을 연결하기 위해 더하기(+) 연산자를 사용할 필요는 없으며, 백틱( ` )을 사용하여 문자열 내에서 변수를 사용할 수도 있다.

//ES5
function myFunc1() {
  return '안녕' + name + '너의 나이는' + age + '살 이다!';
}
console.log(myFunc1('영희',22));
// 출력 => 안녕 영희 너의 나이는 22살 이다!

//ES6
const myFunc1 = (name, age) => {
  return `안녕 ${name}, 너의 나이는 ${age}살 이다!`;
};
console.log(myFunc1('영희', 22));
// 출력 => 안녕 영희 너의 나이는 22살 이다!

Default parameters(기본 매개 변수)

매개 변수를 쓰지 않은 경우 매개 변수가 이미 기본값에 정의되어 있으므로 정의되지 않은 오류가 반환되지 않는다.
따라서 누락된 매개 변수를 사용하여 함수를 실행할 때 기본 매개 변수 t값을 사용하고 오류를 반환하지 않는다.

const myFunc = (name, age) => {
  return `안녕 ${name} 너의 나이는 ${age}살 이니?`;
};

console.log(myFunc('영희'));
// 출력 => 안녕 영희 너의 나이는 undefined살 이니?

위의 함수는 정의되지 않은 상태로 반환된다. 두 번째 매개 변수 age가 지정이 안되어 있기 때문이다.

기본 매개 변수를 사용하면 정의되지 않은 매개 변수가 반환되지 않고 매개 변수 할당을 잊어버렸을 때 해당 값이 사용된다.

const myFunc = (name, age = 22) => {
	return `안녕 ${name} 너의 나이는 ${age}살 이니?`; 
};

console.log(myFunc('영희'));
// 출력 => 안녕 영희 너의 나이는 22살 이니?

두 번째 매개 변수를 놓치더라도 파라미터를 사용하여 오류를 처리할 수 있다.

profile
나의 공부 일기

0개의 댓글