From da78a9e329e272dedb2400b79a3bdeebff387d47 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:17 -0500 Subject: initial commit --- .../reference/classes/extends/index.html | 112 +++++++++++++++++++++ 1 file changed, 112 insertions(+) create mode 100644 files/ko/web/javascript/reference/classes/extends/index.html (limited to 'files/ko/web/javascript/reference/classes/extends/index.html') diff --git a/files/ko/web/javascript/reference/classes/extends/index.html b/files/ko/web/javascript/reference/classes/extends/index.html new file mode 100644 index 0000000000..e1ae2eac31 --- /dev/null +++ b/files/ko/web/javascript/reference/classes/extends/index.html @@ -0,0 +1,112 @@ +--- +title: extends +slug: Web/JavaScript/Reference/Classes/extends +tags: + - Classes + - ECMAScript6 + - JavaScript +translation_of: Web/JavaScript/Reference/Classes/extends +--- +
{{jsSidebar("Classes")}}
+ +

extends 키워드는 클래스를 다른 클래스의 자식으로 만들기 위해 class 선언 또는 class 식에 사용됩니다.

+ +

{{EmbedInteractiveExample("pages/js/classes-extends.html", "taller")}}

+ + + +

구문

+ +
class ChildClass extends ParentClass { ... }
+ +

설명

+ +

extends 키워드는 내장 객체뿐만 아니라 사용자 정의 클래스를 하위 클래스로 만들기 위해 사용될 수 있습니다.

+ +

확장( 클래스)의 .prototype은 {{jsxref("Object")}} 또는 {{jsxref("null")}}이어야 합니다.

+ +

예

+ +

extends 사용하기

+ +

첫 번째 예는 Polygon 클래스로부터 Square 클래스를 만듭니다. 이 예는 live demo (source)에서 발췌했습니다.

+ +
class Square extends Polygon {
+  constructor(length) {
+    // 여기서, length와 함께 부모 클래스의 생성자를 호출
+    // Polygon의 너비 및 높이가 제공됨
+    super(length, length);
+    // 주의: 파생 클래스에서, super()가 먼저 호출되어야 'this'를
+    // 사용할 수 있습니다. 이를 빼먹으면 참조 오류가 발생합니다.
+    this.name = 'Square';
+  }
+
+  get area() {
+    return this.height * this.width;
+  }
+
+  set area(value) {
+    this.area = value;
+  }
+}
+ +

내장 객체에 extends 사용하기

+ +

이 예제는 내장 객체 {{jsxref("Date")}}를 확장합니다. 이 예제는 live demo (source)에서 발췌했습니다.

+ +
class myDate extends Date {
+  constructor() {
+    super();
+  }
+
+  getFormattedDate() {
+    var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
+    return this.getDate() + "-" + months[this.getMonth()] + "-" + this.getFullYear();
+  }
+}
+ +

null 확장

+ +

{{jsxref("null")}}에서 확장은 prototype 객체가 {{jsxref("Object.prototype")}}으로부터 상속받지 않은 것을 제외하면 보통 클래스처럼 동작합니다.

+ +
class nullExtends extends null {
+  constructor() {}
+}
+
+Object.getPrototypeOf(nullExtends); // Function.prototype
+Object.getPrototypeOf(nullExtends.prototype) // null
+ +

스펙

+ + + + + + + + + + + + + + + + + + + +
스펙상태설명
{{SpecName('ES2015', '#sec-class-definitions', 'extends')}}{{Spec2('ES2015')}}초기 정의.
{{SpecName('ESDraft', '#sec-class-definitions', 'extends')}}{{Spec2('ESDraft')}} 
+ +

브라우저 호환성

+ +

{{Compat("javascript.classes.extends")}}

+ +

참조

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