getContext()できないときは要素が本当にcanvasか確認しよう

Emmetで「canvas#canvas」とするところを、間違えて「#canvas」と入力してしまい、できあがったdiv要素に対してgetContext()してしまったためエラーが出ました。
はずかしいミスですが意外と気づかなそうなので書いておきます。

const canvas = document.getElementById('canvas') // この時点でdiv要素が入ってしまっている
const ctx = canvas.getContext('2d') // Uncaught TypeError: canvas.getContext is not a function

ちなみにcanvas要素が読み込まれる前にスクリプトを実行しようとすると "Uncaught TypeError: Cannot read properties of null (reading 'getContext')" というようなエラーが出ます。
jsファイルの読み込みを</body>の直前に書いたり、「document.addEventListener('DOMContentLoaded')」のコールバック内にスクリプトを書くなどの方法で対処できると思います。