[ECMAScript6] Arrows 화살표 함수

ECMAScript6가 나왔네요. 테스트해보니 크롬이랑 파이어폭스에서 잘 동작합니다.(최신버전)

새로 나온 feature 에 대해서 공부도 할겸 하나씩 정리해볼 생각입니다.

참고사이트 :

http://es6-features.org/

https://github.com/lukehoban/es6features

Arrows (화살표 함수)

화살표는 => 를 이용해 함수를 간략화 할 수 있습니다. (C#, JAVA8, CoffeeScript와 비슷)

함수와 리턴값을 간단한 형태로 정의할 수 있습니다. 예를 참고 하시죠.

인자 => 표현식

 
//+1 함수
var addOne = num => num+1;
addOne(1); //2
addOne(564); //565
 
//이것과 동일하게 동작합니다.
var addOne = function(num){
    return num+1;
};
 

간단하네요. 인자가 두개 이상일때는 어떻게 할까요? 괄호로 묶어주면 됩니다.

또한 좀 더 많은 내용을 포함하고 싶을때는 중괄호로 감싸면 됩니다.

//인자 두개 더하기
var add = (num1,num2) => num1+num2;
add(1,2); //3
 
//이름 반환
var getName = name => {console.log('내이름은 '+name); return name;}
getName('이브라'); //내이름은 이브라 / 이브라 반환
 
//짝수 뽑기
var nums = [1,2,3,4,5,6,7,8];
var evens = [];
nums.forEach(num => {
    if(num%2==0){
        evens.push(num);
    }
});
console.log(evens) //[2,4,6,8]
 
//this는 어떻게 사용될까?
var Ibra = {
    name : 'ibra',
    getThis : () => {return this} //인자 없음. this 반환
};
Ibra.getThis() // Ibra객체가 아닌 Window를 반환한다. this사용시 주의.