www.webdeveloper.com
Results 1 to 4 of 4

Thread: Best way to code Javascript

  1. #1
    Join Date
    Jul 2007
    Posts
    245

    Best way to code Javascript

    In order to reduce interferences between several scripts, I know it's highly recommended to encapsulate the Javascript code. But how would you do it? Which would you consider a better script between the following?:

    Function 1:

    PHP Code:
    euler2 = {
        
    getSumEven: function(limit) {
            
    this.total 0
            
    this.0
            
    this.1
            
    this.abSum 1;
            do {
                
    this.this.b;
                
    this.this.abSum;
                
    this.abSum this.this.b;
                if (
    this.abSum == 0this.total += this.abSum;
            } while (
    this.abSum <= limit)
            
    console.log('euler2. Total: ' this.total);
        }
    };

    euler2.getSumEven(4000000); 
    Function 2:

    PHP Code:
    (function(limit) {
            var 
    total 0
            
    0
            
    1
            
    abSum 1;
            do {
                
    b;
                
    abSum;
                
    abSum b;
                if (
    abSum == 0total += abSum;
            } while (
    abSum <= limit)
            
    console.log('euler2. Total: ' total);
    })(
    4000000); 

    I could even exchange the way I use variables so that Function 1 could use local variables as such, and Function 2 would use function properties, and it would also work.

    Which way to use better? Which way to use variables?

  2. #2
    Join Date
    Feb 2003
    Location
    Michigan, USA
    Posts
    5,773
    Neither way for this particular problem. Furthermore, I've used many different ways, depending on the situation. The first question is, do you need to maintain state?

    If not, then a simple function would suffice.

    If you do, then there are several options available:

    Traditional JavaScript OOP:
    Code:
    function Point(x, y) {
    	this.x = x;
    	this.y = y;
    }
    
    Point.prototype = {
    	above: function(point) {
    		return this.y > point.y;
    	},
    	below: function(point) {
    		this.y < point.y;
    	}
    };
    
    new Point(1, 2).above(new Point(3, 10));
    Private variables using OOP:

    Code:
    function Point(x, y) {
    	var _x = x;
    	var _y = y;
    	
    	this.above = function(point) {
    		return _y > point.getY();
    	}
    	
    	this.below = function(point) {
    		return _y < point.getY();
    	}
    	
    	this.getX = function() {
    		return _x;
    	}
    	
    	this.getY = function() {
    		return _y;
    	}
    }
    Using the Module Pattern:

    Code:
    function Point(x, y) {
    	var _x = x;
    	var _y = y;
    
    	return {
    		above: function(point) {
    			return _y > point.getY();
    		},
    		below: function(point) {
    			return _y < point.getY();
    		},
    		getX: function() {
    			return _x;
    		},
    		getY: function() {
    			return _y;
    		}
    	};
    }
    
    p = Point(2, 3);
    p2 = Point(4, 6);
    p.above(p2);

  3. #3
    Join Date
    Jul 2007
    Posts
    245
    Thanks for answering!

    Things have turned even more complicated with your reply, because I don't know the right path for each case.
    And why do you consider the examples I mentioned not good? The ones you posted are not encapsulated. They don't use any namespace. They all might crash with another script with a variable called Point.

    Could you please shed a light on this?

  4. #4
    Join Date
    Jul 2008
    Location
    urbana, il
    Posts
    2,787
    Quote Originally Posted by Jazztronik View Post
    And why do you consider the examples I mentioned not good? The ones you posted are not encapsulated. They don't use any namespace. They all might crash with another script with a variable called Point.
    using no global variables is one goal of good code design, not the only one, nor even the most important.

    providing easy code re-use using plain-jane methoding that a wide variety of programmers can read is more beneficial overall than a perfect stealth attack.

    performance is another factor; each closure and anon function add additional call overhead, deeper lexical stack depth, and one more activation object for the host environment to manage. the closer your code is to global, the faster it runs.

    it's also not apparent how i would find the functionality you posted from an external script. if i need to make 38 calculations, how simply and intuitively can i do so with your 2nd code?

    in short, you have to balance a variety of factors based on your problem.

    at the end of the day there is no perfect demo code, only good and bad solutions to real problem.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles