Difference between document.hidden vs document.hasFocus()

Please explain the difference between document.hidden , the HTML5 Page Visibility API and document.hasFocus(). I am doing a project which pops HTML5 Desktop Notification when the tab is not focused . I am kind of confused which one to use.