https://developer.mozilla.org/ko/docs/Web/API/HTMLCanvasElement/getContext

HTMLCanvasElement.getContext()

var ctx = canvas.getContext(contextType);
var ctx = canvas.getContext(contextType, contextAttributes);

동일한 캔버스 엘리먼트에서 나중에 이 메소드를 호출하면 동일한 contextType 인자와 함께 메소드가 마지막으로 호출되었을 때 반환된 것과 같이 동일한 드로잉 컨텍스트 인스턴스를 반환합니다.
=> 무슨 소리인지 잘 모르겠다 일단 더 읽어보고 다시 돌아와 보기로

파라미터

contextType

다른 드로잉 컨텍스트 객체를 얻으려면 다른 contextType을 전달하거나 다른 캔버스 엘리먼트에서 메소드를 호출해야 합니다.

=> 인자로 contextType은 필수인듯?
=> 아 여기에 들어가는게 어제 공부하면서 봤던 "2d"
다른 예시로, "webgl", "bitmaprenderer"
등이 있다.

contextAttributes

대표적인 예시로

alpha: 캔버스가 알파 채널을 포함하는지를 나타내는 불리언입니다. false로 설정할 경우, 브라우저는 이제 배경이 항상 투명하다는 것을 알기때문에 투명한 컨텐츠나 이미지를 그리는 속도를 높일수 있습니다.

반환 값

https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D

<canvas id="my-house" width="300" height="300"></canvas>

=> 내가 k-mooc에서 배웠던 그 2d 캔버스를 불러올 수 있게 된다.

=> 작업할 때 필요한 html 예시

그리고 다음 html을 가져올 js 코드 예시

var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
console.log(ctx); // CanvasRenderingContext2D { ... }