#はじめに
@Nemesis さんの Javaで湯婆婆を実装してみる がバズってるとのことで、Vue.jsで実装してみました。
#コード
indext.html
<!DOCTYPE html>
<html>
<head>
<title>湯婆婆</title>
<script src="https://unpkg.com/vue"></script>
</head>
<body>
<div id="app">
<p> 契約書だよ。そこに名前を書きな。</p>
<input v-model="name"><br />
<p>
フン。{{ name }}というのかい。贅沢な名だねぇ。<br />
今からお前の名前は{{ newName }}だ。いいかい、{{ newName }}だよ。分かったら返事をするんだ、{{ newName }}!!
</p>
</div>
<script>
var app = new Vue({
el: '#app',
data: {
name: '',
},
computed: {
newName: function () {
const random = Math.floor(Math.random() * this.name.length)
return this.name.substr(random, 1)
}
}
})
</script>
</body>
</html>
例外処理とかコンポーネント化したい衝動を抑えながら、元ネタをリスペクトしました。
#クラッシュ湯婆婆の再現
文字入力なし状態ですと、
フン。というのかい。贅沢な名だねぇ。
今からお前の名前はだ。いいかい、だよ。分かったら返事をするんだ、!!
と、名無しでも何か言ってますね・・・
ある意味、おかしくなってしまった湯婆婆ということで!
#感想
**「HelloWorldの代わりに、湯婆婆を!」って声も耳にしました。
たしかにHelloWorldは「出力」だけなのですが、湯婆婆だと「入力、出力、文字列(メモリの扱い?)、例外処理」**が含まれていて、各言語の特徴を実感するにはほんと良いネタだなぁと思いました。
追記:
IchigoJam BASIC版も書いてみました。