1. js의 객체 상속
JS에는 세 가지 상속 방법이 있습니다.
1.js 프로토타입(prototype)은 상속을 구현합니다.
다음과 같이 코드 코드를 복사합니다.
<SPAN style="BACKGROUND-COLOR: #ffffff"><SPAN style="FONT-SIZE: 18px"><html>
<본문>
<스크립트 유형="텍스트/자바스크립트">
함수 사람(이름,나이){
this.name=이름;
this.나이=나이;
}
Person.prototype.sayHello=function(){
Alert("프로토타입을 사용하여 이름 가져오기: "+this.name);
}
var per=new Person("마샤오첸",21);
per.sayHello(); //출력: 프로토타입을 사용하여 이름 가져오기: Ma Xiaoqian
함수 학생(){}
Student.prototype=new Person("홍루통",21);
var stu=새 학생();
Student.prototype.grade=5;
Student.prototype.intr=function(){
경고(this.grade);
}
stu.sayHello();//출력: 프로토타입을 사용하여 이름 가져오기: Hong Rutong
stu.intr();//출력: 5
</script>
</body>
</html></SPAN></SPAN>
2. 생성자는 상속을 구현합니다.
다음과 같이 코드 코드를 복사합니다.
<SPAN 스타일="FONT-SIZE: 18px"><html>
<본문>
<스크립트 유형="텍스트/자바스크립트">
함수 상위(이름){
this.name=이름;
this.sayParent=함수(){
Alert("부모:"+this.name);
}
}
function Child(이름,나이){
this.tempMethod=부모;
this.tempMethod(이름);
this.나이=나이;
this.sayChild=함수(){
Alert("아이:"+this.name+"나이:"+this.age);
}
}
var parent=new Parent("장젠첸");
parent.sayParent(); //출력: "부모: Jiang Jianchen"
var child=new Child("이명",24); //출력: "아이:이명나이:24"
child.sayChild();
</script>
</body>
</html></SPAN>
3.call, 상속 구현에 적용
다음과 같이 코드 코드를 복사합니다.
<SPAN 스타일="FONT-SIZE: 18px"><html>
<본문>
<스크립트 유형="텍스트/자바스크립트">
함수 사람(이름,나이,사랑){
this.name=이름;
this.나이=나이;
this.love=사랑;
this.say=함수 say(){
Alert("이름:"+이름);
}
}
//호출 메소드
함수 학생(이름,나이){
Person.call(this,이름,나이);
}
//적용방법
기능 선생님(이름,사랑){
Person.apply(this,[이름,사랑]);
//Person.apply(this,arguments); //이전 문장과 동일한 효과, 인수
}
//call과 aply의 유사점과 차이점:
//1, 첫 번째 매개변수는 동일하며 현재 객체를 참조합니다.
//2, 두 번째 매개변수는 다릅니다: call은 하나씩 매개변수 목록입니다. Apply는 배열입니다(인수도 사용할 수 있습니다).
var per=new Person("Wufenglou",25,"Wei Yingping") //출력: "Wufenglou"
per.say();
var stu=신입생("조우",18);//출력: "조우"
stu.say();
var tea=새 교사("Qin Jie",16);//출력: "Qin Jie"
차.말();
</script>
</body>
</html></SPAN>
2. 전화통화 및 신청방법 (자세한 소개)
js의 호출과 적용 모두 상속을 구현할 수 있습니다. 유일한 매개변수 차이점은 func.call(func1,var1,var2,var3)에 해당하는 적용 작성 방법이 func.apply(func1,[var1,var2,var3])라는 것입니다. .
JS 매뉴얼의 호출에 대한 설명:
다음과 같이 코드 코드를 복사합니다.
<SPAN style="FONT-SIZE: 18px">호출 방법
현재 개체를 다른 개체로 바꾸려면 개체에 대한 메서드를 호출합니다.
call([thisObj[,arg1[, arg2[, [,.argN]]]]])
매개변수
이Obj
선택 과목. 현재 객체로 사용될 객체입니다.
인수1, 인수2, , 인수N
선택 과목. 일련의 메소드 매개변수가 전달됩니다.
설명하다
호출 메소드를 사용하면 다른 객체를 대신하여 메소드를 호출할 수 있습니다. call 메소드는 함수의 객체 컨텍스트를 초기 컨텍스트에서 thisObj가 지정한 새 객체로 변경합니다.
thisObj 매개변수가 제공되지 않으면 Global 개체가 thisObj로 사용됩니다. </SPAN>
간단히 말해서, 이 두 함수의 기능은 실제로 객체의 내부 포인터를 변경하는 것, 즉 객체의 this가 가리키는 내용을 변경하는 것입니다. 이는 객체 지향 js 프로그래밍에 유용할 때도 있습니다. js에서 이 두 함수의 중요한 역할에 대해 이야기하기 위해 Apply를 예로 들어 보겠습니다. 좋다:
다음과 같이 코드 코드를 복사합니다.
<SPAN style="FONT-SIZE: 18px"> function Person(name,age){ //클래스 정의
this.name=이름; //이름
this.age=나이;
this.sayhello=function(){alert(this.name)};
}
function Print(){ //클래스 속성 표시
this.funcName="인쇄";
this.show=함수(){
var 메시지=[];
for(var 키){
if(typeof(this[key])!="함수"){
msg.push([key,":",this[key]].join(""));
}
}
Alert(msg.join(" "));
};
}
function Student(이름,나이,학년,학교){ //학생 클래스
Person.apply(this,arguments); // 호출에 비해 장점
Print.apply(this,arguments);
this.grade=등급; //등급
this.school=학교;
}
var p1=new Person("부 카이화",80);
p1.sayhello();
var s1=새 학생("바이윤페이",40,9,"악루학원");
s1.show();
s1.sayhello();
경고(s1.funcName);</SPAN>
또한 Function.apply()는 프로그램 성능을 향상시키는 데 중요한 역할을 합니다.
Math.max() 함수부터 시작하겠습니다. Math.max 뒤에는 여러 매개변수가 올 수 있으며 마지막으로 모든 매개변수 중 최대값을 반환합니다.
예를 들어
다음과 같이 코드 코드를 복사합니다.
<SPAN style="FONT-SIZE: 18px">alert(Math.max(5,8)) //8
경고(Math.max(5,7,9,3,1,6)); //9
//그러나 많은 경우 배열에서 가장 큰 요소를 찾아야 합니다.
var arr=[5,7,9,1];
//alert(Math.max(arr)); // 이것은 작동하지 않습니다. NaN
//이렇게 작성하세요
함수 getMax(arr){
var arrLen=arr.length;
for(var i=0,ret=arr[0];i<arrLen;i++){
ret=Math.max(ret,arr[i]);
}
반환 ret;
}
경고(getMax(arr)); //9
//적용으로 전환하면 이렇게 쓸 수 있습니다.
함수 getMax2(arr){
return Math.max.apply(null,arr);
}
경고(getMax2(arr)); //9
//두 코드 조각은 동일한 목적을 달성하지만 getMax2는 우아하고 효율적이며 훨씬 더 간결합니다.
//또 다른 예는 배열의 푸시 메소드입니다.
var arr1=[1,3,4];
var arr2=[3,4,5];
//arr2를 확장하려면 arr1에 하나씩 추가하고 마지막으로 arr1=[1,3,4,3,4,5]를 지정합니다.
//arr1.push(arr2)는 분명히 작동하지 않습니다. 이렇게 하면 [1,3,4,[3,4,5]]를 얻게 되기 때문입니다.
//루프를 사용하여 하나씩만 푸시할 수 있습니다(물론 arr1.concat(arr2)도 사용할 수 있지만 concat 메소드는 arr1 자체를 변경하지 않습니다)
var arrLen=arr2.length;
for(var i=0;i<arrLen;i++){
arr1.push(arr2[i]);
}
//Apply가 도입된 이후로 모든 것이 너무 단순해졌습니다.
Array.prototype.push.apply(arr1,arr2); //이제 arr1이 원하는 결과입니다.</SPAN>