代码整合与复杂性

Question

我有一些处理用户操作的模块 - 它们是控制模块。有6个，现在有5个，因为我合并了2个非常类似于一个名为Control

的模块

我注意到的是，当我整合类似的代码时......它的效率会稍微提高一点。例如，在Control I中，现在有一个额外的逻辑语句来确定程序流。

if( this.type === 'signup' && !this.text_object.checkPattern( 'name' ) )

这个简单的行允许我将ControlSignIn和ControlSignUp结合起来，因为唯一的区别是检查注册登录中没有的名称。

我可以继续以这种方式继续使用更复杂的代码，但我的代码占用空间更小。

在（复杂性和运行时间）与（代码足迹）之间存在权衡。

我猜它没关系，但我只想确定。

作为一个例子，我放入了ControlTweet，我也可以放入Control.

问题？

我应该将ControlTweet与Control进行整合吗？

一般来说，你在哪里划线或者这是一个偏好的问题？

控制

/**
 *Control - receives incoming requests for client use
 */

var Control = ( function () 
{
    var Control = function ( type )
    {
        this.TIME = 4000;
        this.type = type;
        this.form_element = document.getElementById( type ), 
        this.response_element = document.getElementById( type + '_response' );

        this.text_object = new TextValidator( this.form_element ),
        this.message_object = new Message( this.response_element ),
        this.effects_object= new Effects( this.response_element );
    };
    Control.prototype.invoke = function( ) 
    {
        if( Global.validate_input_on === 1 )
        {
            if( !this.text_object.checkEmpty() ) 
            {
                this.message_object.display( 'empty' );
                this.effects_object.fade( 'down', this.TIME );
                return false;
            }
            if( this.type === 'signup' && !this.text_object.checkPattern( 'name' ) ) 
            {
                this.message_object.display( 'name' );
                this.effects_object.fade( 'down', this.TIME );
                return false;
            }
            if( !this.text_object.checkPattern( 'email' ) ) 
            {
                this.message_object.display( 'email' );
                this.effects_object.fade( 'down', this.TIME );
                return false;
            }
            if( !this.text_object.checkPattern( 'pass' ) ) 
            {
                this.message_object.display( 'pass' );
                this.effects_object.fade( 'down', this.TIME );
                return false;
           }
        }
        var response_element = this.response_element;
        new Ajax().invoke( serializeArray( this.form_element ) + '&ajax_type=' + this.type + '_control', function( server_response_text ) { ajaxType( server_response_text, response_element, 'respond' ); } );
    };
    Control.in = function()
    {
        new Control( 'signin' ).invoke();
    };
    Control.up = function()
    {
        new Control( 'signup' ).invoke();
    };
    Control.out = function()
    {
        new Ajax().invoke( '&ajax_type=ControlSignOut', function( server_response_text ) { ajaxType( server_response_text, 0, 'simple' ); } );
    };
    Control.try = function()
    {
        new Ajax().invoke( '&ajax_type=ControlTryIt', function( server_response_text ) { ajaxType( server_response_text, 0, 'simple' ); } );
    };
    return Control;
} () );

ControlTweet

/**
 *    ControlTweet
 */

function interfaceTweet()
{
    var fill_element = document.getElementById( 'tweet_fill' ),
        form_element = document.getElementById( 'tweet' ),
        response_element = document.getElementById( 'tweet_response' );

    var text_object = new TextValidator( form_element ),
        message_object = new Message( response_element ),
        effects_object = new Effects( response_element );

    if( Global.validate_input_on === 1 )
    {
        if( !text_object.checkEmpty() ) 
        {
            message_object.display( 'empty' );
            effects_object.fade( 'down', 4000 );
            return;
        }

        if( !text_object.checkPattern( 'tweet' ) ) 
        {
            message_object.display( 'tweet' );
            effects_object.fade( 'down', 4000 );
            return;
        }
    }
    new Ajax().invoke( serializeArray( form_element ) + '&ajax_type=ControlTweet_add', function( server_response_text ) { ajaxType( server_response_text, response_element, 'tweet', fill_element ); } );
}

我最终使用的是：

/**
 *Control - receives incoming requests for client use
 */

var Control = ( function () 
{
    var Control = function ( type )
    {
        this.TIME = 4000;
        this.type = type;

        this.form_element = document.getElementById( type ), 
        this.response_element = document.getElementById( type + '_response' );
        if( type === 'tweet' ) { this.fill_element = document.getElementById( type + '_fill' ); }

        this.text_object = new TextValidator( this.form_element ),
        this.message_object = new Message( this.response_element ),
        this.effects_object= new Effects( this.response_element );
    };
    Control.prototype.invoke = function( ) 
    {
        if( Global.validate_input_on === 1 )
        {
            if( !this.text_object.checkEmpty() ) 
            {
                this.message_object.display( 'empty' );
                this.effects_object.fade( 'down', this.TIME );
                return false;
            }
            switch( this.type )
            {
                case 'signin':
                    if( !this.text_object.checkPattern( 'email' ) ) 
                    {
                        this.message_object.display( 'email' );
                        this.effects_object.fade( 'down', this.TIME );
                        return false;
                    }
                    if( !this.text_object.checkPattern( 'pass' ) ) 
                    {
                        this.message_object.display( 'pass' );
                        this.effects_object.fade( 'down', this.TIME );
                        return false;
                    }
                    break;
                case 'signup':
                    if( !this.text_object.checkPattern( 'email' ) ) 
                    {
                        this.message_object.display( 'email' );
                        this.effects_object.fade( 'down', this.TIME );
                        return false;
                    }
                    if( !this.text_object.checkPattern( 'name' ) ) 
                    {
                        this.message_object.display( 'name' );
                        this.effects_object.fade( 'down', this.TIME );
                        return false;
                    }
                    if( !this.text_object.checkPattern( 'pass' ) ) 
                    {
                        this.message_object.display( 'pass' );
                        this.effects_object.fade( 'down', this.TIME );
                        return false;
                    }
                    break;
                case 'tweet':
                    if( !this.text_object.checkPattern( 'tweet' ) ) 
                    {
                        this.message_object.display( 'tweet' );
                        this.effects_object.fade( 'down', this.TIME );
                        return false;
                    }
                    break;
                default:
            }
        }
        var response_element = this.response_element;
        if( this.type === 'tweet' ) { var fill_element = this.fill_element; }
        new Ajax().invoke( serializeArray( this.form_element ) + '&ajax_type=' + this.type + '_control', function( server_response_text ) { ajaxType( server_response_text, response_element, 'respond', fill_element ); } );
    };
    Control.tweet = function()
    {
        new Control( 'tweet' ).invoke();
    }
    Control.in = function()
    {
        new Control( 'signin' ).invoke();
    };
    Control.up = function()
    {
        new Control( 'signup' ).invoke();
    };
    Control.out = function()
    {
        new Ajax().invoke( '&ajax_type=ControlSignOut', function( server_response_text ) { ajaxType( server_response_text, 0, 'simple' ); } );
    };
    Control.try = function()
    {
        new Ajax().invoke( '&ajax_type=ControlTryIt', function( server_response_text ) { ajaxType( server_response_text, 0, 'simple' ); } );
    };
    Control.bookmarkDelete = function( event_pull )
    {
        event_pull.preventDefault();
        domBookmarkDelete( this );
        new Ajax().invoke( encodeURIComponent( this.name ) + "=" + encodeURIComponent( this.innerHTML ) + '&ajax_type=ControlBookmark_delete', function( ) { } );
    }
    return Control;
} () );

Answer 1

这是一个非常主观的问题，因为每个人在整合代码时都有自己的个人偏好，而且它也是本地化的，因为它可能因项目而异。话虽这么说，显然有一条线要绘制，因为你不希望所有内容整合到一个大型main()函数中来处理所有事情，然后处理一些事情。

有两个编程规则可以帮助你：

1. 干（不要重复自己）
2. 过早优化=== evil

现在，DRY原则指出 - 在合理的情况下 - 您应该将类​​似的代码组合成可重用的模块。这里的关键字是类似的代码，因为有时你甚至冒着重复代码的风险就有了多个单独的模块。原因在于您还必须考虑代码维护和可读性，当您开始以DRY名称合并不同的模块时，它可能成为可读性的噩梦。

我还提到过早优化，因为你提出了小占用空间与代码复杂性的想法。我建议你忘记这一点，并将代码占用空间压缩/压缩。

最后回答你的问题，我会亲自组合这些模块。但是，这最终应该是您的决定，因为您必须维护该代码。 请记住正确评论和记录所有内容，以便在您几个月后再次访问时不会在黑暗中迷失。

Answer 2

代码应该产生您想要的，可读的，可测试的结果，并具有所需的性能，无论语言如何。

你试图找出主观“可读”和不必要的“绝对最快”之间的权衡。我会说 - 除非你遇到所需性能（首先必须有测量/目标......）的问题，否则你的可读性是好的。

Answer 3

答案是继承。获取公共部分并将它们放在父类中然后继承它们。为不同的调用放入一堆if语句有点像继承hack。一旦我学会了如何在JS中这样做，我就会发布代码。