자바스크립트 5. 함수

<참고영상> https://www.youtube.com/watch?v=NcHBFk1Yn-8

 

함수(Function)

일련된 공통의 작업을 처리하기 위해서 연관된 코드들을 모아 놓은 자료형

 

함수 선언식(Function Declarations)                    /                      함수 표현식(Function Expression) 

 

 

< 함수 선언식 >

function [함수명](){

 // code 

        }

 

ex) functino printHello() {

console.log('hello');

      }

> 'hello'

 

 

 

< 함수 표현식>

변수에 함수를 할당하는형식으로 함수를 선언

const[변수명] = function [함수명]() {

// code

        }

 

함수 : 자바스크립트의 9개의 자료 중 하나, 변수의 할당이 가능하다.

 

 

ex) const printHello = function printHello() {

console.log('hello');

}

 

 

코드의 양이 너무 많아지면 자바스크립트 성능 쪽으로나 유지보수 적인 측면으로 부정적

 

실행시키고 싶은 연관된 코드들을 이중 가로 안쪽에 작성하면된다. 

 

자바스크립트에서  함수를 실행하는 것 → "함수를 호출한다."

< 함수 선언식 >

fuction 함수명 {

가, 나, 다, 라

};

  > 함수 정의

 

함수명(); > 가나다라가 한번에 실행되어 진다.

// 함수 선언식

function gugudan(){
console.log('3 * 1 = 3');
console.log('3 * 2 = 6');
console.log('3 * 3 = 9');
console.log('3 * 4 = 12');
console.log('3 * 5 = 15');
console.log('3 * 6 = 18');
console.log('3 * 7 = 21');
console.log('3 * 8 = 24');
console.log('3 * 9 = 27');
};

gugudan();


// 함수 표현식

const gugudan = function gugudan(){
console.log('3 * 1 = 3');
console.log('3 * 2 = 6');
console.log('3 * 3 = 9');
console.log('3 * 4 = 12');
console.log('3 * 5 = 15');
console.log('3 * 6 = 18');
console.log('3 * 7 = 21');
console.log('3 * 8 = 24');
console.log('3 * 9 = 27');
};

 

함수 안에 있는 값들을 변경하게 되면 몇번을 호출하게  되어도 변함 없음  > 유지보수적인 측면에서 편리함

코드를 반복해서 작성하지 않아도 되기 때문에  효율성이 좋아진다.

 

> 함수 표현식은 변수의 이름으로만 함수를 호출할 수 있다.

< 함수 표현식> 

 

위 함수에 변수 선언을 해주면 된다. 

함수는 한번 정의되면 내용이 변경되는 일이 없도록 코드를 작성하는 경우가 많기 때문에 변수를 선언하는 var, let, const 중에서 중복선언과 재할당이 불가능한 const 를 사용해서 변수공간을 만들어서 함수를 할당한다.

 

함수는 끝애 세미콜론을 붙이지 않아도 되지만 함수 표현식은 변수에 함수를 할당하기 때문에 꼭 세미콜론을 붙여야 한다.

 

함수 표현식은 함수의 이름보다는 함수가 할당된어진 변수 이름이 중요!

∴ 함수의 이름이 없는 경우도 있다 > "익명 함수"