jQueryのwidth(), innerWidth(), outerWidth()の違い

jQueryでwindow幅ごとに処理を書き分けるというのを書きましたが、その時に、widthとinnerWidthって何が違うの？ と思ったので、調べてみたことを書いておきます。

結論から言うと、以下の図の通りのようです。

しかし、①window.width(), ②window.innerWidth(), ③window.outerWidth()でconsole.logしてみたところ、
①=0, ②=③でした。なので、上記のwindow幅で処理を書き分けるコードを書いたときは、特に使い分けする必要がなかったので、innerWidthで書きました。

ただ、細かく調べたわけではないので、一度console.logで出力してみて確認してから使い分けた方が良さそうです。