Sorting/Filtering JSON based on certain property

Question

So I got this response from an API. I want to build a select box from all types, how do I extract only JSON related to skill_level from this JSON without using loops.

[
  {
    "id": 32,
    "name": "Beginner",
    "type": "skill_level"
  },
  {
    "id": 33,
    "name": "Intermediate",
    "type": "skill_level"
  },
  {
    "id": 34,
    "name": "Experienced",
    "type": "skill_level"
  },
  {
    "id": 35,
    "name": "Professional",
    "type": "skill_level"
  },
  {
    "id": 36,
    "name": "Expert",
    "type": "skill_level"
  },
  {
    "id": 37,
    "name": "Male",
    "type": "sex"
  },
  {
    "id": 38,
    "name": "Female",
    "type": "sex"
  },
  {
    "id": 39,
    "name": "Single",
    "type": "marital_status"
  },
  {
    "id": 40,
    "name": "Married",
    "type": "marital_status"
  },
  {
    "id": 41,
    "name": "Divorced",
    "type": "marital_status"
  },
  {
    "id": 42,
    "name": "Not Wish To Say",
    "type": "marital_status"
  }
]

Using underscore.js: var skillLevelArray = _.filter(JSONData, function(item) { return item.type=="skill_level"; }; — connexo
– connexo, Commented Jul 22, 2015 at 14:06
@connexo I would not want to use loop because the json in my question is just a truncated chunk of the main json which I can post here. In other words its a heavy json data — Emeka Mbah
– Emeka Mbah, Commented Jul 22, 2015 at 14:29

jmar777 · Accepted Answer · 2015-07-22 14:39:13Z

3

Check out Array.prototype.filter:

var skillLevels = data.filter(function(item) {
    return item.type === 'skill_level';
});

From the docs, this works as follows:

The filter() method creates a new array with all elements that pass the test implemented by the provided function.

Assuming that data refers to the array you provided in your question, this will result with skillLevels being a new array containing all of the items where item.type was equal to "skill_level".

edited Jul 22, 2015 at 14:39

answered Jul 22, 2015 at 14:01

jmar777

39.8k11 gold badges68 silver badges66 bronze badges

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

5 Comments

Emeka Mbah Over a year ago

thanks for your answer. how does this work? where is .filter coming from? is this a method in angularjs?

jmar777 Over a year ago

Hey, .filter() is available on all JavaScript arrays (it's a core part of the language, not something provided by Angular or other external library). Please see my updated answer.

Emeka Mbah Over a year ago

Awesome. Thanks @mar777

connexo Over a year ago

Which ECMA Script Version was this introduced with?

jmar777 Over a year ago

@connexo It was introduced in ECMAScript 5.1 (it works in IE9+ and virtually all extant versions of other browsers). It's trivial to polyfill if you need <=IE8 support.

Daniel Cottone · Accepted Answer · 2015-07-22 14:03:30Z

1

You can do this with lodash:

$scope.data = ...;
$scope.filtered = _.filter($scope.data, { 'type': 'skill_level' });

This will return only the objects that have skill_level for type.

answered Jul 22, 2015 at 14:03

Daniel Cottone

4,52029 silver badges39 bronze badges

3 Comments

Daniel Cottone Over a year ago

Absolutely, you just need to include it in your index.html.

Emeka Mbah Over a year ago

Thanks man. I accepted @jmar777 answer because it works out of box, however I like Lodash seems more efficient and faster, been looking for a library like that. Thanks for your answer. An upvote for you.

connexo Over a year ago

I like the sexy syntax in lodash compared to Vanilla JS or even Underscore.js. It has to be noted, hough, that it comes with a price tag - 12k lines of code (lodash) compared to 1.5k (underscore).

Emeka Mbah · Accepted Answer · 2015-07-23 14:41:57Z

0

I just figured out that you can also do it this way in AngularJs:

<select id="sex" name="sex" ng-model="sex">
    <option ng-repeat="option in $scope.data | filter:{type: 'sex'}" value="{{option.id}}">{{option.name}}</option>
</select>

answered Jul 23, 2015 at 14:41

Emeka Mbah

17.7k11 gold badges84 silver badges104 bronze badges

Collectives™ on Stack Overflow

Sorting/Filtering JSON based on certain property

3 Answers 3

5 Comments

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

5 Comments

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related