ES6

Arrow Functions

 

//비교 예시

//es5
function hi(name){
    return "hi " + name;
}
//es6
const hi = name => "hi " + name; 
const hi = name => { return "hi " + name; }

 

- 기본 인자를 설정할 수 있게 되었다. 

//Defult Parameter
const hi = (name ="man") => "hi " + name;

function hi(name="man"){
    return "hi " + name;
}

 

- arrow function 은 이벤트를 추가하거나 익명함수로 만드는데에 활용도가 좋다.

<body>
    <button></button>

	<script>
		const button = document.querySelector("button");
		const handledClick = (event) => console.log(event);
		button.addEventListener("click",handledClick);
        //button.addEventListener("click",event => console.log(event));
	</script>

</body>

 

- argument 가 두개 이상일 때는 괄호를 붙이고, 하나일 경우 필요 없다.

const a = a => a;
const add = (a,b) = > a + b

console.log(a)          //1
console.log(add(1,2))   //3

 

- 기본적으로 return 을 포함하고 있다. return 을 따로 사용하고 싶은 경우 중괄호를 붙여야 한다.

const add = (a, b) => {
  return a + b;
};

 

댓글

댓글 본문
작성자
비밀번호
버전 관리
gamza
현재 버전
선택 버전
graphittie 자세히 보기