JavaScript 클래스 및 상속 프로토타입 property_js 객체 지향-JS 튜토리얼-php.cn

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

WBOY

풀어 주다： 2016-05-16 18:20:15

원래의

1038명이 탐색했습니다.

우리는 클래스 구현과 상속을 시뮬레이션하기 위해 이미 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 