What is the right way to define canonical and alternate hreflang tags for a multilingual website?

Hello Mahmoud, Thanks for invitation.
There is no one answer for this question, but as Moataz said, its better to make the defaut language under the default root folder /, then give each language a folder or sub domain.
  Making the default home page under a foldr line /en/ or /ar/ not / will need a redirect with every visit to the home page, I understand this could be done smoothly without the user noticing it, but its not healthy in my opinion.
  Now I wuld be more concerned about if I make them under a sub folder or a sub domain, there is not big difference these days since you can set a geotargeting on WMT for both methods, but a sub-domain seems to be more proffesional, and makes you safer with penalties, since sub-domains are treated as new - or new sub websites by Google at least.
  A good advice here is, what ever structure you use, make sure that all your inside main pages are directly under the root folder, or the language folder, since they all will vote for your home page, through internal links which many times are more important that external backlinks.
  What I mean here: www.example.com/category1.php is better that www.example.com/categry1/index.php This provide a better inernal backlinks structure supporting your home page.
  For Cnonical and alternate hreflang tags, there is no need to re-invent the wheel here, Google articles are more than enough, tose are a must read articles: https://support.google.com/webmasters/answer/189077?hl=en https://sites.google.com/site/webmasterhelpforum/en/faq-internationalisation   Also be careful, there is a debate if using canonical with a hreflang tag in the same time is a good or not, you need to researc it since it fit for some websites while not for others.
Good Luck.

www.example.com

I would always go for / for the default language.
Because Google needs to know what your root is all about and hence rank you for your keywords.

Why you Make two folders one for each language ,what if the website contain t Four or More language you can only use the root folder and switch Pages content ,style Depending on Selected Culture Example en-Us ,ar-EG By using Localization http://www.codeproject.com/Articles/334820/Using-Globalization-and-Localization-in-ASP-NET