作業室2022-12-26
#2022/12/26
今日の目標
Mijikko.icon
1. /Mijinko/入力フォームを表示するUserScriptを完成させてしまう
✅CSSテキストを生成する関数を作る
JavaScriptのPromiseのテストをする
onclickが実行されるまでをasync functionで実装してawaitできるようにしたい
onclickに設定したコールバック関数が実行されたらPromiseを解決するようにしたいという意味
2. ファイル指定でCSSをテストするUserScriptを作成する
0:00
1:00
2:00
3:00
4:00
覚えたての型ガード関数で遊んでたらコードがやたらと長くなってしまったぞ…Mijikko.icon
https://gyazo.com/28406667172e93939e8bef291473c367
普通にわけわからんコードになった
不要なコードや間違っているコードは存在すると思うので、これからリファクタリングする
5:00
6:00
7:00
8:00
これをMijikko.icon
https://gyazo.com/f40d41c6aaa0772377bec45f1d772692
こうMijikko.icon
https://gyazo.com/8d6782467701bdf3a745be36a7628c4e
/Mijinko/SCSSっぽい連想配列からCSSを生成するTypeScript関数
簡単に組めるかなーって思ってやってたら思った以上に時間がかかりすぎてしまった
いつもこうなるtakker.icon*2
突貫工事だけどそこまで高度なことするわけじゃないしこれでいいや
眠くて効率が非常に落ちてきたので悔しいけれど寝る
Template Literal TypesでCSS propertyやセレクタを制限したらおもしろそうtakker.icon
夜通しcodingして朝寝落ちするパターン、大学行かなくなった頃のtakker.iconと似通っていてどうしても不安を覚えてしまうtakker.icon
(余計なお節介だと思うのでスルー推奨じゃあなんで書いたし)
最近コーディングしてなかったので焦りが…()Mijikko.icon
programが主専攻ならともかく、そうでないならそんなに焦らなくてもいいと思うtakker.icon
うーうまい言葉が思いつかない……どういう助言をしたらいいのかがわからない
やばい!!早く動画あげなきゃ居場所が…!ネットでの居場所がなくなる!!.iconMijikko.icon
9:00
10:00
11:00
12:00
13:00
14:00
15:00
16:00
17:00
18:00
18:00過ぎてしまったけど、メールまでは書いてしまいたいtakker.icon
送った
泣きながら原稿してる基素.icon
加油cFQ2f7LRuLYP.icon
열심히 하시기Mijikko.icon
/icons/応援.icontakker.icon
起きたMijikko.icon
作業を再開する
✅/Mijinko/SCSSっぽい連想配列からCSSを生成するTypeScript関数の説明文の書き直しMijikko.icon
19:00
20:00
21:00までには寝るtakker.icon
21:00
22:00
23:00
とりあえず試してみたMijikko.icon
code:awaitableOnClickTest.ts
/// <reference no-default-lib="true" />
/// <reference lib="es2022" />
/// <reference lib="dom" />
const test = testButton();
console.log("test: 待機中: " + test);
const testReturnValue = await test;
console.log("test: クリックされました: " + testReturnValue);
async function testButton() {
let resolve: (value: unknown) => void | undefined;
const promise = new Promise((r) => {
resolve = r;
});
const button = document.createElement("button");
button.textContent = "テスト";
button.onclick = () => {
if (typeof resolveFunc !== "function") return;
resolve("解決");
}
document.body.append(button);
return promise;
}
もうちょっとリファクタリングできればやっておきたい
特に何も思いつかなかったのでやめた
処理全体をreturn new Promise(() => { ... })で囲えば一番最初にlet resolveを置かなくてよくなるか
ネストが深くなるのが難点だけど
-> 作業室2022-12-27
雑談