押したキー取得

//canvasの設定（せってい）
let canvas = document.getElementById('canvas');
canvas.width = 640;	//canvasの横幅（よこはば）
canvas.height = 640;	//canvasの縦幅（たてはば）

//コンテキストを取得（しゅとく）
let ctx = canvas.getContext('2d');

//画像（がぞう）のオブジェクトを作成
/*
let img = new Image();
img.src = 'img/figure.png';
*/

/**********************************/
//オブジェクト化して管理しやすくする
let kyara = new Object();
kyara.img = new Image();
kyara.img.src = 'img/figure.png';
kyara.x = 0;
kyara.y = 0;
/**********************************/

//メインループ
function main() {
	//画像を表示
	//オブジェクト化することで動かせるようになる。
	//ctx.drawImage( img, 0, 0 );
	/**********************************/
	ctx.drawImage( kyara.img, kyara.x, kyara.y );

	addEventListener("keydown", keydownfunc, false);
	addEventListener("keyup", keyupfunc, false);
 	/**********************************/

	requestAnimationFrame( main );
}
//ページと依存（いぞん）している全てのデータが読み込まれたら、メインループ開始
addEventListener('load', main(), false);

/**********************************/
//キーボードが押されたときに呼び出される関数（かんすう）
function keydownfunc( event ) {
	let key_code = event.keyCode;
	if( key_code === 37 ) console.log("左　押した");
	if( key_code === 38 ) console.log("上　押した");
	if( key_code === 39 ) console.log("右　押した");
	if( key_code === 40 ) console.log("下　押した");
	event.preventDefault();
}


//キーボードが放（はな）されたときに呼び出される関数
function keyupfunc( event ) {
	let key_code = event.keyCode;
	if( key_code === 37 ) console.log("左　離した");
	if( key_code === 38 ) console.log("上　離した");
	if( key_code === 39 ) console.log("右　離した");
	if( key_code === 40 ) console.log("下　離した");
}
/**********************************/