如何像数组使用.forEach/.some那样比较两个Observable的值是否重叠？

Got it, let's work through how to refactor your friend overlap check to use Observables—assuming you're working with RxJS here, since it's the go-to for reactive async streams in most frontend setups. Here's a clean, reactive approach that ties directly into your view binding needs:

Step 1: Define Your Source Observables #

First, make sure you have two Observables representing your data streams:

• currentUserFriends$: Emits the array of the current user's friends (e.g., User[] with an id property or unique identifier)
• usersToCheck$: Emits the array of users you need to check against (e.g., an array where each item has a utc object that needs the isFriend flag)

Step 2: Optimize Friend Lookup with a Set #

We'll convert the current user's friends into a Set of IDs first—this makes overlap checks O(1) instead of O(n), which is way more efficient, especially with large friend lists:

import { map, distinctUntilChanged } from 'rxjs/operators';

// Create an Observable that emits a Set of current user friend IDs
const currentUserFriendIds$ = currentUserFriends$.pipe(
  // Optional: Only update if the friends array actually changes to avoid unnecessary computations
  distinctUntilChanged((prev, curr) => 
    prev.length === curr.length && prev.every((friend, idx) => friend.id === curr[idx].id)
  ),
  map(friends => new Set(friends.map(friend => friend.id)))
);

Step 3: Combine Streams and Calculate Friend Status #

Use combineLatest to merge the two streams—this will re-run the check whenever either the friend list or the users-to-check list updates, which is perfect for keeping your view in sync:

import { combineLatest } from 'rxjs';

// Combine the streams and map to the updated users with isFriend flag
const usersWithFriendStatus$ = combineLatest([usersToCheck$, currentUserFriendIds$]).pipe(
  map(([usersToCheck, friendIds]) => {
    return usersToCheck.map(user => {
      // Replace `user.utc.userId` with the actual property that matches your friend IDs
      const isFriend = friendIds.has(user.utc.userId);
      // Return a new object (immutable update) to trigger view changes if needed
      return {
        ...user,
        utc: {
          ...user.utc,
          isFriend: isFriend
        }
      };
    });
  })
);

Step 4: Bind to Your View #

Now you can bind usersWithFriendStatus$ directly to your view (depending on your framework—Angular, React with RxJS hooks, etc.). Anytime either source Observable emits a new value, the view will automatically update with the correct isFriend flags.

Quick Notes #

• If your data streams only emit once (e.g., one-time API calls), you can use forkJoin instead of combineLatest—but combineLatest is more flexible for dynamic updates.
• Adjust the ID matching logic (user.utc.userId) to match whatever unique identifier you use for users/friends.
• The distinctUntilChanged operator is optional but recommended to prevent unnecessary re-renders/computations when the friend list doesn't actually change.

内容的提问来源于stack exchange，提问作者Jordan Benge