Restructure the array to align with the corresponding elements in another

Question

Restructure the array to align with the corresponding elements in another

I am looking to filter an array based on ids from another array. Specifically, I have an array of tweet ids associated with a certain hashtag in the object I'm working with.

h.tweet_ids = [*someTweetID*, *someOtherTweetID*, …]

On the other hand, I also have a userTimeline array that includes all tweets sent by the user who is logged in.

The structure of the userTimeline array looks like this ():

[
 {
   "coordinates": null,
   "favorited": false,
   "truncated": false,
   "created_at": "Wed Aug 29 17:12:58 +0000 2012",
   "id_str": "240859602684612608",
   ...
 },
 {
   "coordinates": null,
   "favorited": false,
   "truncated": false,
   "created_at": "Sat Aug 25 17:26:51 +0000 2012",
   "id_str": "239413543487819778",
   ...
 }
]

My goal is to filter the userTimeline array to only retrieve tweets whose ids match the ones in h.tweet_ids.

So far, I've attempted using nested loops, but I've encountered issues with it sometimes going into an infinite loop...

$scope.showTweetsForHashtag = function(h){
  var userTimeline = $scope.userTimeline,
     tweetId=h.tweetId,
     hTweets = [];
  for (var i = 0; i < tweetId.length; i++) {
     for (var j = 0; j < userTimeline.length; j++) {
        if (userTimeline[j].id_str===tweetId[i]) {
           hTweets.push(userTimeline[j]);
        }
     }
  }
  $scope.selHash=h.Hashtag;
  $scope.hTweets=hTweets;
  if (!$scope.hModal) {
     $scope.hModal=true
  }
};

Thank you for your assistance!

Cheers ^Q

javascript arrays angularjs twitter filter

Answer 1

Answer №1

In my approach with lodash, I would write the following code:

var users = [
  {
    "coordinates": null,
    "favorited": false,
    "truncated": false,
    "created_at": "Wed Aug 29 17:12:58 +0000 2012",
    "id_str": "240859602684612608",
    "entities": {
    },
    "in_reply_to_user_id_str": null,
    "contributors": null,
    "text": "Introducing the Twitter Certified Products Program: https://t.co/MjJ8xAnT",
    "retweet_count": 121,
    "in_reply_to_status_id_str": null,
    "id": 240859602684612608,
    "geo": null,
    "retweeted": false,
    "possibly_sensitive": false,
    "in_reply_to_user_id": null,
    "place": null,
    "user": {
    },
    "in_reply_to_screen_name": null,
    "source": "",
    "in_reply_to_status_id": null
  },
  {
    "coordinates": null,
    "favorited": false,
    "truncated": false,
    "created_at": "Sat Aug 25 17:26:51 +0000 2012",
    "id_str": "239413543487819778",
    "entities": {
    },
    "in_reply_to_user_id_str": null,
    "contributors": null,
    "text": "We are working to resolve issues with application management & logging in to the dev portal: https://t.co/p5bOzH0k ^TS",
    "retweet_count": 105,
    "in_reply_to_status_id_str": null,
    "id": 239413543487819778,
    "geo": null,
    "retweeted": false,
    "possibly_sensitive": false,
    "in_reply_to_user_id": null,
    "place": null,
    "user": {
    },
    "in_reply_to_screen_name": null,
    "source": "",
    "in_reply_to_status_id": null
  }
];

var tweet_ids = ["240859602684612608", "000000"];
var matchIds = _.intersection(_.pluck(users, 'id_str'),tweet_ids );
var matchTweets = _.filter(users,function(userTmp){
  return matchIds.indexOf(userTmp.id_str) !== -1 ;
})

console.log(matchTweets);

$("body").append(JSON.stringify(matchTweets))

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.10.0/lodash.min.js"></script>

<body></body>

Answer 2

In my approach with lodash, I would write the following code:

var users = [
  {
    "coordinates": null,
    "favorited": false,
    "truncated": false,
    "created_at": "Wed Aug 29 17:12:58 +0000 2012",
    "id_str": "240859602684612608",
    "entities": {
    },
    "in_reply_to_user_id_str": null,
    "contributors": null,
    "text": "Introducing the Twitter Certified Products Program: https://t.co/MjJ8xAnT",
    "retweet_count": 121,
    "in_reply_to_status_id_str": null,
    "id": 240859602684612608,
    "geo": null,
    "retweeted": false,
    "possibly_sensitive": false,
    "in_reply_to_user_id": null,
    "place": null,
    "user": {
    },
    "in_reply_to_screen_name": null,
    "source": "",
    "in_reply_to_status_id": null
  },
  {
    "coordinates": null,
    "favorited": false,
    "truncated": false,
    "created_at": "Sat Aug 25 17:26:51 +0000 2012",
    "id_str": "239413543487819778",
    "entities": {
    },
    "in_reply_to_user_id_str": null,
    "contributors": null,
    "text": "We are working to resolve issues with application management & logging in to the dev portal: https://t.co/p5bOzH0k ^TS",
    "retweet_count": 105,
    "in_reply_to_status_id_str": null,
    "id": 239413543487819778,
    "geo": null,
    "retweeted": false,
    "possibly_sensitive": false,
    "in_reply_to_user_id": null,
    "place": null,
    "user": {
    },
    "in_reply_to_screen_name": null,
    "source": "",
    "in_reply_to_status_id": null
  }
];

var tweet_ids = ["240859602684612608", "000000"];
var matchIds = _.intersection(_.pluck(users, 'id_str'),tweet_ids );
var matchTweets = _.filter(users,function(userTmp){
  return matchIds.indexOf(userTmp.id_str) !== -1 ;
})

console.log(matchTweets);

$("body").append(JSON.stringify(matchTweets))

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.10.0/lodash.min.js"></script>

<body></body>

Answer 3

Answer №2

Fortunately, I managed to find a solution without using Lodash!

$scope.showTweetsForHashtag = function(h) {
    var userTimeline = $scope.userTimeline,
        tweetId = h.tweetId,
        hTweets = [];
    if (Array.isArray(tweetId)) {
        for (var i = 0; i < tweetId.length; i++) {
            var hTweet = userTimeline.filter(function(el) {
                return el.id_str === tweetId[i];
            });
            hTweets = hTweets.concat(hTweet);
        }
        $scope.hTweets = hTweets;
    } else {
        $scope.hTweets = userTimeline.filter(function(el) {
            return el.id_str === tweetId;
        });
    }
    $scope.selHash = h.Hashtag;
    if (!$scope.hModal) {
        $scope.hModal = true
    }
};

Thank you for your assistance!

^Q

Answer 4

Fortunately, I managed to find a solution without using Lodash!

$scope.showTweetsForHashtag = function(h) {
    var userTimeline = $scope.userTimeline,
        tweetId = h.tweetId,
        hTweets = [];
    if (Array.isArray(tweetId)) {
        for (var i = 0; i < tweetId.length; i++) {
            var hTweet = userTimeline.filter(function(el) {
                return el.id_str === tweetId[i];
            });
            hTweets = hTweets.concat(hTweet);
        }
        $scope.hTweets = hTweets;
    } else {
        $scope.hTweets = userTimeline.filter(function(el) {
            return el.id_str === tweetId;
        });
    }
    $scope.selHash = h.Hashtag;
    if (!$scope.hModal) {
        $scope.hModal = true
    }
};

Thank you for your assistance!

^Q

Answer 5

Answer №3

To achieve the desired result, utilize Array.prototype.filter just like in the example provided at http://jsfiddle.net/2LcpaeLm/:

var tweet_ids = [1,2,3,5,8,13,21];
var tweets = [{
    'id_str': 1
}, {
    'id_str': 4
}, {
    'id_str': 8
}, {
    'id_str': 11
}];

var filtered = tweets.filter(function (t) {
    for (var i = 0, len = tweet_ids.length; i < len; i++) {
        if (tweet_ids[i] == t.id_str)
            return true;
    }
});

console.log(filtered);

Answer 6

To achieve the desired result, utilize Array.prototype.filter just like in the example provided at http://jsfiddle.net/2LcpaeLm/:

var tweet_ids = [1,2,3,5,8,13,21];
var tweets = [{
    'id_str': 1
}, {
    'id_str': 4
}, {
    'id_str': 8
}, {
    'id_str': 11
}];

var filtered = tweets.filter(function (t) {
    for (var i = 0, len = tweet_ids.length; i < len; i++) {
        if (tweet_ids[i] == t.id_str)
            return true;
    }
});

console.log(filtered);

Restructure the array to align with the corresponding elements in another

Answer №1

Answer №2

Answer №3

Similar questions

Filtering Images by Alt Attribute: A Comprehensive Guide

Activate video playback when scrolling, but ensure it only occurs one time

Ways to Ensure a Property of an Object Remains Synced with Another

Choose an option to adjust the transparency of the image

Delete any array elements in MongoDB that have an ID matching an element in the specified array

Attempting to utilize the ngSwitch directive within an Angular application

The locomotive scroll elements mysteriously vanish as you scroll, leaving the footer abruptly cut off

Troubleshooting: Issue with jQuery not recognizing this.id

Android Studio crashes unexpectedly while attempting to access data from an array

What is the best way to incorporate a JavaScript function into an Angular 2 template?

Adjusting the dimensions of the central container

Navigating a secure Koa authentication flow using compose mechanism

The vertical scroll position of a container with overflowing content does not correspond to the height of its elements

Error: Unable to render followers list due to incorrect data type

What is the best way to display several markers on a Google Map at once?

Encountering the "ExpressionChangedAfterItHasBeenCheckedError" in Angular 2

Using Vue.js: Executing a method in one component from another

How to show the current week using React Native

Is it feasible to have unique popups for individual textbox edits?

Prevent the transmission of keydown events from dat.GUI to the Three.js scene to maintain event isolation