JavaScript_Study [ Function (함수) ]

2021-08-24 노션페이지,
2021-09-09 노션페이지,
2021-09-10 노션페이지,
2021-10-26 노션페이지
기록된 노션을 다시 정리

함수 선언

• 함수 선언문

function square(number) {
  return number * number;
}

• 함수 표현식 (변수에 익명 함수 할당)

var square = function(number) {
  return number * number;
};

• 위 두가지 함수는 호이스팅의 방식이 다르다.
  • 변수 호이스팅과 함수 호이스팅으로 구분됨

매개변수 (Parameter, 인자) VS 인수(argument)

• 함수 안에서 사용되는 변수의 개념으로 생각하면 된다.
• 이때 전달되는 매개변수의 타입에 따라 Call-by-value, Call-by-reference가 적용된다. (코드 및 주석 확인)

function changeVal(primitive, obj) {
  // primitive 은 원시타입으로 기존의 값을 
  // 사용하는 것이 아니라 값을 복사해서 사용하는 것 이다.
  primitive += 100;
  // obj 은 객체타입으로 기존의 값을 
  // 참조해서 사용하는 것이다. => 기존의 값을 변경하는 것 이다.
  obj.name = 'Kim';
  obj.gender = 'female';
}

var num = 100;
var obj = {
  name: 'Lee',
  gender: 'male'
};

console.log(num); // 100
console.log(obj); // Object {name: 'Lee', gender: 'male'}

changeVal(num, obj);

console.log(num); // 100
console.log(obj); // Object {name: 'Kim', gender: 'female'}

반환값 (return)

• 함수는 반환을 생략할 수 있다. 이때 함수는 암묵적으로 undefined를 반환한다.
• return 키워드를 만나면 함수의 실행을 중단한 후, 해당 값을 반환하고 함수를 종료한다.

arguments 프로퍼티

• 함수 호출 시 전달된 인수(argument)들의 정보를 담고 있는 순회가능한 유사 배열 객체(array-like object)
• ES6에 추가된 rest문법으로 현재는 잘 사용하지 않는 것 같다.
  • arguments 프로퍼티는 유사배열이므로 배열 프로퍼티를 쓸려면 또 작업을 해주어야 하나 rset문법은 순수배열로 따로 작업이 필요없다
  • 화살표 함수에는 arguments 프로퍼티가 없다.

function multiply(x, y) {
  console.log(arguments);
}

multiply();        // {}  
multiply(1);       // { '0': 1 }
multiply(1, 2);    // { '0': 1, '1': 2 }
multiply(1, 2, 3); // { '0': 1, '1': 2, '2': 3 }

length 프로퍼티

• length 프로퍼티는 함수 정의 시 작성된 매개변수 갯수를 의미한다.

function foo() {}
console.log(foo.length); // 0

function bar(x) {
  return x;
}
console.log(bar.length); // 1

function baz(x, y) {
  return x * y;
}
console.log(baz.length); // 2

name프로퍼티

함수명을 반환한다. 이때 함수표현식으로 했을 경우 빈문자열을 반환

// 기명 함수 표현식(named function expression)
var namedFunc = function multiply(a, b) {
  return a * b;
};
// 익명 함수 표현식(anonymous function expression)
var anonymousFunc = function(a, b) {
  return a * b;
};

console.log(namedFunc.name);     // multiply
console.log(anonymousFunc.name); // ''

함수의 다양한 형태

1. 즉시 실행 함수
   • 최초 한번만 호출되며 다시 호출할 수는 없다.
   • 이점으로 필요없는 전역 변수의 생성을 줄일 수 있다.
   • private한 변수를 만들 수 있다.
   • 위와 같은 특징으로 옛날엔 모듈에서의 사용을 위해 사용했다.
     => 현재는 다른 방법으로 대체됨
2. 내부함수
   • 함수 내부에 정의된 함수를 내부함수(Inner function)라 한다.
   • 스코프에 따라 부모 함수에 있는 변수 등 사용 가능하다.
   • 또한 내부함수는 부모함수의 외부에서 접근할 수 없다.
3. 재귀함수
   • 재귀 함수(Recusive function)는 자기 자신을 호출하는 함수를 말한다.
   • 탈출 조건 제어문을 하지 않을 경우 무한호출된다.
   • 계속해서 콜스택이 쌓인다.
4. 콜백함수
   • 이벤트가 발생했을 때 시스템에 의해 호출되는 함수를 말한다.

참조: poiemaweb.com