人生で初めてJavascriptをさわった話

趣味 雑談 javascript

はじめに

　この記事には、Javascriptの環境構築とか基本文法とかは一切書いていません。ついでにこの構文が何なのか分らないようなものもあります。
　ただただ筆者が遊ぶために見様見真似でコードを書き、それをふとTwitterとMastodonのあるインスタンスに投下した結果コードゴルフのような何かをされた結果を書いたものです。ご了承ください。

やったこと

　TweetDeckというサービスは、皆さんもちろんご存知ですよね？TwitterでのHomeや通知などをカラムごとに分けてみることのできるTwitter公式(になった)サービスです。もし使ったことが無ければぜひどうぞ。
　で、そのDeckのメッセージの部分を「にゃーん」に変えるのは以前やってた人がいたので、自分は「にゃーん」に変えた後、3秒後に「なにがにゃーんだ※すぞ」のアラートと共に、メッセージもすべてそれに書き換えるというのを作りました。
　また、それをTwitterとMastodonに投下したところ、コードゴルフ的なのをされコード量が半分以下に減りました。

環境

・Windows 10 Home
・Google Chrome(またはChromium)

コードゴルフ後の最終結果

t='innerHTML',m=`なにがにゃーんだ※すぞ`,e=document.querySelectorAll`p,b`;
for(i of e)i[t]='にゃーん';
setTimeout(`for(i of e)i[t]=m;alert(m)`,3e3);

全130文字です(可読性のために付けている改行と最後のセミコロンは除く)
なんとなく可読性が残ってるのほんと凄いと思う
ちなみに最初のコードは

function nyan(){
	var pMain = document.getElementsByTagName('p');
	for (var i = 0; i < pMain.length; i++){
		pMain[i].textContent = "にゃーん";
	}
}
function korosu(){
	var pMain = document.getElementsByTagName('p');
	for (var i = 0; i < pMain.length; i++) {
		pMain[i].textContent = "なにがにゃーんだ※すぞ";
	}
}
nyan();
setTimeout(korosu,3000);

全305文字(可読性のため以下略)もしかしたらツッコミどころ満載かもしれませんが、初心者の自分から見たらごくごく普通のコードと思います。*1

感想

　みんなぷろだった。まる。

(最初のコードの)参考文献

document.getElementsByTagName - Web API インターフェイス | MDN
JavaScriptでループ中にスリープしたい。それも読みやすいコードで
setInterval()やsetTimeout()で関数に引数を与えるには←使ってはないけど、その後の短縮化の過程で使ったため

*1:追記しておくと、最初は対象をpタグのみに絞って、alertも実装してませんでした。なぜここまで縮められたのか