>  기사  >  웹 프론트엔드  >  자바스크립트 객체의 속성과 프로토타입의 관계

자바스크립트 객체의 속성과 프로토타입의 관계

黄舟
黄舟원래의
2016-12-14 15:56:25880검색

ECMAScript는 두 가지 유형의 객체를 인식할 수 있습니다. 하나는 Native Object라고 하며 다른 하나는 문서 객체, Dom Node 등과 같은 실행 환경에서 제공되는 Host Object입니다.
기본 객체는 느슨한 구조이며 속성은 동적으로 추가될 수 있습니다. 모든 속성에는 이름과 값이 있습니다. 이 값은 다른 객체 또는 내장 데이터 유형(문자열, 숫자, 부울, Null 또는 정의되지 않음)에 대한 참조일 수 있습니다. 🎜> 다음의 간단한 예에서는 JavaScript 객체가 속성 값을 설정하는 방법과 속성 값을 읽는 방법을 설명합니다.

할당 작업

객체의 속성을 생성하는 방법은 매우 간단합니다. 할당 작업을 통해 직접 속성 생성을 완료할 수 있습니다.

Code
var objectRef = new Object(); //일반 자바스크립트 객체를 생성합니다.

testNumber라는 속성을 생성할 수 있습니다.

Code

objectRef.testNumber = 5;
/* - 또는:- */
objectRef["testNumber"] = 5

복사된 속성 이름인 경우 이미 존재하는 경우 이 속성은 다시 생성되지 않습니다. 할당 작업은

Code

objectRef.testNumber = 8; 
/* 속성 값을 재설정하는 것입니다. */ 
objectRef ["testNumber"] = 8;

js 객체의 프로토타입은 그 자체가 객체이거나 속성(property)을 가질 수 있습니다. )은 일반 객체 속성 생성
과 동일합니다.

값 연산

값 연산에서는 속성과 프로토타입이 다릅니다. 먼저 가장 간단한 속성 값 연산을 살펴보겠습니다.

코드

/*객체의 속성에 값을 할당합니다. 객체에 이 속성이 없으면 할당 작업 후 객체에 이 속성이 부여됩니다*/
objectRef. testNumber = 8;
/* 이 속성의 값 읽기*/ 
var val = objectRef.testNumber; 
 
/* 이제 val에는 방금 objectRef에 할당된 값 8이 있습니다.*/

Prototype Revealed

그러나 모든 객체는 프로토타입 자체도 객체이므로 프로토타입 체인이 형성됩니다.

이 체인을 만나면 중단됩니다. 체인 구성의 프로토타입이 null인 경우. (Object의 기본 프로토타입은 null입니다)

Code

var objectRef = new Object(); //일반 자바스크립트 객체를 생성합니다.

이번에 새로운 js 객체를 생성합니다. 이 객체의 프로토타입은 Null이므로 objectRef의 프로토타입 체인에는 하나의 객체만 포함됩니다. Object.prototype

다음 코드를 보고 있습니다.

코드

/* MyObject1 유형의 생성자를 빌드합니다. 🎜> MyObject1 – type.

/* MyObject2 유형의 생성자를 구성합니다.
MyObject2 - 유형:-
*/
function MyObject2(formalParameter){
/* 객체의 속성 이름 testString*/
this.testString = 형식 매개변수;
}

/* 다음 단계에서는 MyObject2의 기본 프로토타입 속성을 MyObject1 객체로 대체합니다*/
MyObject2 .prototype = new MyObject1 (8);

/* 마지막으로 MyObject2*/ 유형의 객체를 생성합니다. 이 객체에는 프로토타입 체인이 있습니다. MyObject1 객체도 있습니다.
이 프로토타입은 Object의 기본 프로토타입입니다. Object.prototype의 프로토타입은 null입니다.
값 연산이 발생하면 objectRef의 전체 프로토타입 체인이 작동하기 시작합니다.

Code
var val = objectRef.testString;

objectRef에는 testString이라는 속성이 있습니다. 코드는 testString 값을 val

Code
var val = objectRef.testNumber;

objectRef 객체에 testNumber 속성이 없지만 val에 도달합니다. undefine 대신 8을 사용합니다. 이는 현재 객체에서 찾고 있는
속성을 ​​찾지 못한 후 인터프리터가 이 객체의 프로토타입을 확인하기 때문입니다. objectRef의 프로토타입은 MyObject1 객체이고 이 객체에는 testNumber가 있습니다. . 이 속성이므로 val은 값 8을 얻습니다.

Code
var val = objectRef.toString;

이제 val은 함수에 대한 참조입니다. MyObject1이나 MyObject2 모두 toString 속성을 정의하지 않기 때문입니다. > 그래서 Object.prototype이 반환됩니다.

Code

var val = objectRef.madeUpProperty;

MyObject1, MyObject2 및 Object가 madeUpProperty 속성을 정의하지 않기 때문에 마지막 값이 정의되지 않아 얻는 내용이 정의되지 않습니다.


읽기 작업은 obj 자체와 프로토타입 체인에서 발견된 동일한 이름을 가진 첫 번째 속성 값을 읽습니다.

쓰기 작업은 obj 객체 자체에 대해 동일한 이름을 가진 속성을 생성합니다( 속성 이름이 존재하지 않는 경우
이는 objectRef.testNumber = 3이 testNumber라는 이름으로 objectRef 객체에 속성을 생성한다는 것을 의미합니다. objectRef의 속성 3을 가져옵니다. MyObject1의 testNumber 속성은 수정되지 않습니다. 다음 코드는

코드

/* MyObject1 유형의 생성자 구성
MyObject1 - 유형을 확인할 수 있습니다. .
*/
function MyObject1(formalParameter){
/* 객체에 대해 testNumber라는 속성을 생성합니다.
*/
this.testNumber =
}

/* MyObject2 유형의 생성자 빌드
MyObject2 - 유형:-
*/
function MyObject2(formalParameter){
/* testString이라는 속성을 생성합니다*/
this.testString = 형식 매개변수
}

/* 다음 단계에서는 MyObject2의 기본 프로토타입 속성을 MyObject1 개체로 바꿉니다.*/
var obj1 = new MyObject1(8); = obj1;

/* 마지막으로 MyObject2 유형의 객체를 생성합니다*/

var objectRef = new MyObject2( "String_Value" )alert(objectRef.testNumber) ; 
objectRef.testNumber = 5; 
alert(objectRef.testNumber); 
alert(obj1.testNumber);




성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.