Any good suggestions for refactoring the following javascript code? -
any ideas or suggestions more concise way refactor code?
maybe loop solution or that?
this._featuredimage = '../../../../../../../../content/images/' + this.post.slug + '.jpg'; this._checkimage(this._featuredimage, function() { // image exists this.featuredimage = this._featuredimage; }.bind(this), function() { // image doesn't exist this._featuredimage = '../../../../../../../../content/images/' + this.post.slug + '.png'; this._checkimage(this._featuredimage, function() { // image exists this.featuredimage = this._featuredimage; }.bind(this), function() { // image doesn't exist this._featuredimage = '../../../../../../../../content/images/' + this.post.datestamp + '.jpg'; this._checkimage(this._featuredimage, function() { // image exists this.featuredimage = this._featuredimage; }.bind(this), function() { // image doesn't exist this._featuredimage = '../../../../../../../../content/images/' + this.post.datestamp + '.png'; this._checkimage(this._featuredimage, function() { // image exists this.featuredimage = this._featuredimage; }.bind(this), function() { // image doesn't exist this.featuredimage = false; }.bind(this)); }.bind(this)); }.bind(this)); }.bind(this));
thanks, hope makes sense.
i'd start changing hardcoded strings , code duplicated on first look:
this.setfeaturedimage = function(newimage) { this.featuredimage = newimage; } this.unsetfeatureimage = function() { this.featuredimage = false; } this.imagesroot = '../../../../../../../../content/images/'; this.fileextensions = ['jpg' => '.jpg', 'png' => '.png']; this.getpostslugimage = function(extension) { return this.imagesroot + this.post.slug + fileextensions[extension]; } this.getpostdatestampimage = function(extension) { return this.imagesroot + this.post.datestamp + fileextensions[extension]; }
than changed anonymous functions calls objects methods. here saw method call on failure in chain. changed them call unsetfeaturedimage on fail , returning false
this.trysetpostslugjpgimage = function() { this._checkimage(this.getpostslugimage('jpg'), this.setfeaturedimage(this.getpostslugimage('jpg')).bind(this), unsetfeatureimage.bind(this)); if(this.featuredimage == false) return false; } this.trysetpostslugpngimage = function() { this._checkimage(this.getpostslugimage('png'), this.setfeaturedimage(this.getpostslugimage('png')).bind(this), unsetfeatureimage.bind(this)); if(this.featuredimage == false) return false; } this.trysetpostdatestampjpgimage = function() { this._checkimage(this.getpostdatestampimage('jpg'), this.setfeaturedimage(this.getpostdatestampimage('jpg')).bind(this), unsetfeatureimage.bind(this)); if(this.featuredimage == false) return false; } this.trysetpostdatestamppngimage = function() { this._checkimage(this.getpostdatestampimage('png'), this.setfeaturedimage(this.getpostdatestampimage('png')).bind(this), unsetfeatureimage.bind(this)); if(this.featuredimage == false) return false; }
and result have:
if(!this.trysetpostslugjpgimage()) if(!this.trysetpostslugpngimage()) if(!this.trysetpostdatestampjpgimage()) if(!this.trysetpostdatestamppngimage())
that can close in function simple name , use in our system
Comments
Post a Comment