From 4289bf1fbb823f410775b4c7d0533b7abd8e5f5f Mon Sep 17 00:00:00 2001 From: 3indblown Leaf <69508345+kraccoon-dev@users.noreply.github.com> Date: Tue, 1 Feb 2022 19:42:11 +0900 Subject: remove class 1 (#3922) --- .../ko/web/javascript/reference/classes/index.html | 36 +++++++++++----------- 1 file changed, 18 insertions(+), 18 deletions(-) (limited to 'files/ko/web/javascript/reference/classes/index.html') diff --git a/files/ko/web/javascript/reference/classes/index.html b/files/ko/web/javascript/reference/classes/index.html index 8bb836788a..3e6bfc0a8f 100644 --- a/files/ko/web/javascript/reference/classes/index.html +++ b/files/ko/web/javascript/reference/classes/index.html @@ -15,7 +15,7 @@ translation_of: Web/JavaScript/Reference/Classes

Class를 정의하는 한 가지 방법은 class 선언을 이용하는 것입니다. class를 선언하기 위해서는 클래스의 이름(여기서 "Rectangle")과 함께 class 키워드를 사용해야 합니다.

-
class Rectangle {
+
class Rectangle {
   constructor(height, width) {
     this.height = height;
     this.width = width;
@@ -26,7 +26,7 @@ translation_of: Web/JavaScript/Reference/Classes
 
 
함수 선언과 클래스 선언의 중요한 차이점은 험수의 경우 정의하기 하기 전에 호출할 수 있지만, 클래스는 반드시 정의한 뒤에 사용할 수 있다는 점입니다. 다음 코드는 {{jsxref("ReferenceError")}}를 던질 것입니다.

 
-
const p = new Rectangle(); // ReferenceError
+
const p = new Rectangle(); // ReferenceError
 
 class Rectangle {}
 

@@ -37,7 +37,7 @@ class Rectangle {}
 
 
Class 표현식은 class를 정의하는 또 다른 방법입니다. Class 표현식은 이름을 가질 수도 있고, 갖지 않을 수도 있습니다. 이름을 가진 class 표현식의 이름은 클래스 body의 local scope에 한해 유효합니다. (하지만, 클래스의 (인스턴스 이름이 아닌) {{jsxref("Function.name", "name")}} 속성을 통해 찾을 수 있습니다).

 
-
// unnamed
+
// unnamed
 let Rectangle = class {
   constructor(height, width) {
     this.height = height;
@@ -80,7 +80,7 @@ console.log(Rectangle.name);
 
 
{{jsxref("Functions/Method_definitions", "메서드 정의", "", "true")}}도 참조해보세요.

 
-
class Rectangle {
+
class Rectangle {
   constructor(height, width) {
     this.height = height;
     this.width = width;
@@ -103,7 +103,7 @@ console.log(square.area); // 100

 
 
{{jsxref("Classes/static", "static", "", "true")}} 키워드는 클래스를 위한 정적(static) 메서드를 정의합니다. 정적 메서드는 클래스의 인스턴스화(instantiating) 없이 호출되며, 클래스의 인스턴스에서는 호출할 수 없습니다. 정적 메서드는 어플리케이션(application)을 위한 유틸리티(utility) 함수를 생성하는 데 주로 사용됩니다. 반면, 정적 속성은 캐시, 고정 환경설정 또는 인스턴스 간에 복제할 필요가 없는 기타 데이터에 유용합니다.

 
-
class Point {
+
class Point {
   constructor(x, y) {
     this.x = x;
     this.y = y;
@@ -132,7 +132,7 @@ console.log(Point.distance(p1, p2)); // 7.0710678118654755

 
 
메서드를 변수에 할당 한 다음 호출하는 것과 같이, 정적 메서드나 프로토타입 메서드가 {{jsxref("Operators/this", "this")}} 값 없이 호출될 때, this 값은 메서드 안에서 undefined가 됩니다. 이 동작은 {{jsxref("Strict_mode", "\"use strict\"")}} 명령어 없이도 같은 방식으로 동작하는데, class 문법 안에 있는 코드는 항상 strict mode 로 실행되기 때문입니다.

 
-
class Animal {
+
class Animal {
   speak() {
     return this;
   }
@@ -152,7 +152,7 @@ eat(); // undefined

 
 
위에 작성된 코드를 전통적 방식의 함수기반의 non–strict mode 구문으로 재작성하면, this 메서드 호출은 기본적으로 {{Glossary("Global_object", "전역 객체")}}인 초기 this 값에 자동으로 바인딩 됩니다. Strict mode에서는 자동 바인딩이 발생하지 않습니다; this 값은 전달된 대로 유지됩니다.

 
-
function Animal() { }
+
function Animal() { }
 
 Animal.prototype.speak = function() {
   return this;
@@ -173,7 +173,7 @@ eat(); // global object (in non-strict mode)

 
 
인스턴스 속성은 반드시 클래스 메서드 내에 정의되어야 합니다:

 
-
class Rectangle {
+
class Rectangle {
   constructor(height, width) {
     this.height = height;
     this.width = width;
@@ -182,7 +182,7 @@ eat(); // global object (in non-strict mode)

 
 
정적 (클래스사이드) 속성과 프로토타입 데이터 속성은 반드시 클래스 선언부 바깥쪽에서 정의되어야 합니다. 

 
-
Rectangle.staticWidth = 20;
+
Rectangle.staticWidth = 20;
 Rectangle.prototype.prototypeWidth = 25;
 

 
@@ -196,7 +196,7 @@ Rectangle.prototype.prototypeWidth = 25;
 
 
자바스크립트의 필드 선언 문법을 사용해서 위의 예제는 아래와 같이 다시 쓰여질 수 있습니다.

 
-
class Rectangle {
+
class Rectangle {
   height = 0;
   width;
   constructor(height, width) {
@@ -215,7 +215,7 @@ Rectangle.prototype.prototypeWidth = 25;
 
 
private 필드를 사용하면 아래와 같이 예제를 개선할 수 있습니다.

 
-
class Rectangle {
+
class Rectangle {
   #height = 0;
   #width;
   constructor(height, width) {
@@ -238,7 +238,7 @@ Rectangle.prototype.prototypeWidth = 25;
 
 
{{jsxref("Classes/extends", "extends")}} 키워드는 클래스 선언이나 클래스 표현식에서 다른 클래스의 자식 클래스를 생성하기 위해 사용됩니다.

 
-
class Animal {
+
class Animal {
   constructor(name) {
     this.name = name;
   }
@@ -265,7 +265,7 @@ d.speak(); // Mitzie barks.

 
 
또한 es5에서 사용되던 전통적인 함수 기반의 클래스를 통하여 확장할 수도 있습니다.

 
-
function Animal (name) {
+
function Animal (name) {
   this.name = name;
 }
 
@@ -286,7 +286,7 @@ d.speak(); // Mitzie barks.
 
 
클래스는 생성자가 없는 객체(non-constructible)을 확장할 수 없습니다. 만약 기존의 생성자가 없는 객체을 확장하고 싶다면, 이 메서드를 사용하세요. {{jsxref("Object.setPrototypeOf()")}}:

 
-
const Animal = {
+
const Animal = {
   speak() {
     console.log(`${this.name} makes a noise.`);
   }
@@ -310,7 +310,7 @@ d.speak(); // Mitzie makes a noise.

 
 
예를 들어, {{jsxref("Array.map", "map()")}}과 같은 기본 생성자를 반환하는 메서드를 사용할 때 이 메서드가 MyArray 객체 대신 Array 객체가 반환하도록 하고 싶을 것입니다. {{jsxref("Symbol.species")}} 심볼은 이러한 것을 가능하게 해줍니다:

 
-
class MyArray extends Array {
+
class MyArray extends Array {
   // 부모 Array 생성자로 species 덮어쓰기
   static get [Symbol.species]() { return Array; }
 }
@@ -324,7 +324,7 @@ console.log(mapped instanceof Array);   // true

 
 
{{jsxref("Operators/super", "super")}} 키워드는 객체의 부모가 가지고 있는 메서드를 호출하기 위해 사용됩니다. 이는 프로토타입 기반 상속보다 좋은 점 중 하나입니다.

 
-
class Cat {
+
class Cat {
   constructor(name) {
     this.name = name;
   }
@@ -352,7 +352,7 @@ l.speak();
 
 
슈퍼클래스를 인자로 받고 이 슈퍼클래스를 확장하는 서브클래스를 생성하여 반환하는 함수를 사용하여 ECMAScript에서 믹스-인을 구현할 수 있습니다:

 
-
var calculatorMixin = Base => class extends Base {
+
var calculatorMixin = Base => class extends Base {
   calc() { }
 };
 
@@ -362,7 +362,7 @@ var randomizerMixin = Base => class extends Base {
 
 
위 믹스-인을 사용하는 클래스는 다음과 같이 작성할 수 있습니다:

 
-
class Foo { }
+
class Foo { }
 class Bar extends calculatorMixin(randomizerMixin(Foo)) { }

 
 
클래스 재정의

-- 
cgit v1.2.3-54-g00ecf