[JavaScript] #3 함수(function) 선언, 표현, 사용법, 특징 (자바스크립트 화살표 함수, 디폴트 값, 함수 호이스팅)

자바스크립트의 함수에 대해서 정리해보겠습니다!

 

---

1. 기본 사용법

//함수를 선언
function A(str){
	console.log(str);
}

//함수를 호출
A('Hello');

 

2. 객체(주소)를 매개변수로

//함수를 선언
function B(object){
	object.name = 'abc';
}

//함수를 호출
let object1 = {name: 'qwe'};
B(object1);
console.log(object1); // name: 'abc'로 바뀜

- 객체(주소)를 매개변수로 사용가능

 

 

3. default 디폴트 값 추가하기

//함수를 선언
function C(a,b ='default 값'){
	console.log{`${a}, ${b}`};
}

//함수를 호출
C('str'); //a에만 값을 넣고 호출

// 두번째 매개변수 자리에 b가 들어감
// str, default 값 을 출력

- 매겨변수를 전달하지 않았을 경우

- default 값을 추가하여 선언할 수 있음

 

4. 배열을 전달

function D(...args){
	for(let i=0; i<args.length; i++){
    	console.log(args[i]);
    }
}

D('a','b','c','d');
//a b c d가 차례대로 출력

- 매개변수에 ...args 형태로 배열을 전달할 수 있다.

 

*참고*

- 위의 반복문을 아래처럼 사용가능

for(let i of args){
	console.log(i);
}

 

 

5. 값을 리턴

function sum(a,b){
	return a + b;
}

let result = sym(1+1);
console.log(result); //2를 출력

- 함수에 반환형을 적을 필요가 없음

 

 

6. 이름이 없는 함수

let print = function(){
  console.log('print');
};

print(); //변수에 저장하고 출력
//출력 : print

let printA = print; //다른 변수에도 저장 가능
printA();
//출력 : print

 

7. 함수 호이스팅(hoisting) 

//함수를 먼저 호출
A('Hello');

//함수를 뒤에 선언
function A(str){
	console.log(str);
}

//호이스팅이 되어 가능함

- 함수는 기본적으로 hoisting이 되어 맨 위에 선언된 것으로 취급함

 

 

8. Arrow function (화살표 함수)

//일반적인 이름 없는 함수
let sum = function(a,b){
	return a+b;
}

//화살표 함수
let sum = (a,b) => return a+b;

//두개가 같은 거임

---

여기까지 자바스크립트 함수에 대해서 정리해보았습니다!