자바스크립트에 다형성이 있나요?

JavaScript의 다형성은 동일한 작업이 다른 개체에 적용될 때 다른 해석과 실행 결과를 생성할 수 있음을 의미합니다. JavaScript의 다형성은 동일한 이름의 함수를 직접 구현하여 재정의할 수 있습니다. JavaScript의 상위 클래스 함수는 직접 재정의될 수 있습니다.

이 튜토리얼의 운영 환경: Windows 10 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.

JavaScript의 다형성

의미

동일한 작업이 서로 다른 개체에 적용되어 서로 다른 해석과 서로 다른 실행 결과가 나타날 수 있습니다.

예를 들어 고양이와 개가 같은 명령을 내리면 "짖어라." " 그들에게는 고양이가 야옹거리고 개는 짖기 때문에 짖도록 요청하는 것은 동일한 작업이며 짖는 소리에 따라 실행 결과가 달라집니다.

의사 코드를 사용한 구현은 다음과 같습니다.

function getVoice(animals) {
    if(animals instanceof Cat){
        console.log('喵～');
        
    }
    if(animals instanceof Dog){
        console.log('汪～');
    }
}
class Cat {}
class Dog {}
getVoice(new Cat()); // '喵～'
getVoice(new Dog()); // '汪～'

그럼 동물을 추가하고 싶다면 어떻게 해야 할까요? 판결을 하나 더 추가하시겠습니까? 그러면 동물 소리를 추가할 때마다 getVoice를 수정해야 합니까? 좀 번거롭지 않나요?

그래서 우리는 이 문제를 어떻게 해결할지 고민해야 합니다~

객체 다형성

사실 다형성의 가장 기본적인 기능은 절차적 조건문을 객체 다형성으로 변환하여 이러한 조건 분기문을 제거하는 것입니다.

일반 용어로는 "무엇을 해야 하는지"와 "누가 어떻게 하는지"를 구분한다는 의미입니다. 추상적인 요약은 "변하지 않는 것"과 "변할 수 있는 것"을 구분하는 것을 의미합니다.

처음에 제시한 예는 다음과 같이 분해되고 이해될 수 있습니다.

변하지 않는 것: 동물이 내는 소리 변경될 수 있는 것: 동물이 내는 소리의 종류

그럼. "동물이 소리를 내는 것"의 액션이 각 클래스에 분산되고(각 클래스에 캡슐화됨) 소리를 만드는 getVoice 함수에서 "호출"의 액션이 호출됩니다.

위 예시는 이렇게 변형 가능해요~

function getVoice (animals) {
    if (animals.sound instanceof Function) {
        // 判断是否有animal.sound且该属性为函数
        animals.sound();
    }
}
class Cat {
    sound () {
        console.log('喵～');
    }
}
class Dog {
    sound () {
        console.log('汪～');
    }
}
getVoice(new Cat()); // '喵～'
getVoice(new Dog()); // '汪～'

다형성의 실제 응용

다형성은 조합 패턴/전략 패턴 등 디자인 패턴에 널리 사용됩니다. ~~

일상적인 개발에서는 사용하지 않지만, 일부 디자인 패턴을 포함하면 다형성은 여전히 ​​매우 유용합니다.

JS 캡슐화 및 다형성

상속, 캡슐화 및 다형성 외에도 다형성도 필수적인 부분입니다 객체지향적 사고의 원리. JS의 캡슐화와 다형성은 "시뮬레이션" 속성의 유연한 적용을 통해 구현됩니다.

클래스에 공용 속성을 설정하고 이를 하위 클래스에 구현하여 캡슐화를 시뮬레이션할 수 있습니다.

다형성의 구현은 더 간단합니다. 하위 클래스에서 동일한 이름의 함수를 직접 구현하면 상위 클래스 함수를 재정의할 수 있습니다. JS에는 C#과 유사한 virtualde 키워드가 없으며 모든 상위 클래스 함수를 직접 재정의할 수 있습니다.

예:

function calc(value1,value2){
this.data1=value1;
this.data2=value2; 
this.GetResult;
this.toString=function(){
if(this.GetResult)
return this.GetResult()+"";
return "0";
}
}
 
function sumCalc(value1,value2){
calc.call(this,value1,value2)
this.GetResult=function(){ 
return this.data1+this.data2;
}
}
function productCalc(value1,value2){
calc.call(this,value1,value2)
this.GetResult=function(){ 
return this.data1*this.data2;
}
}
var s=new sumCalc(2,3);
alert(s.toString());  //弹框5
var p=new productCalc(2,3);
alert(p.toString());  //弹框6

위와 같이 sumCalc 클래스와 productCalc 클래스 모두 calc 클래스를 상속하여 구현하고 "추상 함수" GetResult()를 구현합니다. 이것이 JS 캡슐화가 구현되는 방식입니다.

또한 JS의 모든 클래스는 Object에서 상속되며 Object에는 자체 toString() 함수가 있습니다. 따라서 위 calc 클래스의 toString() 함수는 실제로 원래 함수, 즉 다형성의 표현을 다루고 있습니다.

【관련 추천: javascript 비디오 튜토리얼, web front-end】

위 내용은 자바스크립트에 다형성이 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!