1. arrow function

function이라는 키워드가 빠지고 소괄호만 남았습니다. 그리고 => (arrow) 가 추가되었습니다.

//ES5
function getName() {}

//ES6
const getName = () => {}

getName() // 호출 및 사용 방식은 동일

ES6는 함수를 getName 이라는 변수에 저장했네요. 사실 function(함수)은 변수에 저장할 수 있는 하나의 식입니다. 그래서 ES5일 때도 마찬가지로 변수에 저장할 수 있었습니다.

//ES5
//Function Declaration
function getName() {}

//ES5
//Function Expression
const getName = function() {}

인자가 하나일 때는 소괄호를 생략할 수 있습니다. 그러나 인자가 두 개 이상일 때는 생략이 불가능합니다.

//ES5
const getName = function(name) {}

//ES6
const getName = (name) => {}
const geName = name => {}// 인자가 하나이기 때문에 소괄호 생략

//ES5
 const getName = function(name, age) {}

//ES6
const getName = (name, age) => {} // 인자가 두개이상이기 때문에 소괄호 입력

만약 return 이외의 실행내용 없이 return만 수행한다면 return 키워드와 중괄호를 생략할 수 있습니다.

//ES5
function introduce(name){
	return '제 이름은 ' + name + '입니다.';
}

//ES6
const introduce = name => {
	return '제 이름은 ' + name + '입니다.';
}

// * retunr, {} 생략
const introduce = name => '제 이름은 ' + name + '입니다.';
//중괄호와 return문이 생략될 경우, 화살표 오른쪽에는 리턴될 "값"만 쓴다.

Assignment

1. function 키워드를 사용하여 표현된 welcome 함수를, 화살표 함수 표현으로 바꿔주세요.
2. 이후, 화살표 함수로 표현된 handleBio 함수를, function 키워드를 사용하여 표현된 함수로 바꿔주세요.

function welcome(name) {
  return "안녕하세요" + name;
}

//방법 1
const welcome = name =>{
	return "안녕하세요" + name;
} // 인자값이 하나이기 때문에 인자의 소괄호 빼고 입력

//방법 2
const welcome = name => "안녕하세요" + name;
// 인자값이 하나이기 때문에 인자의 소괄호 빼고 입력
// return 이외에 실행내용이 없기때문에 return 키워드와 중괄호를 생략

const handleBio = (nickname, bio) => {
  const user = {
    nickname: nickname,
    bio: bio,
  }
  return user;
}

function handleBio(nickname, bio){
	const user = {
    	nickname : nickname,
        bio : bio
    }
    return user;
}