현재 번역은 완벽하지 않습니다. 한국어로 문서 번역에 동참해주세요.

함수는 JavaScript에서 기본적인 빌딩 블록 중의 하나입니다. 함수는 작업을 수행하거나 값을 계산하는 문장의 집합과 같은 자바스트립트 절차입니다. 함수를 사용하기 위해서는 함수를 호출하고자 하는 범위 어딘가에 함수를 정의해야만 합니다.

세부적인 것을 알기 원하신다면 exhaustive reference chapter about JavaScript functions를 참조하세요.

함수 정의

함수의 선언

함수의 정의는 다음과 같은 함수 키워드로 구성되어 있습니다:

  • 함수의 이름
  • 함수에서 괄호로 둘러싸이거나 콤마로 분리된 인수 목록
  • 중괄호 { }에 둘러싸인 함수를 정의하는 JavaScript 표현

예를 들어, 다음의 코드는 간단한 함수를 square로 정의하였습니다:

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

함수 square은 number라는 하나의 인수를 가지고 있습니다. 이 함수는 자기 자신을 곱하는 함수의 인수(즉, number)를 리턴하는 한 가지 문장으로 구성되어 있습니다. return문은 함수에 의해 반환 된 값을 지정합니다.

return number * number;

원시 매개변수(number와 같은)는 값으로 함수에 전달됩니다; 값은 함수로 전달되지만, 함수가 매개변수의 값을 변하게 한다면, 이 변화는 전체적으로 또는 함수를 호출하는 곳에서는 반영되지 않습니다.

만약 여러분이 매개변수로 객체(예: 배열이나 사용자가 정의한 객체와 같이 비 원시적인 값)를 전달하거나 함수가 객체의 속성을 변하게 하는 경우, 다음 예에서와 같이 그 변화는 함수 외부에서 볼 수 있습니다:

function myFunc(theObject) {
  theObject.make = "Toyota";
}

var mycar = {make: "Honda", model: "Accord", year: 1998};
var x, y;

x = mycar.make; // x 의 값은 "Honda" 입니다.

myFunc(mycar);
y = mycar.make; // y 의 값은 "Toyota" 입니다.
                // (make 속성은 myFunc에서 변경되었습니다.)

비고: 매개변수에서 새로운 객체를 할당하는 것은 객체의 속성 값보다 매개변수의 값이 변하는 것이기 때문에 함수 외부에 어떠한 영향도 미치지 않을 것입니다.

function myFunc(theObject) {
  theObject = {make: "Ford", model: "Focus", year: 2006};
}

var mycar = {make: "Honda", model: "Accord", year: 1998};
var x, y;

x = mycar.make; // x 의 값은 "Honda" 입니다.

myFunc(mycar);
y = mycar.make; // y 의 값은 여전히 "Honda" 입니다.

함수 표현

위에서 함수의 선언은 문장 구성을 통한 표현인 반면에, 함수는 또한 함수 표현에 의해 만들어 질 수 있습니다. 함수가 익명이 될 수 있는 것처럼; 함수는 이름을 가질 필요가 없습니다. 예를 들어, 함수 square은 다음과 같이 정의 될 수 있습니다:

var square = function(number) { return number * number };
var x = square(4) // x 의 값은 16 입니다.

하지만, 이름은 함수 표현을 제공할 수 있고, 자신을 참조하는 함수 내에서나 스택 트레이스에서 함수를 식별하는 디버거에서 사용될 수 있습니다.

var factorial = function fac(n) { return n<2 ? 1 : n*fac(n-1) };

console.log(factorial(3));

함수 표현은 함수를 다른 함수의 인수로 전달할 때 편리합니다. 다음 예는 map 함수가 정의되는 것과 첫 번째 매개변수로 익명의 함수를 호출하는 것을 보여줍니다.

function map(f,a) {
  var result = [], // Create a new Array
      i;
  for (i = 0; i != a.length; i++)
    result[i] = f(a[i]);
  return result;
}

다음 코드 입니다:

map(function(x) {return x * x * x}, [0, 1, 2, 5, 10]);

returns [0, 1, 8, 125, 1000].

JavaScript에서 함수는 조건에 기초하여 정의될 수 있습니다. 예를 들어, 다음 함수 정의는 오직 num이 0일 때만 myFunc을 정의합니다.

var myFunc;
if (num == 0){
  myFunc = function(theObject) {
    theObject.make = "Toyota"
  }
}

여기서 말하는 것처럼 함수를 정의하는 것 이외에도 여러분은 eval()과 같은 런타임의 문자열로부터 함수를 생성하는 함수 생성자를 사용할 수 있습니다.

한 가지 방법은 객체의 속성인 함수입니다. Working with objects에서 객체와 방법에 대해 자세히 알아보세요.

함수 호출

함수를 정의하는 것은 함수를 실행하는 것이 아닙니다. 함수를 정의하는 것은 간단히 함수의 이름을 지어주고, 함수가 호출될 때 무엇을 할지 지정을 해주는 것입니다. 사실 함수를 호출하는 것은 나타나있는 매개변수를 가지고 구체화된 행위를 수행하는 것입니다. 예를 들어, 만약 여러분이 함수 square를 정의한다면, 함수를 다음과 같이 호출할 수 있습니다.

square(5);

위의 문장은 5라는 인수를 가지고 함수를 호출합니다. 함수는 문장을 실행하고 값 25를 반환합니다.

함수는 호출될 때 범위가 있어야 합니다. 그러나 함수의 선언은 이 예에서와 같이 위에서 작성될 수 있습니다. (코드에서 호출 아래에 나타납니다.):

console.log(square(5));
/* ... */
function square(n) { return n*n } 

함수의 범위는 함수가 선언된 곳이거나 맨 위에 함수가 선언된 경우에는 전체 프로그램에서입니다.

비고: 위에 구문을 사용하여 함수를 정의하는 경우에만 작동합니다.(즉, function 함수이름(){}) 아래의 코드는 작동되지 않습니다.

console.log(square(5));
square = function (n) {
  return n * n;
}

함수의 인수는 문자열과 숫자에 제한되지 않습니다. 여러분은 함수에 전체 객체를 전달할 수 있습니다. show-props() 함수(Working with objects에서 정의된)는 인수로 객체를 취하는 함수의 예입니다.

함수 자체를 호출할 수 있습니다. 예를 들어, 팩토리얼을 재귀적으로 계산하는 함수가 있습니다:

function factorial(n){
  if ((n == 0) || (n == 1))
    return 1;
  else
    return (n * factorial(n - 1));
}

여러분은 다음과 같이 5를 통해 하나의 팩토리얼을 계산할 수 있습니다.

var a, b, c, d, e;
a = factorial(1); // a gets the value 1
b = factorial(2); // b gets the value 2
c = factorial(3); // c gets the value 6
d = factorial(4); // d gets the value 24
e = factorial(5); // e gets the value 120

함수를 호출하는 다른 방법들이 있습니다. 함수는 동적 호출되어야 하거나, 함수의 인수의 수가 다양해야 하거나, 함수 호출의 맥락이 런타임에서 결정된 특정한 객체로 설정될 필요가 있는 경우가 자주 있습니다. 함수 자체를 나타내고 차례로 이러한 객체 방법(함수 객체를 참조)이 있습니다. 이들 중 하나인 apply() 메서드는 이러한 목표를 달성하기 위해 사용될 수 있습니다.

함수의 범위

변수가 함수의 범위에서만 정의되어 있기 때문에, 함수 내에서 정의된 변수는 함수 외부에서는 어디서든 엑세스할 수 없습니다. 그러나 함수는 함수가 정의된 범위 내에서 정의된 모든 변수 및 함수들을 엑세스할 수 있습니다. 즉, 전역함수는 모든 전역 변수를 엑세스할 수 있습니다. 다른 함수 내에서 정의 된 함수는 부모 함수와 부모 함수가 액세스 할 수 있는 다른 변수에 정의된 모든 변수를 액세스할 수 있습니다.

// The following variables are defined in the global scope
var num1 = 20,
    num2 = 3,
    name = "Chamahk";

// This function is defined in the global scope
function multiply() {
  return num1 * num2;
}

multiply(); // Returns 60

// A nested function example
function getScore () {
  var num1 = 2,
      num2 = 3;
  
  function add() {
    return name + " scored " + (num1 + num2);
  }
  
  return add();
}

getScore(); // Returns "Chamahk scored 5"

범위와 함수 스택

재귀

함수를 참조하여 자신을 호출할 수 있습니다. 자신을 참조하는 함수에 대한 세 가지 방법이 있습니다.

  1. 함수의 이름
  2. arguments.callee
  3. 함수를 참조하는 범위 내 변수

예를 들어, 다음 함수의 정의를 고려해보세요.

var foo = function bar() {
   // statements go here
};

함수 본문 내에서 다음은 모두 동일합니다.

  1. bar()
  2. arguments.callee()
  3. foo()

자신을 호출하는 함수를 재귀 함수라고 합니다. 어떤 면에서, 재귀는 루프와 유사합니다. 둘 다 동일한 코드를 여러 번 실행하고, 조건(무한 루프를 방지하거나, 이 경우에는 오히려 무한 재귀하는)을 요구합니다. 예를 들어, 다음 루프입니다:

var x = 0;
while (x < 10) { // "x < 10" is the loop condition
   // do stuff
   x++;
}

재귀 함수 및 그 함수에 대한 호출로 변환될 수 있습니다.

function loop(x) {
  if (x >= 10) // "x >= 10" is the exit condition (equivalent to "!(x < 10)")
    return;
  // do stuff
  loop(x + 1); // the recursive call
}
loop(0);

그러나 일부 알고리즘은 단순 반복 루프할 수 없습니다. 예를 들어, 트리 구조(가령, DOM)의 모든 노드를 얻는 것은 재귀를 사용하여 보다 쉽게 할 수 있습니다:

function walkTree(node) {
  if (node == null) // 
    return;
  // do something with node
  for (var i = 0; i < node.childNodes.length; i++) {
    walkTree(node.childNodes[i]);
  }
}

함수 루프에 비해, 각 재귀 호출 자체는 여기에 많은 재귀 호출을 합니다.

비 재귀한 어떤 재귀 알고리즘을 변환 할 수 있습니다. 그러나 logic은 훨씬 더 복잡하며 그렇게 함으로써 스택의 사용을 요구합니다. 사실, 재귀 자체가 스택을 사용 합니다: 함수 스택

스택형 동작은 다음의 예에서 볼 수 있습니다:

function foo(i) {
  if (i < 0)
    return;
  console.log('begin:' + i);
  foo(i - 1);
  console.log('end:' + i);
}
foo(3);

// Output:

// begin:3
// begin:2
// begin:1
// begin:0
// end:0
// end:1
// end:2
// end:3

중첩된 함수와 클로저

여러분은 함수 내에 함수를 끼워 넣을 수 있습니다. 중첩 된 (내부) 함수는 그것을 포함하는 (외부) 함수와 별개입니다. 그것은 또한 클로저를 형성합니다. 클로저는 그 변수(“폐쇄”라는 표현)를 결합하는 환경을 자유롭게 변수와 함께 가질 수 있는 표현(전형적인 함수)입니다.

중첩 함수는 클로저이므로, 중첩된 함수는 그것을 포함하는 함수의 인수와 변수를 “상속”할 수 있는 것을 의미합니다. 즉, 내부 함수는 외부 함수의 범위를 포함합니다.

요약하면:

  • 내부 함수는 외부 함수문에서 액세스할 수 있습니다.
  • 내부 함수를 형성하는 클로저: 외부 함수는 내부 함수의 인수와 변수를 사용할 수 없는 반면에 내부 함수는 외부 함수의 인수와 변수를 사용할 수 있습니다.

다음 예는 중첩된 함수를 보여줍니다:

function addSquares(a,b) {
  function square(x) {
    return x * x;
  }
  return square(a) + square(b);
}
a = addSquares(2,3); // returns 13
b = addSquares(3,4); // returns 25
c = addSquares(4,5); // returns 41

내부 함수는 클로저를 형성하기 때문에, 여러분은 외부 함수를 호출하고, 외부 및 내부 함수 모두에 인수를 지정할 수 있습니다.

function outside(x) {
  function inside(y) {
    return x + y;
  }
  return inside;
}
fn_inside = outside(3); // Think of it like: give me a function that adds 3 to whatever you give it
result = fn_inside(5); // returns 8

result1 = outside(3)(5); // returns 8

변수의 보존

내부가 반환 될 때 x가 보존되는 방법을 알 수 있습니다. 클로저는 참조하는 모든 범위에서 인수 및 변수를 보존해야합니다. 각 호출이 잠재적으로 다른 인수를 제공하기 때문에, 외부로 호출 할 때마다 새로운 클로저가 생성됩니다. 메모리는 반환된 내부가 더 이상 액세스할 수 없을 때에만 해제될 수 있습니다.

다른 객체에서 참조를 저장하는 것과 다르지 않습니다. 그러나 직접 참조를 설정하지 않고, 이들을 조사 할 수 없기 때문에 종종 덜 명확합니다.

다중 중첩 함수

함수는 다중 중첩될 수 있습니다. 즉, 함수 (C)를 포함하는 함수 (B)를 포함하는 함수 (A). 여기에서 두 함수 B와 C는 모두 클로저를 형성합니다. 그래서 B는 A를 엑세스할 수 있고, C는 B를 액세스 할 수 있습니다. 이와 같이, 클로저는 다중 범위를 포함 할 수 있습니다; 그들은 재귀적으로 그것을 포함하는 함수의 범위를 포함합니다. 이것을 범위 체이닝이라 합니다.(그것을 “체이닝”이라 하는 이유는 추후에 설명할 것입니다.)

다음 예를 살펴 보겠습니다:

function A(x) {
  function B(y) {
    function C(z) {
      console.log(x + y + z);
    }
    C(3);
  }
  B(2);
}
A(1); // logs 6 (1 + 2 + 3)

이 예에서, C는 B의 y와 A의 x를 엑세스 합니다. 이 때문에 수행할 수 있습니다:

  1. B는 A를 포함하는 클로저를 형성합니다. 즉, B는 A의 인수와 변수를 엑세스할 수 있습니다.
  2. C는 B를 포함하는 클로저를 형성합니다.
  3. B의 클로저는 A를 포함하고, C의 클로저는 A를 포함하기 때문에, C는 B와 A의 인수와 변수를 엑세스할 수 있습니다. 즉, 순서대로 C는 A와 B의 범위를 체이닝합니다.

그러나 역은 사실이 아닙니다. A 는 C에 접근 할 수 없습니다. 왜냐하면 A는 B에 접근 할 수 있지만 B의 인수인 x와 B의 변수인 C에 접근할 수 없습니다. 그리고 C에도 C의 인수인 y 에 접근할 수도 없습니다. 그래서 C는 B의 private 변수가 됩니다.

이름 충돌

클로저의 범위에서 두 개의 인수 또는 변수의 이름이 같은 경우, 이름 충돌이 있습니다. 더 안쪽 범위가 우선순위를 갖습니다. 그래서 가장 바깥 범위는 우선순위가 가장 낮은 반면에, 가장 안쪽 범위는 가장 높은 우선순위를 갖습니다. 범위 체인입니다. 체인의 순서는 먼저 가장 안쪽 범위이고, 마지막 가장 바깥 쪽의 범위입니다. 다음 사항을 고려하세요:

function outside() {
  var x = 10;
  function inside(x) {
    return x;
  }
  return inside;
}
result = outside()(20); // returns 20 instead of 10

이름 충돌이 x를 반환하는 문과 내부의 매개 변수 x와 외부 변수 x 사이에서 발생합니다. 여기에서 범위 체이닝은 {내부, 외부, 전역 객체}입니다. 따라서 내부의 x는 외부의 x보다 높은 우선순위를 갖게 되고, 20(내부의 X)은 10(외부의 x) 대신에 반환됩니다.

클로저

클로저는 자바스크립트의 강력한 기능 중 하나입니다. 자바스크립트는 함수의 내포화(함수 안에 함수를 정의하는것)를 가능하게 해주고 외부 함수 안에서 정의된 모든 변수와 함수들을 내부 함수가 완전하게 접근 할 수 있도록 승인해줍니다.(다른 외부 함수에서 접근된 모든 변수와 함수들까지) 그러나 외부 함수는 내부 함수 안에서 정의된 변수와 함수들에 접근 할 수 없습니다. 이는 내부 함수의 변수를 보호합니다. 또한 내부 함수가 외부 함수보다 더 오래 쓰이면, 내부 함수가 외부 함수 범위에 접근하고 나서 부터는 외부 함수에서 정의된 변수와 함수는 원래보다 더 오래 쓸수 있습니다. 클로저는 어떤 외부 함수 범위 밖 어딘가에서 내부 함수가 사용 가능하면 생성됩니다.

var pet = function(name) {   // 외부 함수는 'name'이라 불리는 변수를 저장합니다.
  var getName = function() {
    return name;             // 내부 함수는 외장 함수의 'name' 변수에 접근 할 수 있습니다.
  }
  return getName;            // 내부 함수가 리턴함으로써, 외부 함수로 노출됩니다.
},
myPet = pet("Vivie");
   
myPet();                     // "Vivie"로 리턴합니다.

클로저는 위 코드보다 더 복잡해 질 수도 있습니다. 외부 함수의 변수를 다루는 방식을 포함한 객체는 반환될 수도 있습니다.

var createPet = function(name) {
  var sex;
  
  return {
    setName: function(newName) {
      name = newName;
    },
    
    getName: function() {
      return name;
    },
    
    getSex: function() {
      return sex;
    },
    
    setSex: function(newSex) {
      if(typeof newSex == "string" && (newSex.toLowerCase() == "male" || newSex.toLowerCase() == "female")) {
        sex = newSex;
      }
    }
  }
}

var pet = createPet("Vivie");
pet.getName();                  // Vivie

pet.setName("Oliver");
pet.setSex("male");
pet.getSex();                   // male
pet.getName();                  // Oliver

위 코드에서, 외장 함수의 'name' 이란 변수는 내장 함수로 접근이 가능합니다. 그리고 그 내장 함수를 통하는 방법 말고는 내장 변수로 접근할 수 없습니다. 내장 함수의 변수는 그 내장 함수에 안전하게 저장됩니다. 외부 함수는 내부 함수가 작동하기위한 데이터를 꾸준히 유지하지만 안전합니다. 함수는 변수로 할당되거나, 이름을 가질 필요가 없습니다.

var getCode = (function(){
  var secureCode = "0]Eal(eh&2";    // A code we do not want outsiders to be able to modify...
  
  return function () {
    return secureCode;
  };
})();

getCode();    // Returns the secureCode

그러나 클로저를 쓰면서 조심해야할 위험이 많이 있습니다. 만약 내부 함수가 외부 함수의 범위에 있는 이름과 같은 변수를 정의하였을 경우  ,다시는 외부 함수 범위의 변수를 참조(접근)할 방법이 없습니다.

var createPet = function(name) {  // Outer function defines a variable called "name"
  return {
    setName: function(name) {    // Enclosed function also defines a variable called "name"
      name = name;               // ??? How do we access the "name" defined by the outer function ???
    }
  }
}

신비한 this 변수는클로저에서 다루기 힘듭니다.  this 변수가 정의된 곳 보다  함수가 호출된 곳을  참조하기 때문에 this 변수를 매우 조심히 사용해야 합니다.

인수 객체 사용하기

함수의 인수는 배열과 비슷한 객체로 처리가 됩니다. 함수에서, 다음의 형태로 인수를 보낼 수 있습니다. :

arguments[i]

i 에는 0 으로 시작하는 순서 번호를 넣어줍니다. 따라서 첫번째 인수는 arguments[0] 변수로 값이 넘어갑니다. 총 인수의 개수는 arguments.length 에서 얻을 수 있습니다.

인수 객체를 이용할 때, 보통 함수에 정의된 개수보다 많은 인수를 넘겨주면서 함수를 호출할 수 있습니다. 이것은 얼마나 많은 인수가 함수로 넘겨질지 모르는 상황에서 유용합니다. arguments.length를 함수에 실제로 넘겨받은 값을 확인할때 사용할 수 있고 , 각 각의 매개변수 값을 인수 객체를  이용하여 접근 할 수 있습니다.

예를 들어, 몇 개의 문자열을 연결하는 함수를 생각해 봅시다. 유일한 형식 인수는 문자열은 각 문자열을 구분해주는 문자를  설정하는 문자열 입니다 . 함수는 다음과 같이 정의됩니다:

function myConcat(separator) {
   var result = "", // initialize list
       i;
   // iterate through arguments
   for (i = 1; i < arguments.length; i++) {
      result += arguments[i] + separator;
   }
   return result;
}

어떤 개수의 인수도 이 함수로 넘겨줄 수 있고, 이 함수는 각각의 인수를 하나의 문자열로 연결합니다. :

// returns "red, orange, blue, "
myConcat(", ", "red", "orange", "blue");

// returns "elephant; giraffe; lion; cheetah; "
myConcat("; ", "elephant", "giraffe", "lion", "cheetah");

// returns "sage. basil. oregano. pepper. parsley. "
myConcat(". ", "sage", "basil", "oregano", "pepper", "parsley");

Note: 인수 객체는 배열과 닮은 것이지 배열이 아닙니다. 매개 변수 객체는 번호붙여진 인덱스와  길이 속성을 가지고 있는 배열과 비슷한 것니다. 그러나 ,매개변수 객체는  모든 방식의 배열을 다루는것처럼 사용될 수 없습니다.

더 자세한 정보를 얻고 싶으면 자바스크립트 참조문의 Function객체에 대하여 보세요.

함수의 매개변수

 ECMAScript 6와 함께 시작된,두 종류의 매개변수가 있습니다 : 디폴트 매개변수 , 나머지 매개변수.

디폴트 매개변수

자바스크립트에서, 함수의 매개변수들은 기본값으로 undefined 되어 있습니다. 그러나, 어떤 상황에서는 다른 값을 기본값으로 가진 것이 유용할 때가 있습니다. 이때가 디폴트 매개변수가 도움을 줄 수 있는 상황입니다.

옛날엔, 기본값을 설정하는 보편적인 전략은 함수의 몸체를 시험하던가, undefined된 값에 할당하기였습니다.다음과 같은 에제에서, 계산 결과와 함수의 반환값이 NaN 이고,b 매개변수에 아무런 값도 주어지지 않았을때, b 매개변수의 값은 undefined 값입니다. 그러나 이런 것은 이 예제의 2번제 줄에서 걸립니다:

function multiply(a, b) {
  b = typeof b !== 'undefined' ?  b : 1;

  return a*b;
}

multiply(5); // 5

디폴트 매개변수와 함께라면, 함수 몸체의 검사하는 부분은 필요가 없습니다. 이제 , 함수 머리에서 b 의 기본값에 간단히 1을 넣어주면 됩니다:

function multiply(a, b = 1) {
  return a*b;
}

multiply(5); // 5

더 자세한 내용을 보고 싶으시면,  default parameters 문서를 참조하세요.

나머지 매개변수

 나머지 매개변수 구문은 불확실한 개수의 인수를 배열로서 표현할 수 있습니다 . 예제에서, 우리는 나머지 매개변수를 2번째 인수부터 마지막 인수까지 얻기 위하여 사용하였습니다. 그리고 우리는 첫번째 값을 곱하였습니다.  이 예제는 다음 섹션에서 소개할  화살표 함수 입니다   .

function multiply(multiplier, ...theArgs) {
  return theArgs.map(x => multiplier * x);
}

var arr = multiply(2, 1, 2, 3);
console.log(arr); // [2, 4, 6]

화살표 함수

 화살표 함수 표현 (뚱뚱한 화살표 함수라고도 알려진)은 함수 표현과 비교하였을때 짧은 문법을 가지고 있고 사전적으로 this 값을 묶습니다. 화살표 함수는 언제나 익명입니다.

화살표  함수 소개에 영향을 주는두 요소: 더 짧은 함수와 사전적 this.

더 짧은 함수

어떤 함수적 패턴에서는, 더 짧은 함수는 환영받습니다. 비교하세요:

var a = [
  "Hydrogen",
  "Helium",
  "Lithium",
  "Beryl­lium"
];

var a2 = a.map(function(s){ return s.length });

var a3 = a.map( s => s.length );

사전적 this

화살표 함수에서, 모든 new함수들은  그들의  this 값을 정의합니다 (생성자로서의 새로운 객체, 정의되지 않은 strict mode의 함수 호출,   함수가 "object method"로 호출했을때의 context object ,등등.). 이런것은 객체지향 프로그래밍 스타일에서 짜증을 불러 일으킵니다.

function Person() {
  // The Person() constructor defines `this` as itself.
  this.age = 0;

  setInterval(function growUp() {
    // In nonstrict mode, the growUp() function defines `this` 
    // as the global object, which is different from the `this`
    // defined by the Person() constructor.
    this.age++;
  }, 1000);
}

var p = new Person();

IECMAScript 3/5 에서는, 이 문제는 this 에다가 뒤덮을 수 있는 값을 할당하면서 고쳐졌습니다.

function Person() {
  var self = this; // Some choose `that` instead of `self`. 
                   // Choose one and be consistent.
  self.age = 0;

  setInterval(function growUp() {
    // The callback refers to the `self` variable of which
    // the value is the expected object.
    self.age++;
  }, 1000);
}

미리 정의된 함수들

자바스크립트에는 최고 등급의 몇가지 내장함수가 있습니다:

eval()

eval() 메소드는 문자열로 표현된 자바스크립트 코드를 수행합니다.

uneval()

uneval() 메소드는  Object의 소스코드를 표현하는 문자열을 만듭니다.

isFinite()

전역 isFinite() 함수는 전달받은 값이 유한한지 결정합니다. 만약 필요하다면, 매개변수는 첫번째로 숫자로 변환됩니다.

isNaN()

isNaN() 함수는 NaN인지 아닌지 결정합니다. Note:  isNaN 함수 안의 강제 변환은  흥미로운 규칙을 가지고 있습니다;  Number.isNaN()을 대신 사용하고 싶을것입니다, ECMAScript 6 에서 정의된,또는 값이 숫자값이 아닐때,  typeof 를 사용할 수도 있습니다 .

parseFloat()

parseFloat() 함수는  문자열 인수 값을 해석하여 부동소숫점 수를 반환합니다.

parseInt()

parseInt() 함수는 문자열 인수 값을 해석하여 특정한 진법의 정수를 반환합니다  (수학적 수 체계를 기반으로 해서).

decodeURI()

decodeURI() 함수는  사전에 encodeURI을 통해 만들어지거나 비슷한 과정을 통해 만들어진 URI(Uniform Resource Identifier)  를 해독합니다.

decodeURIComponent()

decodeURIComponent() 메소드는 사전에encodeURIComponent를 통하여 만들어 지거나 또는 비슷한 과정을 통해 만들어진 URI (Uniform Resource Identifier) 컴포넌트를 해독합니다.

encodeURI()

encodeURI() 메소드는  URI(Uniform Resource Identifier)를  각 인스턴스의 특정한 문자를 한개, 두개,세개, 또는 네개의 UTF-8인코딩으로 나타내어지는 연속된 확장문자들과 바꾸는 방법으로 부호화 합니다 .(두"surrogate"문자로 구성된 문자들은 오직 네개의 연속된 확장문자 입니다. ).

encodeURIComponent()

encodeURIComponent() 메소드는  URI(Uniform Resource Identifier) 컴포넌트를  각 인스턴스의 특정한 문자를 한개, 두개,세개, 또는 네개의 UTF-8인코딩으로 나타내어지는 연속된 확장문자들과 바꾸는 방법으로 부호화 합니다 .(두"surrogate"문자로 구성된 문자들은 오직 네개의 연속된 확장문자 입니다. ).).

escape()

곧 사라질 escape() 메소드는 한 문자열에서 특정 문자들이 16진 확장 비트열로 바뀌어진 문자열로 계산합니다.  encodeURI 또는 encodeURIComponent 를 사용하세요.

unescape()

곧 사라질 unescape() 메소드는 문자열에서 확장 비트열이 확장 비트열이 나타내는 문자로 바뀌어진 문자열로 계산합니다.  escape에서 확장 비트열이 소개될 것입니다.  unescape() 메소드가 곧 사라지기 때문에,  decodeURI() or decodeURIComponent 를 대신 사용하세요.

문서 태그 및 공헌자

 이 페이지의 공헌자: SSaMKJ, JunLee, woochankim, JunBeom-Park, SooYeonKim
 최종 변경: SSaMKJ,