Parsing strings (language strings) within js html library

Question

I want to seperate the language vars from my html libary but i'm not sure what the best approach for this is.

Currently I got something like this;

function putAlertA() { alert('This is alert a'); } function putAlertB() { alert('This is alert b'); } function setAlerts() { putAlertA(); putAlertB(); }

Now i want to separate the strings from the functions:

Solution A

function putAlertA() { var strings = getLanguageVars(); alert(strings[0]); } function putAlertB() { var strings = getLanguageVars(); alert(strings[1]); } function setAlerts() { putAlertA(); putAlertB(); } function getLanguageVars() { var strings = new Array(); strings[0] = "This is alert a"; strings[1] = "This is alert b"; return strings; }

Solution B

function putAlertA(strings) { alert(strings[0]); } function putAlertB(strings) { alert(strings[1]); } function setAlerts() { var strings = getLanguageVars(); putAlertA(strings); putAlertB(strings); } function getLanguageVars() { var strings = new Array(); strings[0] = "This is alert a"; strings[1] = "This is alert b"; return strings; }

Solution C

function putAlertA() { var strings = window.strings; alert(strings[0]); } function putAlertB() { var strings = window.strings; alert(strings[1]); } function setAlerts() { putAlertA(); putAlertB(); } window.strings = new Array(); strings[0] = "This is alert a"; strings[1] = "This is alert b";

I think Solution C would be the best since I reckon solution A & B generates too much overhead in terms of memory consumption and it doesn't look quite logical since the language array is a global var. I'm however a bit hesitant in using window.. Not sure it's the right approach how to do this. Maybe there's a better way how to do this? I'm using jQuery

Some comments: 1) Don't use new Array(); 2) Use named string tables (objects where keys have some meaning) array indexes will get confusing; 3) Search, this question has been asked many times before. — Chad
– Chad, Commented Feb 24, 2013 at 14:10
@Chad 1)I'm used to doing new Array() with php and java, JavaScript is different? It's even being recommended on W3schools.... 2) Thing is that i got many language vars which will make it more likely that i accidentally chose one that already exists... And i'm also not very good in choosing new names haha 3) Could you give me a link? I searched for it but couldn't find it. Maybe because I wasn't sure which keywords to chose for it. — bicycle
– bicycle, Commented Feb 24, 2013 at 14:18

Ja͢ck · Accepted Answer · 2013-02-24 14:20:33Z

1

My preference would be a static object, e.g.:

l10n = { strings: [ 'alert_a': 'this is alert a', 'alert_b': 'this is alert b' ], translate: function(key) { return this.strings[key]; } }

To call:

alert(l10n.translate('alert_a');

The good thing about this approach is that it's easier to extend, for instance, by introducing parameterized localized strings, e.g.:

"Hello :name:"

To call:

l10n.translate('key', { name: 'world' }) // "Hello world"

edited Feb 24, 2013 at 14:20

answered Feb 24, 2013 at 14:15

Ja͢ck

174k39 gold badges269 silver badges317 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

bicycle Over a year ago

That's like a get/set! I like that one! I think it also limits the overhead in terms of memory since you're only calling what you need

user208567 Over a year ago

+1. I like this approach; especially because you could extend to do culture sensitive date and number formatting.

bicycle Over a year ago

@Jack I'm not gonna use it for different languages though. Other languages are just on a different domain. When I however update a script on one domain, i don't want to edit the js files one by one on the other domain as well.

Ja͢ck Over a year ago

@bi that's fine I guess, you don't have to :)

user208567 · Accepted Answer · 2013-02-24 14:11:24Z

The main change I would make is to use strings as keys rather than integers because this is more meaningful. This is really just a special case of choosing a good variable name:

 window.strings = { alertA: 'This is alert A', alertB: 'This is alert B' }; alert(strings.alertA);

Collectives™ on Stack Overflow

Parsing strings (language strings) within js html library

2 Answers 2

4 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Related