最近換了繪圖板，換成 Wacom intuos pro 中型款，但發現畫斜線時手感怪怪的，所以就來研究是什麼問題，這裡把解決的過程做個紀錄。
在發現手感怪怪後，我用尺排成 45 度，接著用筆沿著尺畫，看畫面上的現是否會是 45 度，結果發現遽然不是!研究一陣子後發現是感測區比例的問題，可以看下圖
 |
| Wacom intuos pro 的感測區規格 |
我的螢幕是 16:9 ，長寬比約為 1.77 ，但 Wacom intuos pro 中型款的感測區的長寬比約是 1.513 ，這就是造成明明畫了 45 度線，但畫面卻不會呈現 45 度的原因。要如何解決呢?可以在 Wacom 的軟體做調整，如下圖
 |
| 調整"比例一定" |
在 Wacom 軟體上選擇"鏡射"頁面後，再開啟"比例一定"，如此設定後就可以得到畫幾度線畫面就呈現幾度線。
最近在寫的時候需要用到 Enumerate ，需要瀏覽 Enumerate 的數值，遽然突然間忘記要怎麼瀏覽數值(values)，既然會忘記，就在此做個紀錄。
直接看範例
var Shape = {
box : 0,
circle : 1,
triangle : 2
};
for(let ele in Shape)
console.log( `${ ele }:${ Shape[ele] }` );
//
for(const [key, value] of Object.entries(Shape) )
console.log( `${ key }:${ value}`);
範例有兩個寫法，第一個寫法單純利用 for in 來取出每個 key ，在用 key 取值，雖然作法不優雅，但需要的 JavaScript 版本比較低，第二個寫法需要用到 for of ，整體看起來比較優雅，但要注意柳覽器是否有支援到 for of 語法。
[ stackoverflow.com ] How do I enumerate the properties of a JavaScript object?
最近發現 eval() 遽然有分直接喚起與間接喚起，雖然平常我不太用這個函式，但有時不得已還是要使用，所以就來做個學習，在此做個紀錄。
直接看範例，如下
var x = 'xxx';
function test(){
var x = 'yyy';
console.log( eval( 'x' ) );//'yyy'
var f = eval;
console.log( f( 'x' ) );//'xxx'
console.log( ( 0 , eval )( 'x' ) );//'xxx'
}
test();
範例第一次和喚起 eval() 會顯示"yyy"，這點跟認知的一樣，也被稱為"直接喚起"，那間接喚起呢?
可以看到事先用一個變數賦值 eval 後，再透過該變數來喚起 eval() ，這樣的結果遽然不一樣!可以看到結果遽然顯示"xxx"，也就是顯示的是 global 變數，而非 local 變數，間接喚起還有一個特殊的寫法，也就是"( 0 , eval )"，這個語法可以在 [ developer.mozilla.org ] eval() 裡找到，和上述利用變數賦值 eval 的結果會一樣，這個語法可以不用再宣告變數，相當方便。請注意，範例的宣告都是用 var 來宣告，如果改成 let 的話就永遠只會顯示 local 變數，也就是如果程式碼已經習慣用 let 來宣告的話，那直接喚起與間接喚起沒差。
在上一次的 完整的 JavaScript 使用 Class 的範例 沒提到繼承相關的語法，由於本身設計的習慣不太愛用繼承的特性，但最近抽空研究一下繼承，法現有的特性跟我想的不一樣，在此做個紀錄。
先看範例，如下
class BaseClass{
call(){
console.log('I am BaseClass' );
}
}
class ExClass extends BaseClass{
call(){
console.log('I am ExClass' );
}
}
class ExClass1 extends ExClass{
call(){
//Follow code will failed!
//super.super.call();
//
super.call();
console.log('I am ExClass1' );
}
}
let a = new ExClass1();
a.call();
範例的繼承關係很簡單，BaseClass -> ExClass -> ExClass1 ，單純的喚起 call() ，因為繼承的關係會發生 override ，要喚起父類別可以透過 super ，但如果企圖從 ExClass1 喚起 BaseClass 的話這是不允許的!本以為可以透過 super.super 的方式來達成，但實際實驗卻是會有錯誤，這意思是 JavaScript 無法跨過兩次以上的繼承，雖然實務上應該不太會碰到，但還是要注意一下。
[ developer.mozilla.org ] super
在之前的 Javascript 開始在 Class 裡支援 private method 講述了 private method 的使用，但由於我個人不常用 class 語法，所以就想要留一個範例寫法，在此做個紀錄。
直接看範例
class MyClass{
static #staticVariable = 'I am static variable.';
constructor(){
this._name = 'I am MyClass';
}
//property
get name(){
return this._name;
}
set name(name){
this._name = name;
}
//public method
publicMethod(){
console.log('I am public method.');
}
//private method
#privateMethod(){
console.log('I am private method.');
}
//static method
static staticMethod(){
console.log('I am static method.');
}
}
先看到 static variable 的寫法，這裡有用到 private 的語法，意外的遽然可以用，在 class 裡可以給預設值，再透過 static method 來提取或操作，這是常見的用法，如果不需要唯讀屬性的話可以移除"#"。 getter 與 setter 的語法相當簡單好懂，但不知為什麼並不能搭配 static 來使用，所以static variable 還是要透過 static method 來提取。public method 與 private method 在 Javascript 開始在 Class 裡支援 private method 已經提過了就不再講述。static method 語法簡單，只需加"static "即可。
[ developer.mozilla.org ] getter
[ developer.mozilla.org ] setter
最近查找資料時發現 Javascript 開始在 Class 裡支援 private method ，實驗了一下發現 Chrome 與 Firefox 更新到最新的版本都可以支援，之前對 Class 的語法很介意它不支援 private method ，所以就不怎麼愛用，現在這個問題沒了，就順便鎮這個機會做個學習，在此做個紀錄。
先看以下範例
class MyClass {
publicMethod() {
console.log("I am public method.");
}
#privateMethod() {
console.log("I am private method.");
}
callAllMethod() {
this.publicMethod()
this.#privateMethod();
}
}
let people = new MyClass();
people.callAllMethod();
private method 的語法異常的簡單，只需在 method 的前面加上"#"來區隔，但要注意的是喚起時也需要"#"來喚起，不能直接打名稱，這樣以後就可以捨棄用閉包的做法來完成 private method 。
[ dev.to ] New Features in ECMAScript 2021 (with code examples)
常常在看 Krita 的教學影片時發現別人有很多一看就知道不是官方的預設筆刷，所以就想學一下如何安裝新的筆刷，在紫把學習的過程做個紀錄。
這次示範的筆刷可以在 [ www.davidrevoy.com ] Deevad 裡下載，如下圖
 |
| 下載筆刷 |
 |
| 選取"管理資源" |
 |
| 選取"匯入資源包" |
 |
| 安裝成功的畫面 |
 |
| 安裝完後的筆刷視窗 |