본문 바로가기
JavaScript

[JavaScript] 함수

by eddypark 2023. 10. 12.

(1) 함수란

- 작업을 수행하거나 값을 계산하는 코드 집합을 의미한다.

- 코드 재사용에 유용하다.

(2) 함수 선언

- 함수는 함수의 이름, 매개변수 목록, 중괄호 안의 코드, return으로 이루어져 있다.

- 상황에 따라 함수의 이름을 생략할 수 있다. 이를 익명 함수(함수 표현식)라 한다.

- 함수를 변수나 자료 구조에 저장할 수 있다.

function a(x) {                   // 함수 선언식(이름있는 함수)
  int b = x * x;
  return b;
}

console.log(a(2));                // 4

var test = function(x){           // 함수 표현식(이름 없는 함수, 익명함수)
	int b = x * x;
	return b;
}
console.log(test(3));             // 9

////////함수를 변수랑 자료구조에 저장하는 예제////////////

var increase = function (num) {
    return ++num;
};
var decrease = function (num) {
    return --num;
};
var predicates = { increase, decrease };
   

function makeCounter(predicate) {
    var num = 0;
    return function () {
      num = predicate(num);
      return num;
    };
}
   
var increaser = makeCounter(predicates.increase);
console.log(increaser()); // 1
console.log(increaser()); // 2
   
var decreaser = makeCounter(predicates.decrease);
console.log(decreaser()); // -1
console.log(decreaser()); // -2

(3) 함수 호출

- 함수의 호출은 함수 명(매개변수,..)이다.

- 함수의 매개변수가 존재하지 않는다면 생략이 가능하다.

- 함수는 여러 번 호출이 가능하며 호출 한 뒤 리턴 값을 가지고 호출한 곳으로 돌아온다.

- 함수는 호출될 때 범위 내에 있어야 한다. 즉 함수의 범위는 함수가 선언된 곳이거나, 전체 프로그램에서의 전역에 선언된 곳이다.

- 함수 선언식은 호이스팅이 될 수 있다. (함수 표현식은 안된다. 변수 호이스팅이 발생하기 때문이다.)

- 호출할 때 매개변수를 전달하지 않으면 undefined로 초기화된다.

console.log(a(5));
function a(n) { return n*n }         // 함수 선언식 호이스팅

console.log(b);                      // error
console.log(b(2));                   
b = function (n) {                   // 함수 표현식은 호이스팅이 되지않는다.
  return n * n;
}


var test = function (a, b) {
  console.log(a, b);
};
 
console.log(test(1));                // 1 undefined

(4) Call-by-Value, Call-by-Reference

- 함수는 call-by-value, call-by-reference 존재

- call-by-value : 원시 타입의 인수는 함수 안에서 값이 변경되어도 리턴 받은 값은 변하지 않는다.

- call-by-reference : 객체 타입의 인수는 함수 안에서 값이 변경되면 리턴 객체의 값도 변한다.

function change(x, y) {
  x+= 100;
  y.name = 'wangi';
  y.age= '25';
}
 
var a = 1;
var information = {
  name: 'eddy',
  age: '26'
};
console.log(a);           // 1
console.log(information); // Object {name: 'eddy', age: '26'}
 
change(a, information);
 
console.log(a);           // 1
console.log(information); // Object {name: 'wangi', age: '25'}

(5) 함수 Property

- caller : 자신을 호출한 함수를 리턴

function x(func) {
    var a = func();
    return a;
}
function y() {
    return y.caller;
}
console.log(x(y));   // [Function: x]
console.log(y());    // [Function (anonymous)]

- length : 함수의 매개변수 개수를 리턴

function x() {}
console.log(x.length); // 0
 
function y(a) {
  return a;
}
console.log(y.length); // 1
 
function z(a, b) {
  return a * b;
}
console.log(z.length); // 2

- name : 함수명 리턴 (익명함수(함수 선언식)인 경우 변수명을 리턴

function x(a, b) {
    return a * b;
};
 
//함수 표현식
var test = function(a, b) {
    return a * b;
};
   
console.log(x.name);             // x
console.log(test.name);          // test

(6) 함수의 형태

- 즉시 실행 함수 : 함수의 정의와 동시에 실행이 되는 함수, 최초 한 번만 호출되며 다시 호출 불가능, 주로 초기화 처리에 쓰인다.

(function () {  // 함수를 소괄호로 감싸준다.
  var a = 3;
  var b = 5;
  return a * b;
}());

//함수와 변수 충돌 방지 예제//
(function () {
  var a = 1;
  console.log(a);
}());

var a = 100;
console.log(a);  // 100

- 내부 함수 : 부모 함수는 자식 함수(내부 함수)의 변수에 접근이 불가능하며 내부 함수는 부모 함수의 외부에서 접근이 불가능하다.

function parent(name){
	var text = name;
	var child = function(){ 
		var childname = 'eddy'
		console.log(text);       // wangi
		console.log(childname);  // eddy
		}
	child();                     // childname
	console.log(childname)       // error  자식 함수의 변수에 접근 불가능
}

parent('wangi');
child('test');                   // error 부모 함수 외부에서 자식 함수 접근 불가능

- 재귀 함수 : 자기 자신을 호출하는 함수

function factorial(n){               // 자기 자신을 호출하는 팩토리얼 함수
  if ((n == 0) || (n == 1))
    return 1;
  else
    return (n * factorial(n - 1));
}
console.log(factorial(3));           // 6

'JavaScript' 카테고리의 다른 글

[JavaScript] 스코프(Scope)  (0) 2023.10.16
[JavaScript] 프로토타입  (0) 2023.10.13
[JavaScript] 객체 변경 불가성  (1) 2023.10.11
[JavaScript] 객체  (0) 2023.10.04
[JavaScript] 타입변환과 단축평가  (0) 2023.09.27