1. // main.js brfore: root.setBgColor(root.bgColor); after: 2. // canvas.js 2.1 プロパティにアクセスするファンクションを追加 brfore:…

clearをファンクションにしてrootオブジェクトに移動 1.1 // main.js brfore: clear : function (){ root.ctx.clearRect(0, 0, root.cnvWid…

ES6の記法 ・function ()　－＞　() => 1.1 // ファンクションをグルーピング brfore: // ccanvasの初期化 this.init = function () { this.canva…

methodオブジェクトの作成 ・ファンクションをグルーピング 1.1 // ファンクションをグルーピング brfore: // 色の変更 function _data_color() { let cnvColor = …

無名関数から通常の関数へ 1.1 // 色の変更 無名関数から通常の関数へ brfore: // 色の変更 for (let j = 0; j < c_elms.length; j++) { if(c_elms[j].t...

rootからthisに変更 1. canvas.js 1.1 マウス押下開始とマウス押下終了をrootからthisに変更 function(){…}.bind(this);　でfunction内のthisを式…

moduleの導入 1. index.html 1.1 moduleの導入の為、htlmからのjavaScriptの呼び出し名を変える before: <script type=”module” src=”js/c…

1. canvas.js 1.1 グローバルな変数宣言、ファンクションの宣言ををrootオブジェクトの中に移動 before: // 変数宣言 var cnvColor = “255, 0, 0, 1”; // 線の色 …

1. canvas.js 1.1 canvasの初期化 before: var canvas = document.getElementById(“canvas”); after: root = { // context…

1. canvas.js 1.1 globalThis.clickFlgの除去 mousedown とmouseupのイベントをgrabしたことで、globalThis.clickFlg の必要性を無くす before:…