KnP House for Daily

[ES6] Arrow function Basic Syntax 본문

Web/ES6

[ES6] Arrow function Basic Syntax

K.ung 2016.06.11 16:18

Javascript 가 ES6로 넘어오면서 여러가지가 추가되고 바뀌는 부분 중 에 가장 좋았고 헷갈렸던 Arrwo function에 대해 작성하였다.

기본 사용법은 쉽지만 배배꼬이면 조금 가독성이 떨어져서 한눈에 보기 어려운점 이 있었다.



//(param1, param2, ...paramN) => expression

/*
	basic syntax with multiple parameters
 */
//es5
var multiply = function(x,y){
	return x*y;
}

//es6
var multiply = (x,y) => {return x*y};
// 중괄호는 하나의 표현일 경우 생략가능
// (x,y) => x*y;

/*
	basic syntax with one parameter
 */
//es5
var splitters = function splitter(phrase){
	return phrase.split(' ');
}

//es6
var spliiters = phrase => phrase.split(' ');
// 파라미터가 하나일 경우 괄호는 옵션임

/*
	no parameters
 */
//es5
var loggers = function logger(){
	console.log(this);
}

//es6
var loggers = () => {console.log(this);}
loggers();
//파라미터가 없을 경우 괄호를 필수로 작성

/*
	object literal syntax
 */
//es5
var objLiteral = function setObj(id, name){
	return {
		id : id,
		name : name
	};
};

//es6
var objLiteral = (id, name) => ({id : id , name : name});
objLiteral(4,"park");
// 객체 리터럴 표현식을 리턴 할 수 있다.


이 포스트는 순전히 개인 공부용으로 소장하기 위한 것임을 알리는 바이다.


출처 : https://www.sitepoint.com/es6-arrow-functions-new-fat-concise-syntax-javascript/

'Web > ES6' 카테고리의 다른 글

[ES6] destructing assignment  (0) 2016.06.14
[ES6] rest parameter  (0) 2016.06.14
[ES6] let 과 const 에 대해  (0) 2016.06.13
[ES6] Arrow function 으로 map, promise 사용  (0) 2016.06.11
[ES6] Arrwo function Depth  (0) 2016.06.11
[ES6] Arrow function Basic Syntax  (0) 2016.06.11
0 Comments
댓글쓰기 폼