В чём здесь ошибка?

Question

[iharaleynikov]

Помогите пожалуйста! Есть такой код:

const file1 = {
  host: 'something.io',
  timeout: 50,
  proxy: '123.234.53.22',
  follow: false,
};

const file2 = {
  timeout: 20,
  verbose: true,
  host: 'something.io'',
};

const genDiff = (file1, file2) => {
  const mergeFiles = { ...file1, ...file2 };

  const uniqueKeys = Object.keys(mergeFiles);

  const diff = uniqueKeys.map(key => {
    if (_.has(file1, key) && !_.has(file2, key)) {
      return { key, value: file1[key], status: 'removed' };
    } else if (!_.has(file1, key) && _.has(file2, key)) {
      return { key, value: file2[key], status: 'new' };
    } else if (_.has(file1, key) && _.has(file2, key) && file1[key] === file2[key]) {
      return  { key, value: file1[key], status: 'same' };
    } else if (_.has(file1, key) && _.has(file2, key) && file1[key] !== file2[key]) {
      return  { key, value: { oldValue: file1[key], newValue: file2[key] }, status: 'changed' };
    }
  });
  
  return diff.map(key => {
    if (key.status === 'removed') {
      console.log(`- ${key}: ${key.value}`);
    } else if (key.status === 'new') {
      console.log(`+ ${key}: ${key.value}`);
    } else if (key.status === 'same') {
      console.log(`  ${key}: ${key.value}`);
    } else if (key.status === 'changed') {
      console.log(`- ${key}: ${key.value.oldValue}\n+ ${key}: ${key.value.newValue}`);
    }
  });
};

console.log(genDiff(file1, file2));

Функция genDiff принимает на вход два объекта (file1 и file2) и сравнивает их. Вывод должен был быть такой:

host: something.io
- timeout: 50
+ timeout: 20
- proxy: 123.234.53.22
- follow: false
+ verbose: true

Но в итоге я получаю это:

[object Object]: something.io
- [object Object]: 50
+ [object Object]: 20
- [object Object]: 123.234.53.22
- [object Object]: false
+ [object Object]: true
[ undefined, undefined, undefined, undefined, undefined ]

Что в этом коде не так?

Comments

[Сергей]

отпишись как проверишь мой код

Answer 1

[MikUrrey]

У вас key - объект. Вы его сначала как объект юзаете if (key.status..., а потом в строку вставляете `- ${key}...
Может быть, ${key.key} ?

Comments

[iharaleynikov]

Вы правы! Но что делать с массивом undefined в конце?

[WbICHA]

iharaleynikov, возможно, стоит что-то возвращать?

diff.map(key => {
    if (key.status === 'removed') {
      console.log(`- ${key}: ${key.value}`);
    } else if (key.status === 'new') {
      console.log(`+ ${key}: ${key.value}`);
    } else if (key.status === 'same') {
      console.log(`  ${key}: ${key.value}`);
    } else if (key.status === 'changed') {
      console.log(`- ${key}: ${key.value.oldValue}\n+ ${key}: ${key.value.newValue}`);
    }
  });

[iharaleynikov]

WbICHA,

const x = diff.map(key => {
    if (key.status === 'removed') {
      return `- ${key.key}: ${key.value}`;
    } else if (key.status === 'new') {
      return `+ ${key.key}: ${key.value}`;
    } else if (key.status === 'same') {
      return `  ${key.key}: ${key.value}`;
    } else if (key.status === 'changed') {
      return `- ${key.key}: ${key.value.oldValue}\n+ ${key.key}: ${key.value.newValue}`;
    }
  });

  for (const key of x) { console.log(key); }

В конце всё равно выводится undefined, что я не так делаю?

[WbICHA]

iharaleynikov, андефайнды тут могут быть только в одном случае: если кей.статус не равен ни одному из значений.
И да, это бы стоило на switch переписать.

[MikUrrey]

WbICHA, лучше if без else. Потому что там все равно return и выполнение прерывается

if (key.status === 'removed') {
      return `- ${key.key}: ${key.value}`;
    }
    if (key.status === 'new') {
      return `+ ${key.key}: ${key.value}`;
    }
    if (key.status === 'same') {
      return `  ${key.key}: ${key.value}`;
    }
    if (key.status === 'changed') {
      return `- ${key.key}: ${key.value.oldValue}\n+ ${key.key}: ${key.value.newValue}`;
    }

[WbICHA]

MikUrrey, с ретурном иф без элса, конечно, лучше, но не тогда, когда свитч лучше обоих вариантов.)

[MikUrrey]

WbICHA, свитч НЕ лучше. К нему вообще сильно привыкать не рекомендуется, чтобы не тащить потом в большие блоки кода и не превращать их в лапшу.
В данном случае блоки однострочные, читаемость кода будет одинаковой, что switch, что if, поэтому не суть важно. Замена if на switch здесь - не рефакторинг, а вкусовщина.

[WbICHA]

MikUrrey, угу, убеждаться на каждом ифе, что key.status проверяется, что именно на равенство проверяется, когда со свичом всё однозначно.
Так что в данном примере свитч лучше. Однозначно лучше.

[MikUrrey]

WbICHA, ок, убедительно, тут вы правы :) Но меня перечисленные детали обычно не напрягают, поэтому стараюсь пользоваться if-ами, т.к. код мутирует, блоки увеличиваются, а if-ы не надо перестраивать в другие конструкции для расширения условий.

[WbICHA]

MikUrrey, проблема ифов в их универсальности. Свитч покрывает частный случай и видя его, всё сразу предельно ясно, а с ифами лично я сразу начинаю искать причины по которым здесь не свитч, как дополнительное условие, к примеру, или другой оператор сравнения.

Это как с использованием иф-элса, после которого ничего нет.

() => {
  if(...) {
    // ...
    // ...
    // ...
  } else {
    // ...
    // ...
    // ...
  }
}

// ---------------------

() => {
  if(...) {
    // ...
    // ...
    // ...
    return;
  }
  // ...
  // ...
  // ...
}

Код работает одинаково, но в первом случае тебе ещё надо пойти в конец функции чтобы убедиться, что там ничего нет, а во втором ты сразу видишь, что из блока иф выхода нет.)

Answer 2

[Сергей]

const file1 = {
host: 'something.io',
timeout: 50,
proxy: '123.234.53.22',
follow: false,
};

const file2 = {
timeout: 20,
verbose: true,
host: 'something.io',
};

const genDiff = (file1, file2) => {
const mergeFiles = { ...file1, ...file2 };
const uniqueKeys = Object.keys(mergeFiles);
const diff = uniqueKeys.map((key, index, arr) => {
if (file1.hasOwnProperty(key) && !file2.hasOwnProperty(key)) {
return { key, value: file1[key], status: 'removed' };
} else if (!file1.hasOwnProperty(key) && file2.hasOwnProperty(key)) {
return { key, value: file2[key], status: 'new' };
} else if (file1.hasOwnProperty(key) && file2.hasOwnProperty(key) && file1[key] === file2[key]) {
return { key, value: file1[key], status: 'same' };
} else if (file1.hasOwnProperty(key) && file2.hasOwnProperty(key) && file1[key] !== file2[key]) {
return { key, value: { oldValue: file1[key], newValue: file2[key] }, status: 'changed' };
}
});

return diff.map((item, index, arr) => {
if (item.status === 'removed') {
console.log(`- ${item.key}: ${item.value}`);
} else if (item.status === 'new') {
console.log(`+ ${item.key}: ${item.value}`);
} else if (item.status === 'same') {
console.log(` ${item.key}: ${item.value}`);
} else if (item.status === 'changed') {
console.log(`- ${item.key}: ${item.value.oldValue}`);
console.log(`+ ${item.key}: ${item.value.newValue}`);
}
});
};

genDiff(file1, file2);

Comments

[Сергей]

сорь, вставил как комент )))

const file1 = {
        host: 'something.io',
        timeout: 50,
        proxy: '123.234.53.22',
        follow: false,
    };

    const file2 = {
        timeout: 20,
        verbose: true,
        host: 'something.io',
    };

    const genDiff = (file1, file2) => {
        const mergeFiles = { ...file1, ...file2 };
        const uniqueKeys = Object.keys(mergeFiles);
        const diff = uniqueKeys.map((key, index, arr) => {
            if (file1.hasOwnProperty(key) && !file2.hasOwnProperty(key)) {
                return { key, value: file1[key], status: 'removed' };
            } else if (!file1.hasOwnProperty(key) && file2.hasOwnProperty(key)) {
                return { key, value: file2[key], status: 'new' };
            } else if (file1.hasOwnProperty(key) && file2.hasOwnProperty(key) && file1[key] === file2[key]) {
                return  { key, value: file1[key], status: 'same' };
            } else if (file1.hasOwnProperty(key) && file2.hasOwnProperty(key) && file1[key] !== file2[key]) {
                return  { key, value: { oldValue: file1[key], newValue: file2[key] }, status: 'changed' };
            }
        });
        
        return diff.map((item, index, arr) => {
            if (item.status === 'removed') {
                console.log(`- ${item.key}: ${item.value}`);
            } else if (item.status === 'new') {
                console.log(`+ ${item.key}: ${item.value}`);
            } else if (item.status === 'same') {
                console.log(`  ${item.key}: ${item.value}`);
            } else if (item.status === 'changed') {
                console.log(`- ${item.key}: ${item.value.oldValue}`);
                console.log(`+ ${item.key}: ${item.value.newValue}`);
            }
        });
    };

    genDiff(file1, file2);

[Сергей]

вот вывод в консоль

[WbICHA]

Сергей, к чему дубликат ответа? И ладно бы ещё вторую проблему автора решил, так нет, тупо тоже самое, ещё в отвратительном виде (ответы, внезапно, можно редактировать).

[Сергей]

WbICHA, Разуй глаза умник! Код подправлен, и вторая проблема автора решена!

[WbICHA]

Сергей, и каким же образом проблема массива андефайндов решена? Удалением консоллога? Я не пойму, ты троллишь или что?

[Сергей]

WbICHA, undefined выводится потому что diff.map не возвращает результат, но, если я правильно понял логику автора, этот diff.map не должен ничего возвращать, а просто выводить в консоль сообщения...
если уж вам настолько это принципиально, то можно переписать так

return diff.map((item, index, arr) => {
            if (item.status === 'removed') {
                return`- ${item.key}: ${item.value}`;
            } else if (item.status === 'new') {
                return`+ ${item.key}: ${item.value}`;
            } else if (item.status === 'same') {
                return`  ${item.key}: ${item.value}`;
            } else if (item.status === 'changed') {
                return`- ${item.key}: ${item.value.oldValue}\n+ ${item.key}: ${item.value.newValue}`;
            }
            return undefined;
        });

а вызов функции так

genDiff(file1, file2).map(item => console.log(item));

и будет вам щастье!

[WbICHA]

этот diff.map не должен ничего возвращать, а просто выводить в консоль сообщения...

Для этого есть форЫч, а не мап.

[Сергей]

WbICHA, ты думаешь "форЫч" единственный вариант перебора массива?

[WbICHA]

Сергей, я думаю использовать мап, когда ненужен возвращаемый массив, это глупая идея.

[Сергей]

WbICHA, ничего глупого тут нет - это всего лишь один из способов перебора массива

[Сергей]

WbICHA, учи матчасть

[WbICHA]

Сергей, хватит демонстрировать свою некомпетентность, пожалуйста. Так трудно признать свою неправоту?

[Сергей]

WbICHA, в чем неправоту? где написано что так делать нельзя?
вы устанавливаете стандарты программирования?

[WbICHA]

Сергей,

вы устанавливаете стандарты программирования?

Да. Ещё вопросы?