CODEWITHSUNDEEP
javascriptreactjsreact-nativeecmascript-6
Abhigyan Gaurav
Abhigyan Gaurav

Reputation: 1904

How can I find particular value from array in react native

I am trying to find each link value in different variables according to their name , like if name if facebook then facebooklink should filter , same lite twitter and all . But don't want to give index number . sometime fabook should be o index sometime twitter will be on 0 index . Please help 

socialMediaDetails:
            socialMediaDetail: Array(2)
            0:
            link: "[email protected]"
            name: "twitter"
            __typename: "SocialMediaDetail"
            __proto__: Object
            1:
            link: "[email protected]"
            name: "facebook"
            __typename: "SocialMediaDetail"
            __proto__: Object
            2:
            link: "[email protected]"
            name: "linkedIn"
            __typename: "SocialMediaDetail"

        const socialMediaData=socialMediaDetails.socialMediaDetail;

            const Steplabels = socialMediaData.filter((item) => {
              return item.name === "twitter"
            });

Thanks

Upvotes: 1

Views: 24954

Answers (3)

Lonare
Lonare

Reputation: 4663

You could use:

  1. if you only want to know if the value exists or not

    var doesExist = arr.some(function(ele) { return ele.id === '21'; });

  2. If you want to get the value you are searching for:

    var data = arr.find(function(ele) { return ele.id === '21'; });

    if (data) { console.log('found'); console.log(data); // This is entire object i.e. item not boolean }

I have used following array for this example:

var arr = [];
var item1 = {
    id: 21,
    label: 'Banana',
};
var item2 = {
    id: 22,
    label: 'Apple',
};
arr.push(item1, item2);

Upvotes: 1

Matcha Sesha Abhishek
Matcha Sesha Abhishek

Reputation: 342

You can use find method, like this:

requiredMediaByName = (name) => {
 return state.socialMediaDetails.socialMediaDetail.find(data => data.name === name);
}; 
console.log(requiredMediaByName('facebook'));

Note that find returns the first matching element in the array and it won't check the other elements if you get it on fist match. If you want all the elements to be returned then you should use for loop and get all of them.

Upvotes: 4

Dacre Denny
Dacre Denny

Reputation: 30360

There are a few ways this can be achieved - the simplest way would be to use a for .. of loop if you're just looking for the first item matching on name:

function findLinkByName(name) {
  for (const item of state.socialMediaDetails.socialMediaDetail) {
    if (item.name === name) {
      return item.link;
    }
  }
}

For other cases such as returning a subset of items where multiple matches on name exist, then a simple solution based on filter() and map() could be achieved like this:

function findLinksByName(name) {
  return state.socialMediaDetails.socialMediaDetail
    .filter(item => item.name === name)
    .map(item => item.link);
}

Here's a snippet showing both in action:

var state = {
  socialMediaDetails: {
    socialMediaDetail: [{
        link: "[email protected]",
        name: "twitter"
      }, {
        link: "[email protected]",
        name: "facebook"
      }, {
        link: "[email protected]",
        name: "linkedIn"
      }, {
        link: "another twitter link",
        name: "twitter"
      }
    ]
  }
}

/* 
Find link of first item matching by name (or undefined if no match found) 
*/
function findLinkByName(name) {
  for (const item of state.socialMediaDetails.socialMediaDetail) {
    if (item.name === name) {
      return item.link;
    }
  }
}

/* 
Find links for all items with matching name (or empty array if no
matches found) 
*/
function findLinksByName(name) {
  return state.socialMediaDetails.socialMediaDetail
    .filter(item => item.name === name)
    .map(item => item.link);
}

console.log(findLinkByName('twitter'));
console.log(findLinkByName('facebook'));
console.log(findLinksByName('twitter'));
console.log(findLinksByName('facebook'));

Hope that helps!

Upvotes: 2

Related Questions