자바스크립트(javascript) 에서 중요한 함수

1. 함수선언

함수명(매개변수) 형식으로 함수를 선언합니다.

아래에서 sayName 이 함수명이며 name 이 매개변수라고 부릅니다.

함수를 호출하게 되면 함수안의 명령어가 실행되게 됩니다.

// 함수선언 방식
function sayName(name) {
	console.log(name);    
}

// 실행할 경우
sayName("홍길동") // 홍길동 출력

1) 반환값이 있는 함수선언

// 매개변수는 쉼표로 여러개를 넣을 수 있습니다.
function myPlus(a, b) {
	return a + b; // 매개변수로 넘어온 a 와 b 를 더해서 반환한다.
}

var result = myPlus(1,2); //result 값은 3이다.

console.log(result); // 3을 출력

2) 함수 지역 변수

함수에서 선언된 변수는 함수안에서만 유효합니다.

// 함수안에서 선언된 변수는 함수안에서만 사용 가능하다.
function hello() {
	var hi = '안녕하세요!';
  	console.log(hi);
}
hello(); // success, 안녕하세요! 출력
console.log(hi); //error, hello 함수안에서 선언된 변수를 외부에서 접근하려 했기 때문

3) Call By Value

함수 파라미터는 기본적으로 Call By Value 입니다. 따라서 함수내에서 값이 변경되어도 원래 변수의 값은 변경되지 않습니다.

var color = 'blue'; // color 변수에 'blue' 값을 할당했습니다.

//color 변수를 chage 함수 파라미터로 대입했습니다.
function change(color) {

  color = 'green'; // color 변수에 'green' 값을 재할당
  console.log(color); // green 값 출력
  
}

change(color); // change 함수 실행
console.log(color); // blue 출력

 

2. 함수표현식

var hello = function() {
	console.log('Hi~');
}

hello; // 실행이 안된다.
hello(); // () 를 붙여야 실행이 됩니다. 

 

자바스크립트에서 함수는 특별하게 취급됩니다. 함수는 값으로 취급될 수 있습니다. 위에 코드를 보면 hello 라는 변수에 함수를 할당하고 있습니다. 함수를 실행하기 위해서는 hello에 () 를 붙여야 실행이 됩니다.

 

function hello() {
	console.log('Hi~');
}

var func = hello; // hello 함수를 func 변수에 할당했습니다.

func(); // func 변수를 실행합니다. Hi~ 출력

hello(); // 원래의 hello 함수도 실행이 됩니다. Hi~ 출력

 

선언된 함수도 변수에 할당할 수 있습니다. 함수는 값처럼 취급되기 때문입니다. 따라서 func 는 함수처럼 실행됩니다. 뿐만 아니라 원래의 함수 hello 도 실행이 됩니다.

 

3. 함수 선언 VS 함수 표현식

 

함수선언 함수는  함수가 정의되기 전에도 함수가 실행됩니다. 자바스크립트는 전역으로 선언된 함수를 먼저 찾아서 스크립트를 실행하기 전에 먼저 선언을 합니다.

 

// 함수 선언은 함수가 정의 되기전에 먼저 실행시킬 수 있습니다.

sayHello(); // 실행문 후에 전역으로 선언된 함수는 에러 없이 실행됩니다. '먼저 실행됩니다.' 출력

function sayHello() {
	console.log('먼저 실행됩니다.');
}

 

함수 표현식은 실행이 선언된 지점에 왔을때 함수를 생성하고 그 이후에 해당 함수를 실행할 수 있습니다. 함수 선언 처럼 먼저 실행시킬 경우 에러가 발생합니다.

 

hello(); // Uncaught TypeError: hello is not a function 에러 출력

var hello = function() {
	console.log('먼저 실행이 안됩니다.');
}

hello(); // 함수 표현식이 정의된 이후에 실행이 됩니다. '먼저 실행이 안됩니다.' 출력