JavaScriptインターフェースの原理と使い方の実例を詳しく説明します。


本論文の実例はJavaScriptインターフェースの原理と使い方を述べている。皆さんに参考にしてあげます。具体的には以下の通りです。
jsインターフェース
意味:
オブジェクトがどのような方法があるべきかを説明する手段を提供します。
インターフェースは対象javascriptプログラマ向けのツールボックスの中で最も有用なツールの一つです。
インターフェースの利害:

  • いくつかの中小型プログラムにとってインターフェースを使うのは明らかに賢明ではありません。プロジェクトにとってインターフェースのメリットも明らかではなく、複雑さを増すだけです。

  • インターフェースの利点については、コードの再使用を容易にすることが明らかになり、開発については、どのような方法を使用しているかをプログラマに伝えることができます。インターフェースを事前に知っていれば、コード化時にクラスとクラスの間の衝突を減らし、デカップリングを実現します。テストとデバッグに対しても楽になります。javascriptに使う弱いタイプの言語はタイプが合わないとよく現れます。インターフェースを使うと、この点が簡単になります。
  • 注釈インターフェースの説明
    利点:プログラマは参考になります。
    短所:文書の範疇に属しています。このような方式は緩慢すぎて、インターフェースを確認する方法が完全に実現されていますか?
    
    interface Composite{
        
     function add (obj) ;
     function remove (obj) ;
     function update ( obj ) ;
    
    }
     
    //CompositeImp1 implements Composite
    var CompositeImp1 = function () {
     
    }
    CompositeImp1.prototype.remove = function ( obj ) {
     
    }
    CompositeImp1.prototype.update = function ( obj ) {
     
    }
    CompositeImp1.prototype.add = function (obj) {
     
    }
    
    var c1 = new CompositeImp1();
    
    属性検出
    インターフェースの有無を判断する
    
    /*interface Composite{
    
     function add (obj) ;
     function remove (obj) ;
     function update ( obj ) ;
    
    }
    
    interface FormItem {
     
     function select (obj) ;
     
    }
    */
    
    //CompositeImp1 implements Composite , FormItem
    var CompositeImpl = function () {
     //       ,         
     //    ,      ,      (        )
     this.implementsInterfaces = ['Composite', 'FormItem']; //   implementsInterfaces        
     
    }
    
    CompositeImpl.prototype.remove = function ( obj ) {
     // do something ...
    }
    CompositeImpl.prototype.update = function ( obj ) {
    }
    CompositeImpl.prototype.add = function (obj) {
     alert('add');
    }
    CompositeImpl.prototype.select = function (obj) {
    }
    
    //   CompositeImpl      
    function CheckCompositeImpl ( instance ) {//        ,      
     
     //                。
     if ( !IsImplements(instance,'Composite','FormItem') ) {
      throw new Error('Object does not implement a requried interface');
     }
     
    }
    
    //          (    ) //return boolean
    function IsImplements ( obj ) { //      ,          .
     
     //arguments             
     for ( var i=1; i<arguments.length; i++ ) {
      
      //          
      var interfaceName = arguments[i];
      
      //     ,     ,    。 
      var interfaceFound = false;
      
      for ( var j=0; j<obj.implementsInterfaces.length; j++ ) {
       
       if ( obj.implementsInterfaces[j] == interfaceName ) {
        
        interfaceFound = true;
        
        break;
        
       }
       
      }
      
      if ( !interfaceFound ) {
       
       return false;
       
      }
      
     }
     
     return true;
     
    }
    
    鴨式弁法
    核心:一つの種類はインターフェースの主要な目的を実現します。インターフェースの中の方法を全部実現します。検出実現方法)
    完全に対象に向けて、コードが統一され、結合されます。
    
    //1 ,   。 //     ,       ,      N      。// Class Interface 
    
           2   
      1:      (string)
      2:          methods,       (array)
    //       
    var Interface=function( name,methods ){ //methods       String     .
    if( arguments.length != 2 ){
     throw new Error('the instance Interface constructor arguments must be 2 length!');
    };
    this.name=name;
    this.methods=[]; //            ,    methods     (    );
    for( var i=0; i<methods.length; ++i ){
     if( typeof methods[i] !== 'string' ){
      throw new Error('ths Interface method name is error');
     };
     this.methods.push( methods[i] );
    };
    };
    
    //2     :       
    //①       .
    var CompositeInterface=new Interface('CompositeInteface',['add','remove']);
    var FormIntemInterface=new Interface('FormIntemInterface',['update','select']);
    //CompositeImpl implements CompositeInterface,FormIntemInterface.
    //②      
    var CompositeImpl=function(){ }
    //③       
    //implements methods
    CompositeImpl.prototype.add=function(){ alert('add'); }
    CompositeImpl.prototype.remove=function(){ alert('remove'); }
    CompositeImpl.prototype.update=function(){}
    //   CompositeImpl.prototype.select=function(){}
    //3:         .
    //    ,       ,       .    ,    , Error. //       ,        .
    Interface.ensureImplements=function( obj ){ //      .
    if( arguments.length < 2 ){ //              2 ,       .
     throw new Error('Interface.ensureImplements method constructor arguments must be >= 2!');
    };
    //        ,        ,             .
    for( var i=1; i<arguments.length; ++i ){
     var instanceInterface=arguments[i];
     //               .             .
     if( instanceInterface.constructor != Interface ){ 
      throw new Error('the arguments constructor not be Interface Class');
     };
     //               .
     for( var j=0; j<instanceInterface.methods.length; ++j ){
      //                 ,     ,     .
      var methodName=instanceInterface.methods[j];
      //object[key];
      if( !obj[methodName] || typeof obj[methodName] !== 'function' ){
       //        .
       throw new Error('the method name "' + methodName + '" is not found!');
      };
     };
    }
    }
    var c1=new CompositeImpl();
    Interface.ensureImplements( c1,CompositeInterface,FormIntemInterface );
    c1.add();
    
    まとめ:インターフェースはデカップリングを実現する。クラスとクラスの間を避けるために、メソッドの競合を呼び出します。
    興味のある友達はオンラインHTML/CSS/JavaScriptコードを使ってツールを実行できます。http://tools.jb51.net/code/HtmlJsRun上記コードの運行効果をテストします。
    もっと多くのJavaScriptに関する内容に興味がある読者は、当駅のテーマを見ることができます。「javascript対象向け入門教程」、「JavaScriptエラーとデバッグテクニックのまとめ」、「JavaScriptデータ構造とアルゴリズム技術のまとめ」、「JavaScriptはアルゴリズムと技術の総括を遍歴します。」および「JavaScript数学演算の使い方のまとめ
    本論文で述べたように、JavaScriptプログラムの設計に役に立ちます。