모던자바스크립트 12장 함수

연호·2022년 12월 19일
0

모던자바스크립트

목록 보기
7/28

함수

  1. 함수는 일련의 과정을 문으로 구현하고 코드 블록으로 감싸서 하나의 실행 단위로 정의한 것. 함수 내부로 입력을 전달받는 변수를 매개변수parameter, 입력을 인수argument, 출력을 반환값return value라 한다.
//함수 정의
function add(x,y) {
  return x + y;
}

//함수 호출
var result = add(2, 5); 
  1. 함수는 필요할 때 여러번 호출할 수 있으므로 코드의 재사용이 가능하며, 유지의 편의성과 신뢰성, 가독성을 높인다.

  2. 함수 정의 방식에는 함수 선언문, 함수 표현식, Function 생성자 함수, 화살표 함수가 있다. 함수를 정의한다는 면은 동일하지만 중요한 차이들이 있다.

  3. 함수 선언문은 표현식이 아닌 문이며 함수 이름 생략 불가. 이름으로 호출하는 것이 아니라 객체를 가리키는 식별자로 호출.

//함수 선언문
function add(x,y){
  return x + y;
}
  1. 함수 표현식은 '표현식인 문'이다.
//기명 함수 표현식
var add = function foo(x,y){
  return x + y;
}
  1. 함수 선언문과 표현식으로 정의한 함수의 생성 시점이 각각 다르다. 함수 선언문은 런타임 이전에 이미 함수 객체가 생성되어 있기 때문에 함수 호이스팅이 발생한다. 반면 함수 표현식은 변수 선언문과, 변수 할당문을 한번에 표현한 축약문이므로 런타임 시에는 변수 할당문이 코드가 위에서 부터 한줄씩 순차적으로 실행된다.
//함수 호출
console.dir(add(2,5)); //7
console.dir(sub(2,5)); //TypeError

//함수 선언문
function add(x,y){
  return x + y;
}
//함수 표현식
var sub = function foo(x,y){
  return x + y;
}
  1. Function 생성자 함수로 함수를 생성하는 방식은 클로저를 생성하지 않는 등 다른 방식으로 생성한 함수와 다르게 동작한다.
var add = new function('x', 'y', 'return x+y');
  1. 화살표 함수는 항상 익명 함수로 정의한다. 표현 뿐 아니라 내부 동작 또한 간략화되어 있다.
const add = (x,y) => x+y;

9.함수는 식별자와 소괄호인 함수 호출 연산자로 호출한다. 함수를 호출하면 현재의 실행 흐름을 중단하고 호출된 함수로 실행 흐름을 옮긴다.

  1. 함수 외부에서 함수 내부로 필요한 값을 전달할 필요가 있는 경우 매개변수parameter를 통해 인수argument를 전달한다.
function add(매개변수 x, 매개변수 y) {
  return x + y;
}

var result = add(인수 x, 인수 y);

//함수는 인수와 매개변수의 갯수가 일치하는지 체크하지 않는다. 초과되는 인수는 암묵적으로 arguments 객체의 프로퍼티로 보관
  1. 함수는 return 키워드와 표현식으로 이뤄진 반환문을 사용해 실행 결과를 함수 외부로 반환할 수 있다. 반환문 이후에 다른 문은 실행되지 않고 무시된다.

  2. 원시 타입 인수는 값 자체가 복사되어 매개변수에 전달되기 때문에 함수 몸체에서 그 값을 변경해도 원본은 훼손 되지 않는다. 하지만 객체 타입 인수는 참조 값이 복사되어 매개변수에 전달되기 때문에 원본이 훼손된다.

function changeVal(primitive, obj) {
  primitive += 100;
  obj.name = 'kim';
}

//외부 상태
var num = 100;
var person = { name : "Lee"};

console.log(num)    // 100
console.log(person) // { name : "Lee"}

//원시 값은 값 자체가 복사되어 전달되고 객체는 참조 값이 복사되어 전달된다.
changeVal(num, person); 

//원시 값은 원본이 훼손되지 않는다.
console.log(num); // 100
//객체는 원본이 훼손된다.
console.log(person) //{ name : "kim"}
  1. 즉시 실행 함수는 단 한 번만 호출되며 다시 호출할 수 없다. 보통 익명 함수를 사용한다.
// 익명 즉시 실행 함수
(function () {
  var a = 3;
  var b = 5;
  return a + b;
}());
  1. 재귀 함수는 자기 자신을 호출하는 함수이다. 함수 내에 탈출 조건을 반드시 만들어야 한다.
var factorial = function foo (n) {
  if (n <= 1) return 1;  // 탈출 조건. n이 1이되면 멈춘다.
  return n * factorial(n-1);
}
  1. 함수 내부에 정의된 함수를 중첩 함수 또는 내부 함수라 한다. 중첩 함수를 포함하는 함수는 외부함수라 부른다. 중첩 함수는 외부 함수 내부에서만 호출이 가능하다.

  2. 함수의 매개변수를 통해 다른 함수의 내부로 전달되는 함수를 콜백함수라고 하며 매개 변수를 통해 함수의 외부에서 콜백 함수를 전달받은 함수를 고차 함수라고 한다.

// 외부에서 전달받은 f를 n만큼 반복 호출한다.
function repeat(n, f) {
  for (var i = 0; i < n; i++) {
    f(i); //i를 전달하면서 f를 호출 
  }
}
 
var logOdds = function (i) {
  if (i % 2) console.log(i);
  );
  
//고차 함수에 함수 참조를 전달한다.
repeat( 5, logOdds);
  1. 부수효과가 없는 함수를 순수 함수라 한다. 순수 함수는 동일한 인수가 전달되면 언제나 동일한 값을 반환한다. 외부의 상태에 의존하거나 외부 상태를 변경하는 함수를 비순수 함수라 한다.
var count = 0; // 현재 카운트를 나타내는 상태

//순수 함수 increase는 동일한 인수가 전달되면 언제나 동일한 값을 반환한다.
function increase(n) {
  return ++n;
}

//순수 함수가 반환한 결과값을 변수에 재할당해서 상태를 변경
count = increase(count); // 1
count = increase(count); // 2

---------------------------------------------------------------------------------------------------------------------------------------

var count = 0;

//비순수함수
function increase1(){
  return ++count; // 외부 상태에 의존하며 외부 상태를 변경한다.
}

increase(); 
console.log(count); // 1
console.log(count); // 2
profile
뉴비

0개의 댓글