JavaScript에서 인터페이스는 일련의 추상 메서드 선언과 메서드 특성 모음입니다. 개체가 어떤 메서드를 가져야 하는지 설명하는 수단을 제공합니다. 인터페이스는 코드 재사용성을 높이고, 서로 다른 클래스 간의 통신을 안정화하고, 두 개체를 상속하는 과정에서 발생하는 문제를 줄일 수 있습니다.
이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.
인터페이스란 무엇입니까
인터페이스는 일련의 추상 메소드와 메소드 특성의 모음을 선언한 것입니다. 이러한 메소드는 추상이어야 하며 특정 클래스에 의해 구현되어야 합니다. 그런 다음 제3자가 이를 사용할 수 있습니다. 특정 클래스가 특정 메서드를 실행할 수 있도록 추상 메서드 호출을 그룹화합니다.
인터페이스는 객체 지향 JavaScript 프로그래머의 도구 상자에서 가장 유용한 도구 중 하나입니다. 디자인 패턴에서 제안한 재사용 가능한 객체지향 디자인의 원칙 중 하나는 "구현 프로그래밍이 아닌 인터페이스를 위한 프로그래밍"인데, 이를 인터페이스 지향 프로그래밍이라고 부르는 것이 이 개념의 중요성은 분명합니다.
하지만 문제는 JavaScript의 세계에는 인터페이스를 생성하거나 구현하는 내장 메소드가 없고 객체가 다른 객체와 동일하게 구현하는지 여부를 판단할 수 있는 메소드 세트가 없다는 것입니다. 다행스럽게도 JavaScript는 유연성이 뛰어나 기존 객체 지향 인터페이스를 쉽게 시뮬레이션하고 이러한 기능을 추가할 수 있습니다.
인터페이스는 객체가 어떤 메소드를 가져야 하는지 지정하는 수단을 제공하지만 이러한 메소드의 의미를 나타낼 수는 있지만 특정 구현을 포함하지는 않습니다. 이 도구를 사용하면 객체가 제공하는 속성을 기준으로 객체를 그룹화할 수 있습니다.
예를 들어 A와 B와 인터페이스 I가 있는 경우 A 객체와 B 객체가 매우 다르더라도 둘 다 I 인터페이스를 구현하는 한 A와 B는 A.I(B)에서 상호 교환적으로 사용될 수 있습니다. B.I(A)와 같은 방법.
인터페이스를 사용하여 서로 다른 클래스 간의 공통성을 개발할 수도 있습니다. 원래 특정 클래스를 매개변수로 요구하는 함수가 특정 인터페이스를 매개변수로 요구하는 함수로 변경되면, 인터페이스를 구현하는 모든 객체를 매개변수로 전달할 수 있으므로, 관련되지 않은 모든 객체는 서로 매개변수로 전달될 수도 있습니다. 객체도 동일하게 처리될 수 있습니다.
인터페이스의 장점과 단점
확립된 인터페이스는 자기 설명적이며 코드 재사용성을 높일 수 있습니다. 인터페이스는 구현해야 하는 메서드를 외부 클래스에 알려주는 일종의 정보를 제공할 수 있습니다. 또한 서로 다른 클래스 간의 통신 방식을 안정화하고 두 객체를 상속하는 과정에서 발생하는 문제를 줄이는 데 도움이 됩니다.
이것은 디버깅에도 도움이 됩니다. JavaScript와 같은 약한 유형의 언어에서는 유형 불일치를 추적하기 어렵습니다. 인터페이스를 사용할 때 문제가 발생하면 더 명확한 오류 메시지가 표시됩니다. 물론 인터페이스에 단점이 전혀 없는 것은 아닙니다. 인터페이스를 광범위하게 사용하면 약한 유형의 언어로서의 유연성이 어느 정도 약화됩니다. 반면에 JavaScript는 인터페이스에 대한 기본 지원을 제공하지 않으며 기존 객체를 시뮬레이션할 뿐입니다. 이는 본질적으로 유연한 JavaScript를 제어하기 어렵게 만듭니다.
또한 인터페이스를 구현하는 방법은 부분적으로 추가 메서드 호출 오버헤드로 인해 성능에 영향을 미칩니다. 인터페이스 사용의 가장 큰 문제점은 다른 강력한 유형의 언어와 달리 JavaScript가 인터페이스 규칙을 준수하지 않으면 컴파일에 실패한다는 것입니다. 협업 개발 환경에서는 위의 문제를 효과적으로 피할 수 있습니다. 오류가 발생하지 않고 손상될 가능성이 매우 높으며 이는 통제할 수 없습니다.
객체 지향 언어에서 인터페이스를 사용하는 방식은 일반적으로 비슷합니다. 인터페이스에 포함된 정보는 클래스가 구현해야 하는 메서드와 이러한 메서드의 서명을 설명합니다. 클래스 정의는 이러한 인터페이스를 구현한다는 것을 명시적으로 명시해야 합니다. 그렇지 않으면 컴파일되지 않습니다.
분명히 JavaScript에서는 동일한 작업을 수행할 수 없습니다. 인터페이스와 구현 키워드가 없고 인터페이스가 계약을 따르는지 런타임에 확인할 수 없기 때문입니다. 하지만 보조 메서드를 통해 대부분의 기능을 모방할 수 있으며 명시적 확인 .
JavaScript에서 인터페이스를 구현하는 방법
JavaScript에서 인터페이스를 구현하는 방법에는 세 가지가 있습니다.
(1) 댓글 설명 인터페이스
(2) 속성 감지 인터페이스
(3) 오리 유형 식별 인터페이스
장점: 구현이 쉽고 추가 클래스나 함수가 필요하지 않습니다.
단점: 순수한 문서 제약으로 인해 프로그램은 인터페이스를 구현하는 개체가 모든 인터페이스 메서드를 구현하는지 확인할 수 없습니다.
/**
* interface Composite{
* function a();
* function b();
* }
*/
// CompositeImpl implements Composite
var CompositeImpl = function(){
//业务逻辑
};
CompositeImpl.prototype.a = function(){
//业务逻辑
};
CompositeImpl.prototype.b = function(){
//业务逻辑
};두 번째 방법이 더 엄격합니다. 모든 클래스는 자신이 구현하는 인터페이스를 명시적으로 선언하며 이러한 클래스와 상호 작용하려는 객체는 이러한 선언을 확인할 수 있습니다. 인터페이스 자체는 여전히 주석일 뿐이지만 이제 속성을 검사하여 클래스가 구현한다고 주장하는 인터페이스를 알 수 있습니다.
장점: 어떤 인터페이스가 구현되었는지 확인하는 기능
缺点：并未确保类真正实现了自称实现的接口。你只知道它是否说自己实现了接口。
var interfacesImpl = function(){
//在实现类内部用一个数组保存要实现的方法名
//通常这个属性名是团队中规定好的
//声明自己实现了这两个方法，但实际上并不一定
this.implementsInterfaces = ["Composite","FormItem"];
};
//专门为这个实现对象写一个检测函数，传入实例对象，用于检查实例对象是否实现了所有接口
function checkImplements(obj){
//调用检查方法 obj是否实现了两个接口，如果没有都实现则抛出异常
if(!isImplements(obj,"Composite","FormItem")){
throw new Error("接口没有全部实现！");
}
//obj是要检查的对象
function isImplements(obj){
//传入的第0个参数是要检查的对象，所以从1开始检查
for(var i=1; i<arguments.length; i++){
//接收接口中每个接口的名字
var interfaceName = arguments[i];
//默认未实现该接口
var foundFlag = false;
//循环查询传入实例对象的实现接口数组，检查是否全部实现
for(var j=0; j<obj.implementsInterfaces.length; j++){
//如果实现了这个接口，就修改标记并跳出
//debugger
if(obj.implementsInterfaces[j] == interfaceName){
foundFlag = true;
break;
}
}
//如果遍历实现接口数组之后没找到，返回false
if(!foundFlag){
return false;
}
}
return true;
}
}
//使用实例对象并检测
var o = new interfacesImpl();
checkImplements(o);背后的观点：如果对象具有与接口定义的方法同名的所有方法，那么久可以认为它实现了这个接口。
/**
* 接口类
*
* @param {String} name 接口的名字
* @param {Array} methods 要实现方法名称的数组
*/
var Interface = function (name, methods) {
//判断参数个数
if(arguments.length !== 2){
throw new Error("接口构造器参数必须是两个！");
}
this.name = name;
this.methods = [];
for(var i=0; i<methods.length; i++){
if(typeof methods[i] !== "string"){
throw new Error("接口实现的函数名称必须是字符串！");
}
this.methods.push(methods[i]);
}
}
//实例化接口对象---传入接口名和要实现的方法数组
var CompositeInterface = new Interface("CompositeInterface",["add","remove"]);
var FormItemInterface = new Interface("FormItemInterface",["update","select"]);
//实现接口的类
var CompositeImpl = function(){
}
//实现接口的方法
CompositeImpl.prototype.add = function(obj){
//...
}
CompositeImpl.prototype.remove = function(obj){
//...
}
CompositeImpl.prototype.select = function(obj){
//...
}
//在这里少实现一个方法，下面检查是否全部实现了接口
// CompositeImpl.prototype.update = function(obj){
// //...
// }
//实例化 实现接口的对象
var c = new CompositeImpl();
//检验接口里的方法是否全部实现，如果不通过则抛出异常
Interface.ensureImplements = function(obj){
//如果接收到参数小于2，说明异常
if(arguments.length < 2){
throw new Error("接口检查方法的参数必须多余两个！");
}
//接口实现检查
for(var i=0,len = arguments.length; i<len; i++){
//获取当前接口
var instanceInterface = arguments[i];
//判断接收到的是不是接口的对象，如果不是则抛出异常
if(instanceInterface.constructor !== Interface){
throw new Error("接口检测函数必须传入接口对象！");
}
//检查实例化接口的对象是不是实现了接口里的所有方法
for(var j=0; j<instanceInterface.methods.length; j++){
//接收到的字符串方法
var methodName = instanceInterface.methods[j];
//如果obj里面没有methodsName这个方法，或者有这个属性但是不是函数，就抛出异常
if(!obj[methodName] || typeof obj[methodName] !== "function"){
throw new Error("接口方法" + methodName + "没有实现！");
}
}
}
}
//传入要检查的类，和要实现的所有接口对象
Interface.ensureImplements(c, CompositeInterface, FormItemInterface);
c.add();【相关推荐：javascript学习教程】
위 내용은 자바스크립트의 인터페이스란 무엇인가요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
