how to create a complex javascript structure

Question

i want to create a structure like that:

[{title:'Imágenes', extensions:'jpg,gif,png'}, {title:'Todos', extensions:'*'}]

but i need to create it from a string, in this way (in "js+jquery+php rare mode"):

items = 'Imágenes jpg,gif,png|Todos *'.split('|').each(function() {
  list(title, ext) = explode(' ', $this);
  filters[] = array('title' => title, 'ext' => ext);
});

i found structures like:

var theStatus = new Object();
function testIt() {
  theStatus.Home = 'mouseover';
  theStatus['Place'] = 'click';
  for (var i in theStatus)
  {
    alert('theStatus[\''+i+'\'] is ' + theStatus[i])
  }
}

and like:

$.alerts = {
  verticalOffset: -75,
  horizontalOffset: 0,
  repositionOnResize: true,
  overlayOpacity: .01,
  overlayColor: '#FFF'
}

but i cant do nothing functional.

Thanks in advance.

KaptajnKold · Accepted Answer · 2011-09-07 10:12:07Z

1

This is how I would do it:

items = 'Imágenes jpg,gif,png|Todos *'.split("|").map(function (itemString) {
    var parts =  itemString.split(" ");
    return { title: parts[0], extensions: parts[1] };
});

Or you can do this if you use jQuery and need to support older browsers:

items = $.map('Imágenes jpg,gif,png|Todos *'.split("|"), function () {
    var parts =  this.split(" ");
    return { title: parts[0], extensions: parts[1] };
});

edited Sep 7, 2011 at 10:12

answered Sep 7, 2011 at 9:59

KaptajnKold

11k10 gold badges44 silver badges58 bronze badges

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

5 Comments

GregL Over a year ago

You forgot the .split('|') on the first line, and the native Javascript Array.map() function is only compatible with newer browsers.

KaptajnKold Over a year ago

Fixed. And it is super easy to add map, reduce etc. to the Array prototype in browsers that don't support them natively. Those methods are so useful, that I would recommend anyone to always do that. There's a project on GitHub called ES5 Shim that does just that.

DavidB Over a year ago

this way works too, and seems to be a bit more cool :) i'll try the "map" way in various browsers so i can see if they support this, anyway, the GregL's way will be a generic solution for me :) thanks from spain!!

KaptajnKold Over a year ago

map doesn't work in IE8 and below. If you need to support that, you can either use the jQuery solution or you can include github.com/kriskowal/es5-shim or you can use GregL's solution.

DavidB Over a year ago

ok, i only need ff, chrome y safari (for the designers), the jquery variant is the best for me, es5-shim is more than i need. In the other hand, i save this question and es5-shim link for the future. i had a problem, now i have a solution. thanks very much again!

GregL · Accepted Answer · 2011-09-07 10:01:21Z

1

Your pseudocode is close.

Try the following vanilla javascript:

var str = 'Imágenes jpg,gif,png|Todos *';
var objs = str.split('|');
var objects = [];
for (var i = 0; i < objs.length; i++) {
    var parts = objs[i].split(' ');
    objects.push({ title: parts[0], extensions: parts[1] });
}
// objects is now an array of custom objects in the format you specified.

answered Sep 7, 2011 at 10:01

GregL

38.2k8 gold badges65 silver badges68 bronze badges

Collectives™ on Stack Overflow

how to create a complex javascript structure

2 Answers 2

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related