Javascript 상속(1부) - 객체 구성 소개_JavaScript

Javascript에 "클래스"가 존재합니까?

모든 것이 객체입니다
기본 데이터(Undefine, Null, Boolean, Number, String)를 제외한 Javascript의 모든 것은 객체입니다.
사실 자바스크립트의 객체는 데이터와 함수의 모음입니다. 예를 들어,

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

var foo = new Function("alert ('hello world!')");
foo();

foo는 함수이자 객체임을 알 수 있습니다. 또 다른 예:

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

function foo(){
//뭔가를 하세요
}

foo.data = 123;
foo["data2"] = "hello"

alert(foo.data); 🎜> Alert(foo.data2);

함수는 객체와 같은 속성을 추가할 수도 있습니다.

객체 생성 일반적으로 생성자를 사용하여 객체를 생성하지만 생성자가 없는 경우 원하는 객체를 생성하는 방법도 있습니다.

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

function creatPerson(__name, __sex, __age){
return {
이름: __name,
성별: __sex,
나이: __age,
get: function(__key){
alert(this[__key])
}
}; >}

var Bob = creatPerson("Bob", "male", 18)
Bob.get("name") //Bob
Bob.get("sex") ; //남성
Bob.get("age"); //18


하지만 이것만으로는 충분하지 않습니다. 방법을 공유할 수 있기를 바랍니다. 예를 들어, 이 함수를 사용하여 Tom 개체를 생성하면 get 함수가 다시 생성되어 분명히 메모리가 낭비됩니다.

공유 리소스 가져오기
함수도 객체라는 것을 알고 있으므로 공유해야 하는 메서드나 속성을 함수에 넣을 수 있습니다.

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

function creatPerson(__name, __sex, __age){

var common =args.callee. common ;
return {
//자신만의 속성
name: __name,
sex: __sex,
age: __age,
//자신만의 메소드
sayhi: function ( ){alert("hi");},
//공유 메소드
get: common.get,
getType: common.getType,
//공유 속성
type: common .type
}
creatPerson.common = {
get:function(__key){
alert(this[__key]);
},
getType: function(){
alert(this.type);
},
type: "사람"
}

var Bob = creatPerson("Bob", "남성" , 18);
Bob.get("이름"); //Bob
Bob.get("sex"); //남성
Bob.getType(); 🎜>
그래서 우리는 형편없는 메소드를 사용하여 자체 속성 메소드와 공유 속성 메소드를 갖는 객체를 성공적으로 생성했습니다. 그러나 실제로 이것은 Javascript가 객체를 제대로 생성하지 못하는 방식입니다.
실제로 공유 속성은 실제로 구현되지 않습니다. 왜냐하면 이 공유 속성은 여전히 ​​복사본이기 때문입니다. 이것은 우리가 정말로 원하는 공유 재산이 아닙니다.

new 키워드

위의 "객체 구성"과 마찬가지로 new의 목적은 객체 고유의 속성과 메서드를 만드는 것입니다. 예:


코드 복사

코드는 다음과 같습니다.function Person(__name, __sex , __age){ this.name = __name; this.sex = __sex;

this.age = __age;

this.get = function(__key){
alert(this[ __key]);
}

var Bob = new Person("Bob", "male", 18)
Bob.get("이름"); Bob
Bob.get("sex"); //남성
Bob.get("age") //18



프로토타입(Prototype)

Javascript 작성자는 위의 "공유 리소스 가져오기"와 유사한 방법을 사용했습니다. 함수도 객체이기 때문에 공유해야 할 "사물"을 그에게 두십시오:

코드 복사

코드는 다음과 같습니다. 다음 :function Person(__name, __sex, __age){ this.name = __name; this.sex = this.age = __age; > this.sayhi = function(__key){

alert("hi");

};
}
Person.prototype = {
생성자: Person,
get: 함수 ( __key){
alert(this[__key]);

var Bob = new Person("Bob", "male", 18); Bob .get("name"); //Bob
Bob.get("sex"); //남성
alert(Bob.constructor);

Javascript의 객체 생성 모델은 간단하고 new는 자체 문제를 처리하며 프로토타입은 공유 문제를 처리합니다.

자바의 객체(인스턴스) 생성 방식이 원재료를 틀(클래스)에 던져서 제련하는 것이라면, 자바스크립트의 객체 생성 방식은 빌더(생성자)에게 재료를 주고 도면을 누르게 하는 것입니다. 세워짐.

실제 프로세스

물론 실제 프로세스는 이와 같지 않습니다. 새 개체를 만들 때 가장 먼저 해야 할 일은 공유 리소스를 처리하는 것입니다.

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

function A(){
console. dir(this);
alert(this .type); //A
}
A.prototype.type = "A"
var a = new A(); 🎜>

console.dir을 통해 인쇄하면 다음을 볼 수 있습니다.


생성자는 객체를 생성한 후 즉시 새 객체의 내부 속성 __proto__에 프로토타입 참조를 할당한 다음 생성자에서 구성 문을 실행합니다.

type	"A"
__proto__	A {type = "A"}
type	"A"
constructor	A()

은

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

function A( ){

this.type = "B"
}
A.prototype.type = "A"

var a = new A()
alert (a.type); //B


a.type을 얻으려는 경우 엔진은 먼저 a 객체에 속성 유형이 있는지 확인합니다. 그렇지 않은 경우 __proto_를 사용하려고 시도합니다. _에 유형 속성이 있는지 확인하고, 있으면 해당 속성을 반환합니다.

__proto__는 표준이 아닙니다. 예를 들어 IE에서는 사용할 수 없지만 IE에는 유사한 내부 속성이 있지만 사용할 수 없습니다.

이러한 이유로 a.type을 삭제할 때 a.type을 반환할 수 있습니다.

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

function A(){

this.type = "B"
}
A.prototype.type = "A"

var a = new A();
alert(a.type); //B
delete a.type; //A



수업이 있나요?

엄밀히 말하면 Javascript에는 클래스라는 것이 없습니다. 그러나 객체지향 프로그래밍을 위해 자바스크립트를 사용할 때, 생성자 이름을 생성자가 생성한 객체의 "타입(클래스가 아닌 타입) 이름"으로 사용하는 경우도 있습니다.
이름은 코드네임일 뿐, 쉽게 이해하기 위한 도구입니다.


참고자료

Javascript 상속 메커니즘의 디자인 아이디어