I'll do my best to answer each aspect of your question, but keep in mind that this is a broad topic with many intricate details.
first things first:
They claim that this is secure enough (as it seems that no sensitive info ever travels unencoded)
Semantic correction - the word you want is unencrypted, not unencoded. Encoding means that the data is easily reversible, and encryption is in place to prevent an attacker from reversing the encrypted data back to the original value.
Using a simple MITM attack, attacker can modify webpage JS by adding an event listener that posts card details to the attackers server on submit of the form (that have all the card details). The user and the server wouldn't notice anything strange and the transaction could complete successfully. Is my understanding correct of the situation? Is it really unsafe?
Your understanding is not quite correct for HTTPS sites. Because the data is encrypted, your MITM wouldn't be able to make any changes to the traffic. Remember, the encryption happens between the victim and the website - your MITM proxy doesn't have any control over the encryption. Therefore, all it sees is encrypted data - this makes it impossible to edit on the fly and insert malicious code. Your understanding is correct for HTTP sites, however. MITM attackers are able to manipulate traffic, including injecting malicious scripts.
There is an attack called SSLstrip in which an attacker MITMs the HTTPS encryption by downgrading the user to HTTP (changing https:// to http://). This works because the victim browser thinks the attacker is the website, and the website thinks the attacker is the victim. This is prevented in most websites nowadays by the inclusion of the HSTS header which tells the browser to only access the site through HTTPS. There is a more robust and fairly nontechnical article on this attack here: https://avicoder.me/2016/02/22/SSLstrip-for-newbies/
And also, is MITM attack something that is very hard to perform, or is it doable with minimal hacking? How is it when comparing Public Wifi, Home Wifi and Cable internet?
MITM is incredibly easy to perform. All wifi traffic is broadcasted - this means that any nearby sniffing devices can read your traffic. If you're connecting to a page through HTTP over public/unencrypted wifi you can assume that whatever information you are sending and receiving is public - all it takes is an attacker nearby with an antenna to read all that in plaintext. To perform a true MITM by having traffic flow through them, attackers can use technologies like WiFi pineapples or aircrack-ng to force users to connect to their wifi network.
You might have heard of WPA/WPA2 wifi encryption. This is the current standard for wifi encryption - if you're connecting to your home router with WPA2 you can be reasonably confident that an external attacker can't intercept your data. WEP has been obsolete for a long time - do not trust WEP encryption to keep your connection secure. Keep this in mind whenever your connect to an open (unencrypted) network - your laptop/phone will generally warn you of this before you connect.
Connecting over cable internet is much harder to intercept/mitm because you're not broadcasting your traffic for the whole neighborhood. In order to compromise this network an attacker will have to gain access to it somehow - either through physical access to a network port, malware installed on a host machine or router, etc. When an attacker has access to a network they then have to exploit that access through attacks such as ARP poisoning or HSRP spoofing. These attacks just MITM traffic - anyone on the network can still sniff (read, but not change) traffic, but keep in mind HTTPS traffic is still encrypted and can't be read.
