JavaScript策略模式与字典

时间:2013-09-03 23:45:19

标签: javascript dictionary strategy-pattern

在C#中,我使用带有字典的策略模式:

namespace NowListeningParserTool.Classes
{
using System.Collections.Generic;

public class WebsiteDictionary
{
    private readonly Dictionary<string, WebsiteParser> _website = new Dictionary<string, WebsiteParser>();

    public WebsiteDictionary()
    {
        _website.Add("YouTube", new YoutubeWebsiteParser());
        _website.Add("977 Music", new NineNineSevenMusicWebsiteParser());
        _website.Add("Grooveshark", new GroovesharkWebsiteParser());
        _website.Add("Sky.FM", new SkyfmWebsiteParser());
        _website.Add("iHeart", new IheartWebsiteParser());
        _website.Add("Live365", new LiveThreeSixFiveWebsiteParser());
        _website.Add("Pandora", new PandoraWebsiteParser());
        _website.Add("Spotify", new SpotifyWebsiteParser());
    }

    public string GetArtistAndTitle(string website, string browser, string stringToParse)
    {
        return _website[website].GetArtistAndTitle(browser, stringToParse, website);
    }

    public string GetWebsiteLogoUri(string website)
    {
        return _website[website].WebsiteLogoUri;
    }
}
}

WebsiteParser是抽象类。

JavaScript中的语法是什么?例如,我在JavaScript中有多个IF语句:

function getWebsite() {
    if (document.URL.indexOf('grooveshark.com') >= 0) return getTrackGrooveshark();
    if (document.URL.indexOf('977music.com') >= 0) return getTrack977Music();
    if (document.URL.indexOf('sky.fm/play') >= 0) return getTrackSkyFm();
    if (document.URL.indexOf('iheart.com') >= 0) return getTrackIHeart();
    if (document.URL.indexOf('live365.com') >= 0) return getTrackLive365();
    if (document.URL.indexOf('youtube.com') >= 0) return getTrackYoutube();
    if (document.URL.indexOf('pandora.com') >= 0) return getTrackPandora();
    if (document.URL.indexOf('spotify.com') >= 0) return getTrackSpotify();
}

...我真的不喜欢,并希望使用与C#相同的方法来消除这些丑陋的IF。

干杯。

3 个答案:

答案 0 :(得分:3)

也许是这样的,但我没有足够的细节知道这种方法是否适合你。但是,它显示了如何将对象用作键/值存储。

var fetchingStrategies = {
    'grooveshark.com': function () {
        return 'grooving!';
    },
    'youtube.com': function () {
        return 'youtubing!';
    }
};

//execute fetching strategy based on domain
fetchingStrategies['youtube.com']();

显然,你可以用一个变量来替换硬编码的'youtube.com'字符串,该变量将保存正确的查找域。

答案 1 :(得分:1)

选项1:从执行的函数返回内容。

function getWebsite() {
    var websites = [
            ['grooveshark.com',getTrackGrooveshark],
            ['977music.com',getTrack977Music],
            ['sky.fm/play',getTrackSkyFm],
            ['iheart.com',getTrackIHeart],
            ['live365.com',getTrackLive365],
            ['youtube.com',getTrackYoutube],
            ['pandora.com',getTrackPandora],
            ['spotify.com',getTrackSpotify]
        ],
        url = document.URL,
        ret;
    $.each(websites,function(i,v){
        if(url.indexOf(v[0]) !== -1){
           ret = v[1]();
           return false;
        }
    });
    return ret;
}

选项2:调用函数..不返回任何内容

function getWebsite() {
    var websites = [
            ['grooveshark.com',getTrackGrooveshark],
            ['977music.com',getTrack977Music],
            ['sky.fm/play',getTrackSkyFm],
            ['iheart.com',getTrackIHeart],
            ['live365.com',getTrackLive365],
            ['youtube.com',getTrackYoutube],
            ['pandora.com',getTrackPandora],
            ['spotify.com',getTrackSpotify]
        ],
        url = document.URL;

    $.each(websites,function(i,v){
        if(url.indexOf(v[0]) !== -1){
           v[1](); //Executes the function
           return false; //Breaks the Each loop.
        }
    });
}

答案 2 :(得分:0)

我认为这实际上是使用简单的JavaScript对象的问题。基本上你可以像在C#中那样以类似的方式引用对象的任何属性,但我想以更简单的方式。当然这是我的意见:)我喜欢以自我实例化的方式构建我的模块,比如jQuery,所以这里可能有更多,而不是你需要的最简单的形式。我也假设您的解析器是示例的全局方法,但您应该避免在实际操作中这样做。对于我在WYSIWYG编辑器中执行此操作的任何拼写错误。

这里是:

(function(){

"use strict";

var WebsiteDictionary = function () {

    return new WebsiteDictionary.fn.init();
};

WebsiteDictionary.fn = WebsiteDictionary.prototype = {

    constructor: WebsiteDictionary,

    init: function () {

         this._website["YouTube"] = YoutubeWebsiteParser();
         this._website["977Music"] = NineNineSevenMusicWebsiteParser();
         this._website["Grooveshark"] = GroovesharkWebsiteParser();
         this._website["SkyFM"] = SkyfmWebsiteParser();
         this._website["iHeart"] = IheartWebsiteParser();
         this._website["Live365"] = LiveThreeSixFiveWebsiteParser();
         this._website["Pandora"] = PandoraWebsiteParser();
         this._website["Spotify"] = SpotifyWebsiteParser();

        return this;
    },

   _website: {},


   GetArtistAndTitle: function(website, browser, stringToParse)
   {
      return this._website[website].GetArtistAndTitle(browser, stringToParse, website);
   }

   GetWebsiteLogoUri: function(website)
   {
      return this._website[website].WebsiteLogoUri;
   }


};


// Give the init function the love2DevApp prototype for later instantiation
WebsiteDictionary.fn.init.prototype = WebsiteDictionary.fn;

return (window.WebsiteDictionary= WebsiteDictionary);

}());

我相信这被称为关联数组,但不要引用我的话。基本上,JavaScript对象的每个成员/属性都可以像访问C#中的Dictionary属性一样访问。所以成员的名字是字典键。我还编辑了名称,因此它们可以是有效的JavaScript名称。

我希望这会有所帮助。我认为这是一个非常漂亮的小JavaScript技术。如果你回顾一些高调的JavaScript库,比如jQuery,你会发现它被大量使用了。