Почему в компонент передают массив с данными через обьект?
так сделано апи функциональных компонентов. В функцию передается объект в котором пропсы. Это устройство мироздания в данной локальной точке, смиритесь и делайте так как описано в документации. 

Если вас фигурные скобочки смущают, можете писать 
export const Notes = (props) => { // дальше props.arrList
Погуглите про деструктуризацию объектов в js и поймёте принцип