一日一創でアプリを作り始めた2012年。未だに時々使うアプリもいくつかあり。
その一つが比を計算するツール、
ratiocalc。
3つの数で計算するので、電卓だと毎回打ち込むのが面倒。表計算を使うほどではない上に、計算式を入れるのが手間。3つの数を入れて、すぐ変更できるratiocalcが便利です。
「比計算機/ratiocalc」 src on GitHub
為替データを元に通貨計算にも使えます。$1=149円で、$3499は52.1万円！
2012年のJavaScriptコード（別途scriptタグでコード読み込みあり）
'use strict';
window.onload = function() {
var f = function() {
var v = function(id) {
return removeComma($(id).value);
};
var n = v('i2') / v('i1') * v('i3');
if (!isNaN(n))
$('i4').value = fixfloat(n, 1);
else
$('i4').value = "";
};
for (var i = 1; i <= 3; i++)
$('i' + i).onchange = $('i' + i).onkeyup = f;
};
$は当時流行っていたjQueryに習って getElementById の別名。jQuery自体は不使用。
コーディングスタイルがまだ定まってない感がありますね。
2024年のJavaScriptコード（ESモジュールで必要コードはimport、値保存機能追加）
import { addComma, removeComma } from "https://js.sabae.cc/Num.js";
import { IndexedStorage } from "https://code4fukui.github.io/IndexedStorage/IndexedStorage.js";
const storage = await IndexedStorage.create("ratiocalc", 1);
const nums = JSON.parse(await storage.getItem("nums") || `["", "", ""]`);
const saveNums = async () => {
const nums = [i1.value, i2.value, i3.value];
await storage.setItem("nums", JSON.stringify(nums));
};
i1.value = nums[0];
i2.value = nums[1];
i3.value = nums[2];
const f = () => {
const v = (inp) => removeComma(inp.value);
const n = v(i2) / v(i1) * v(i3);
i4.value = isNaN(n) ? "" : addComma(n, 1);
saveNums();
};
i1.onchange = i1.onkeyup = f;
i2.onchange = i2.onkeyup = f;
i3.onchange = i3.onkeyup = f;
f();
古いコードでも動きますが、現代アプリは現代スタイルで作っていきましょう！
（AI支援を入れると古いスタイルが混ざってしまうので修正がちょっと手間）
便利なアプリをサクッとシェアするのにQRコードがついていると便利！
「ｑｒ」で下記コードを単語登録したので、気軽に追加できるようになりました！
<script type="module" src="https://code4fukui.github.io/qr-code/qr-code.js"></script><qr-code></qr-code>
Fri Night
