>  기사  >  웹 프론트엔드  >  JavaScript 클래스 및 상속 프로토타입 property_js 객체 지향

JavaScript 클래스 및 상속 프로토타입 property_js 객체 지향

WBOY
WBOY원래의
2016-05-16 18:20:15972검색

우리는 클래스 구현과 상속을 시뮬레이션하기 위해 이미 1장에서 프로토타입 속성을 사용했습니다. 프로토타입 속성은 기본적으로 JavaScript 객체입니다. 그리고 모든 함수에는 기본 프로토타입 속성이 있습니다.
사용자 정의 개체를 생성하는 시나리오에서 이 함수를 사용하는 경우 이 함수를 생성자라고 부릅니다. 예를 들어 아래의 간단한 시나리오는 다음과 같습니다.

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

/ /Constructor
function Person(name) {
this.name = name;
}
// Person의 프로토타입을 정의합니다. 프로토타입의 속성은 사용자 정의 개체
Person에서 참조할 수 있습니다. .prototype = {
getName: function() {
return this.name;
}
}
var zhang = new Person("ZhangSan")
console.log( zhang.getName() ); // "ZhangSan"

비유적으로 JavaScript의 데이터 유형(String, Number, Array, Object, Date(Date) 등)을 고려해 보겠습니다. 이러한 유형은 다음과 같이 JavaScript 내부의 생성자로 구현된다고 믿을 만한 이유가 있습니다.
코드 복사 코드는 다음과 같습니다.

// 사전 정의된 JavaScript 유형으로 배열의 생성자를 정의합니다.
function Array() {
// ...
}
// 인스턴스 배열 초기화
var arr1 = new Array(1, 56, 34, 12);
// 그러나 우리는 다음 구문 정의를 선호합니다:
var arr2 = [1, 56, 34 , 12] ;

배열에서 동시에 작업하는 여러 가지 방법(예: concat, Join, push)도 프로토타입 속성에 정의해야 합니다.
사실 JavaScript의 모든 내장 데이터 유형에는 읽기 전용 프로토타입 속성이 있지만(이해할 수 있습니다. 이러한 유형의 프로토타입 속성이 수정되면 사전 정의된 메소드가 사라지기 때문입니다), 여기에 자신만의 확장 메소드를 추가할 수 있습니다. .
코드 복사 코드는 다음과 같습니다.

//JavaScript 고유 유형으로 확장 최소값을 구하는 배열
Array.prototype.min = function() {
var min = this[0]
for (var i = 1; i < this.length; i ) {
if (this[i] < min) {
min = this[i]
}
return
}; Array의 모든 인스턴스에서 min 메서드 호출
console.log([1, 56, 34, 12].min()) // 1


참고: 여기에 함정이 있습니다. , 배열의 프로토타입에 추가합니다. 확장 메서드 이후에 for-in을 사용하여 배열을 반복할 때 이 확장 메서드도 반복됩니다.
다음 코드는 이를 보여줍니다(min 메소드가 Array 프로토타입으로 확장되었다고 가정).


var arr = [1, 56, 34, 12];
var total = 0
for (var i in arr) {
total = parseInt ( arr[i], 10);
}
console.log(total); // NaN


해결책도 매우 간단합니다.


var arr = [1, 56, 34, 12]
var total = 0;
for (var i in arr) {
if (arr.hasOwnProperty(i)) {
total = parseInt(arr[i], 10)
}
콘솔 .log(전체) // 103

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