From da78a9e329e272dedb2400b79a3bdeebff387d47 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:17 -0500 Subject: initial commit --- .../global_objects/function/call/index.html | 197 +++++++++++++++++++++ 1 file changed, 197 insertions(+) create mode 100644 files/ko/web/javascript/reference/global_objects/function/call/index.html (limited to 'files/ko/web/javascript/reference/global_objects/function/call') diff --git a/files/ko/web/javascript/reference/global_objects/function/call/index.html b/files/ko/web/javascript/reference/global_objects/function/call/index.html new file mode 100644 index 0000000000..a92a7ab931 --- /dev/null +++ b/files/ko/web/javascript/reference/global_objects/function/call/index.html @@ -0,0 +1,197 @@ +--- +title: Function.prototype.call() +slug: Web/JavaScript/Reference/Global_Objects/Function/call +tags: + - Function + - JavaScript + - Method +translation_of: Web/JavaScript/Reference/Global_Objects/Function/call +--- +
{{JSRef}}
+ +

call() 메소드는 주어진 this 값 및 각각 전달된 인수와 함께 함수를 호출합니다.

+ +
+

주의: 이 함수 구문은 {{jsxref("Function.prototype.apply", "apply()")}}와 거의 동일하지만, call()은 인수 목록을, 반면에 apply()는 인수 배열 하나를 받는다는 점이 중요한 차이점입니다.

+
+ +

{{EmbedInteractiveExample("pages/js/function-call.html")}}

+ +

구문

+ +
func.call(thisArg[, arg1[, arg2[, ...]]])
+ +

매개변수

+ +
+
thisArg
+
func 호출에 제공되는 this의 값.
+
+ +
+
+
+
+

this는 메소드에 의해 보이는 실제값이 아닐 수 있음을 주의하세요: 메소드가 {{jsxref("Functions_and_function_scope/Strict_mode", "비엄격 모드", "", 1)}} 코드 내 함수인 경우, {{jsxref("Global_Objects/null", "null")}} 및 {{jsxref("Global_Objects/undefined", "undefined")}}는 전역 객체로 대체되고 원시값은 객체로 변환됩니다.

+
+
+
+ +

arg1, arg2, ...

+ +
+
객체를 위한 인수.
+
+ +

반환값(Return Value)

+ +

this 와 arguments 를 매개로 호출된 함수의 반환값

+ +

설명

+ +

call()은 이미 할당되어있는 다른 객체의 함수/메소드를 호출하는 해당 객체에 재할당할때 사용됩니다. this는 현재 객체(호출하는 객체)를 참조합니다. 메소드를 한번 작성하면 새 객체를 위한 메소드를 재작성할 필요 없이 call()을 이용해 다른 객체에 상속할 수 있습니다.

+ +

예

+ +

객체의 생성자 연결에 call 사용

+ +

Java와 비슷하게, 객체의 생성자 연결(chain)에 call을 사용할 수 있습니다. 다음 예에서, Product 객체의 생성자는 name 및 price 를 매개변수로 정의됩니다. 다른 두 함수 Food 및 Toy는 this 및 name과 price를 전달하는 Product를 호출합니다. Product는 name 및 price 속성을 초기화하고, 특수한 두 함수(Food 및 Toy)는 category를 정의합니다.

+ +
function Product(name, price) {
+  this.name = name;
+  this.price = price;
+
+  if (price < 0) {
+    throw RangeError('Cannot create product ' +
+                      this.name + ' with a negative price');
+  }
+}
+
+function Food(name, price) {
+  Product.call(this, name, price);
+  this.category = 'food';
+}
+
+function Toy(name, price) {
+  Product.call(this, name, price);
+  this.category = 'toy';
+}
+
+var cheese = new Food('feta', 5);
+var fun = new Toy('robot', 40);
+
+ +

익명 함수 호출에 call 사용

+ +

이 예제에서는 익명 함수를 만들고 배열 내 모든 객체에서 이를 호출하기 위해 call을 사용합니다. 여기서 익명 함수의 주목적은 배열 내 객체의 정확한 인덱스를 출력할 수 있는 모든 객체에 print 함수를 추가하는 것 입니다.

+ +
+

this 값으로 객체 전달이 반드시 필요하지는 않지만, 해당 예제에서는 설명의 목적으로 사용했습니다. 

+
+ +
var animals = [
+  { species: 'Lion', name: 'King' },
+  { species: 'Whale', name: 'Fail' }
+];
+
+for (var i = 0; i < animals.length; i++) {
+  (function(i) {
+    this.print = function() {
+      console.log('#' + i + ' ' + this.species
+                  + ': ' + this.name);
+    }
+    this.print();
+  }).call(animals[i], i);
+}
+
+ +

함수 호출 및 'this'를 위한 문맥 지정에 call 사용

+ +

아래 예제에서, greet을 호출하면 this 값은 객체 obj에 바인딩됩니다.

+ +
function greet() {
+  var reply = [this.animal, 'typically sleep between', this.sleepDuration].join(' ');
+  console.log(reply);
+}
+
+var obj = {
+  animal: 'cats', sleepDuration: '12 and 16 hours'
+};
+
+greet.call(obj);  // cats typically sleep between 12 and 16 hours
+
+ +

첫번째 인수 지정 없이 함수 호출에 call 사용

+ +

아래 예제에서, display 함수에 첫번째 인수를 전달하지 않고 호출합니다. 첫번째 인수를 전달하지 않으면, this의 값은 전역 객체에 바인딩됩니다.

+ +
var sData = 'Wisen';
+function display(){
+  console.log('sData value is %s ', this.sData);
+}
+
+display.call();  // sData value is Wisen
+
+ +
+

 주의: 엄격 모드(strict mode)에서, this 는 undefined값을 가집니다. See below.

+
+ +
'use strict';
+
+var sData = 'Wisen';
+
+function display() {
+  console.log('sData value is %s ', this.sData);
+}
+
+display.call(); // Cannot read the property of 'sData' of undefined
+
+ +

스펙

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
스펙상태설명
{{SpecName('ES1')}}{{Spec2('ES1')}}초기 정의. JavaScript 1.3에서 구현됨.
{{SpecName('ES5.1', '#sec-15.3.4.4', 'Function.prototype.call')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-function.prototype.call', 'Function.prototype.call')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-function.prototype.call', 'Function.prototype.call')}}{{Spec2('ESDraft')}}
+ +

브라우저 호환성

+ +

{{Compat("javascript.builtins.Function.call")}}

+ +

참조

+ + -- cgit v1.2.3-54-g00ecf