두개의 json array 를 비교하는 좋은 방법이 궁금합니다.

안녕하세요,
두 개의 배열을 키로 비교해서 새로운 배열로 만들어야 할 일이 가끔 생기는데
어떤 좋은방법이 있을까 궁금해서 질문을 올립니다!

const arr1 = [
  {key: 'cat', value: '고양이' },
  {key: 'dog', value: '강아지' }
];
const arr2 = [
  {key: 'cat', name: '냥냥이' }, 
  {key: 'dog', name: '멍멍이' }
];
const animals = arr1.map((arr) => {
  return Object.assign(arr, arr2.find(arr2=> {
    return arr.key === arr2.key;
  }));
});

저는 이렇게 처리했는데 아무래도 map 안에서 또 find 를 하는게 많은 계산이 드는거같습니다.
좋은방법이 있다면 가르침 부탁드립니다!

새로운 object에 넣어서 하시는 것은 어떤가요?

{
  dog: {
    name: ''
    value: ''
   }
}
const obj = { cat: { value: '고양이' }, dog: { value: '강아지' } }

위와 같이 굳이 key를 오브젝트의 키로 넣고 싶지 않고,
질문에 올려주신 것과 같이 프로퍼티로 꼭 넣어주셔야 하는 이유가 있으시다면 이런 방법이 있습니다.

const arr1 = [
  {key: 'cat', value: '고양이' },
  {key: 'dog', value: '강아지' }
];
const arr2 = [
  {key: 'cat', name: '냥냥이' }, 
  {key: 'dog', name: '멍멍이' }
];

// If not sorted by keys
const animals0 = new Map(arr1.map(({ key, value }) => [key, { value, name: undefined }]));
arr2.forEach(({ key, name }) => animals0.set(key, { ...animals0.get(key), name }))
const a = Array.from(animals0).map(arr => ({ ...arr[1], key: arr.shift() }))
// [ { key: 'cat', value: '고양이', name: '냥냥이' }, { key: 'dog', value: '강아지', name: '멍멍이' } ] 

// If arr1 and arr2 are sorted by keys and both keys are present in each array
const animals2 = arr1.map(({ key, value }, idx) => ({ key, value, name: arr2[idx].name }))
// [ { key: 'cat', value: '고양이', name: '냥냥이' }, { key: 'dog', value: '강아지', name: '멍멍이' } ]