JavaScript 객체지향 프로그래밍 (1) Basics_js 객체지향

1. JavaScript를 사용하여 클래스 구현
JavaScript에는 클래스를 구현하는 특별한 메커니즘이 없습니다. 여기서 클래스는 함수 중첩을 허용하는 메커니즘을 통해 구현됩니다. 함수에는 변수와 기타 함수가 포함될 수 있습니다. 이러한 방식으로 변수는 속성으로 사용될 수 있고 내부 함수는 멤버 메소드로 사용될 수 있습니다. 따라서 외부 함수 자체를 클래스로 사용할 수 있습니다.

코드 복사 코드는 다음과 같습니다.

function myClass()
{
//이것은 생성자
}

여기서 myClass는 클래스입니다. 실제로 클래스의 생성자라고 생각하면 됩니다. 비생성자 부분에 대해서는 뒤에서 자세히 설명하기로 한다.
2. 클래스의 인스턴스를 얻는 방법
클래스를 구현한 후에는 클래스의 인스턴스를 얻어야 합니다. JavaScript는 객체 인스턴스를 얻는 방법을 제공합니다. 그 사람이 바로 새로운 운영자입니다. 실제로 JavaScript에서는 클래스와 함수가 동일한 개념입니다. new를 사용하여 함수를 작동하면 객체가 반환됩니다.
var obj1 = new myClass();
3. 객체의 멤버에 대한 참조
JavaScript에서 클래스의 속성이나 메서드를 참조하는 방법에는 세 가지가 있습니다.
1> 도트 연산자
가장 일반적인 인용 방법이며 번거롭지 않습니다. 즉, 다음 형식입니다.
객체 이름.속성 이름;
객체 이름.메서드 이름
2> 대괄호 참조
JavaScript에서는 대괄호를 사용하여 객체의 멤버를 참조할 수 있습니다. . 다음과 같습니다:
객체 이름 ["속성 이름"];
객체 이름 ["메서드 이름"];
여기서 대괄호는 속성 또는 메서드 이름을 나타내는 문자열이며 반드시 문자열 상수일 필요는 없습니다. 변수를 사용할 수도 있습니다. 이를 통해 변수를 사용하여 속성이나 메서드 이름을 전달할 수 있습니다. 프로그래밍의 편의성을 제공합니다. 이 접근 방식은 코드에서 호출할 속성이나 메서드가 확실하지 않은 경우에 사용할 수 있습니다. 그렇지 않고 도트 연산자를 사용하는 경우 조건부 판단을 사용하여 속성이나 메서드를 호출해야 합니다.
또한 대괄호를 사용하여 인용한 속성 및 메서드 이름은 숫자나 공백으로 시작할 수도 있으며, 점을 사용하여 인용한 속성 및 메서드 이름은 식별자 규칙을 따릅니다. 그러나 식별자가 아닌 명명 방법을 사용하는 것은 일반적으로 권장되지 않습니다.
3> eval 함수를 사용하세요
변수나 메소드 이름을 전달하기 위해 변수를 사용하고 싶지 않고 조건부 판단을 사용하고 싶지 않다면 eval 함수를 선택하는 것이 좋습니다. eval은 문자열 유형의 매개변수를 받은 후 이 문자열을 컨텍스트의 코드로 실행하고 실행 결과를 반환합니다. 여기서는 eval의 이 기능이 사용됩니다.
alert(eval("Object name." element.value));
4. 객체 속성 및 메소드 추가, 수정 및 삭제
JavaScript에서 생성 후 객체를 사용하면 객체의 속성과 메서드를 동적으로 추가, 수정, 삭제할 수도 있는데, 이는 다른 객체지향 언어와 다릅니다.
1> 속성 및 메소드 추가
먼저 객체를 생성합니다. 빈 객체가 생성된 후에는 속성과 메소드가 없지만 코드에서 생성할 수 있습니다.

코드 복사 코드는 다음과 같습니다.

var obj1 = new Object()
/ /속성 추가
obj1.ID = 1;
obj1.Name = "johnson"
//메소드 추가
obj1.showMessage = function()
{
Alert(" ID: " this.ID ", 이름: " this.Name);

2> 속성 및 메소드를 수정하는 것은 속성 및 메소드를 추가하는 것과 유사합니다. 예를 들어, 위의 예를 따르세요.

코드 복사 코드는 다음과 같습니다.

// 속성 수정

obj1.ID = 2;
obj1.Name = "Amanda";
// 수정 방법
obj1.showMessage = function()
{
alert("ID : " this.ID");


3> 속성 및 메소드 삭제
삭제할 속성 또는 메소드를 정의되지 않은 상태로 지정하세요.

코드 복사 코드는 다음과 같습니다. obj1.ID = 1

obj1.Name = 정의되지 않음; >obj1.showMessage = 정의되지 않음;

5. 형식화되지 않은 개체 만들기

C# 3.0의 익명 형식과 유사하게 JavaScript는 다음 형식으로 형식화되지 않은 개체를 만들 수도 있습니다. 🎜>
<.>코드 복사

코드는 다음과 같습니다. var obj1 = var obj2 = { ID: 1,

이름: "Johnson",

showMessage: function()
{
alert("ID: " this.ID "이름: " this.Name);
}
}


여기에는 유형이 지정되지 않은 두 개의 개체 obj1과 obj2가 정의되어 있습니다. 여기서 obj1은 빈 객체입니다. obj2에는 두 가지 속성 ID인 Name과 showMessage 메서드가 포함되어 있습니다. 각 속성과 메서드를 쉼표로 구분하세요. 속성(메서드) 이름과 해당 값을 세미콜론으로 구분합니다.
이런 방식으로 속성 메소드를 생성할 때 문자열을 사용하여 속성 메소드의 이름을 정의할 수도 있습니다. 예:

코드 복사 코드는 다음과 같습니다.

var obj2 =
{
"ID" : 1,
"이름": "Johnson"
}

6. 프로토타입
각 함수 개체에는 자식 객체 프로토타입, 함수는 클래스도 나타낼 수 있으므로 프로토타입은 클래스 멤버의 컬렉션을 나타냅니다. 객체가 새로 생성되면 프로토타입 객체의 멤버는 객체의 멤버로 인스턴스화됩니다. 먼저 예를 살펴보겠습니다.

코드 복사 코드는 다음과 같습니다.

함수 myClass()
{ }
myClass.prototype.ID = 1;
myClass.prototype.Name = "johnson";
myClass.prototype.showMessage = function()
{
alert("ID: " this.ID "이름: " this.Name);
}
var obj1 = new myClass()
obj1.showMessage()

프로토타입 객체 클래스를 사용하여 생성되는 이점이 있습니다. 모든 멤버를 클래스 선언에 직접 작성하는 경우

코드 복사 코드는 다음과 같습니다.

function myClass()
{
//속성 추가
this.ID = 1;
this.Name = "johnson"
//메서드 추가
this.showMessage = function()
{
alert("ID: " this.ID ", 이름: " this.Name)
}
}
var obj1 = new myClass( );
var obj2 = new myClass();

위 코드에서는 myClass 클래스가 정의되어 있으며, 클래스에 두 개의 속성과 메서드가 직접 정의되어 있습니다. 그런 다음 두 개의 개체가 인스턴스화됩니다. 여기서는 myClass 개체가 생성될 때마다 두 개의 속성과 하나의 메서드가 생성되므로 메모리 공간이 낭비됩니다. 이 문제는 프로토타입을 사용하여 해결할 수 있습니다. 함수가 새로 생성될 때마다 해당 프로토타입 개체의 멤버가 이 개체에 자동으로 할당되며, 여러 개체가 새로 생성되면 반복적으로 생성되지 않습니다.
프로토타입 초기화는 함수 본문이 실행되기 전에 발생하므로 다음 코드로 증명할 수 있습니다.

코드 복사 코드는 다음과 같습니다.

function myClass()
{
//이것은 생성자 함수
this.ID = 1; = this.Name;
this.showMessage();
}
myClass.prototype.Name = "johnson";
myClass.prototype.showMessage = function()
{
Alert("ID: " this.ID ", Name: " this.Name);
}
var obj1 = new myClass()

위 코드를 실행하면 다음을 찾을 수 있습니다. new 유형의 객체를 사용하면 대화 상자가 나타납니다.
마지막으로 말씀드리고 싶은 점은 프로토타입에는 객체지향 디자인에 사용할 수 있는 메소드가 있다는 것입니다. 즉, 생성자 특성은 생성자에 대한 호출입니다. 여기서 생성자는 위에서 언급한 클래스 선언의 코드입니다. 예:

코드 복사 코드는 다음과 같습니다.

function myClass()
{
//이것은 생성자 함수
alert("this is in constructor")
}
myClass.prototype.constructor()
var obj1 = new myClass; ();

위 코드를 실행하면 대화 상자가 두 번 나타나는 것을 확인할 수 있습니다. 프로토타입은 특히 클래스의 멤버를 디자인하는 데 사용될 수 있음을 알 수 있습니다. 실제로 프로토타입은 JavaScript 객체 지향 디자인에서 자주 사용됩니다.