[개념공부] 자바스크립트 함수

함수는 function 이라는 키워드를 사용해야하고, 함수이름을 적어준다.

선언적 함수

함수선언

function hello(){
// 함수를 호출했을때 실행하는 영역
console.log('hello1');
}
console.log(hello1, typeof hello1);
=> 표준내장객체 , 함수도 객체의 한 종류

매개변수 있는 함수

function hello2(name){
	console.log('hello2', name);
}

//매개변수는 hello2함수를 호출할때 값을 지정

함수의 리턴

return 키워드 사용

function hello3(name){
  	//탬플릿 스트링 사용
	return `hello3 ${name}`;
}

// hello3 함수 호출
console.log(hello3('Angela'));

---

익명함수

익명함수를 만들어 변수에 할당하는 함수

함수선언

const hello1 = function(){
	console.log('hello1');
};

// 함수호출
console.log(hello1, typeof hello1);

차이점

호이스팅의차이점,
변수가 끌어올리는 현상,

익명함수를 호출할때 함수를 선언한 위치보다 먼저 호출이 되면, 함수가 뭔지는 알지만, 함수가 아니라고 판단해서 undefined 라고 나옴. (var로 변수로지정했을시)
const로 변수로 지정시 not defined로 나오기 때문에, 선언하지 않은 변수로 생각해서 오류가 나기 때문에

자바스크립트 특성상 함수를 먼저 메모리에 올리기 때문에 선언전함수는 호이스팅문제는 없지만, 익명함수는 호이스팅문제가 있는 부분을 생각하고 코드를 짜야 한다.

특징	익명함수	선언된 함수
이름	이름이 없음	이름이 있음
호이스팅	호이스팅되지 않음 (선언 후에만 호출 가능)	호이스팅됨 (선언 전에 호출 가능)
용도	변수나 함수 인자로 사용, 콜백 함수로 자주 사용	재사용 가능한 일반 함수
가독성	이름이 없어 코드 가독성이 떨어질 수 있음	이름이 있어 코드 가독성이 높음

---

화살표 함수

es6새로추가된 기능,

// 화살표 함수 선언
const hello1 = () =>{
	console.log('hello');
}

// 함수의 매개변수, 매개변수가 하나일땐 ()괄호 생략가능
const hello2 = name =>{
	console.log('hello2', name);
};

// 매개변수가 1이상일땐 괄호 넣어야 함.
const hello3 = (name, age)=>{
	console.log('hello3', name, age);
};

// 함수의 리턴
const hello4 = name => {
	return `hello4 ${name}';
};

리턴
const hello5 = name => `hello5 ${name}`;

화살표 함수에는 생성자함수로 사용할 수 없다.