JSF**k講座 2限目【最初の文字たち】

# 初めに
[1限目](https://qiita.com/shimgo2008/private/b7421974a1aab8131b43)の復習をしっかりとしておきましょう
1限ではJSの型の変換などの基礎的な話をしています
# 2限目の内容
今回はJSFで文字を書く仕組みと、
`false`, `true`,  `undefined`, `NaN`, `Infinity`,から取れる文字と`0~9`の数字たちを得る方法を教えていきます

>説明の都合上被る文字がありますが
[チートシート(作成中)](https://qiita.com/shimgo2008/items/5aeaa977d2dbf11ae4ec)に最適化した文字の出力方法を記入していくのでそちらをご参考ください

>1限でも言いましたがfuckと何度も言うのもアレなのでJSFでいきます
【定期】JavaServer Facesではありません

# まずは`helloworld`と言いたいところですが....

肩慣らしにhelloworldを書こうと思っている方もいるかと思いますが
f**k(伏せ字なし)を書く方が数十倍楽です

下にhelloworldのコードを置いておくので開く人は心してみてください

>私の技術力が未熟なため、まだまだ短くできるとは思いますが
大体イメージとしてこれだけかかるということを覚えてください

<details><summary><strong>helloworldをJSFで書くとこうなります(グロ注意)</strong></summary>

```helloworld.js
(((+[])[((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+(([][[]]+[])[+!![]])+((![]+[])[+!![]+!![]+!![]])+((!![]+[])[+[]])+((!![]+[])[+!![]])+(([][[]]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((!![]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[+!![]])])(+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]))[((!![]+[])[+[]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((([]+[])[((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+(([][[]]+[])[+!![]])+((![]+[])[+!![]+!![]+!![]])+((!![]+[])[+[]])+((!![]+[])[+!![]])+(([][[]]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((!![]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[+!![]])]+[])[+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[+[]])+((!![]+[])[[+!![]]])+((([][[]]+[])+[])[+!![]+!![]+!![]+!![]+!![]])+(([][[]]+[])[+!![]])+((([]+[])[((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+(([][[]]+[])[+!![]])+((![]+[])[+!![]+!![]+!![]])+((!![]+[])[+[]])+((!![]+[])[+!![]])+(([][[]]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((!![]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[+!![]])]+[])[+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]])](((+!![]+!![]+!![])+[])+(+!![]+!![]+!![]+!![]+!![]+!![]))+((!![]+[])[+!![]+!![]+!![]])+((![]+[])[+!![]+!![]])+((![]+[])[+!![]+!![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+(((+[])[((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+(([][[]]+[])[+!![]])+((![]+[])[+!![]+!![]+!![]])+((!![]+[])[+[]])+((!![]+[])[+!![]])+(([][[]]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((!![]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[+!![]])])((!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![])+[]))[((!![]+[])[+[]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((([]+[])[((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+(([][[]]+[])[+!![]])+((![]+[])[+!![]+!![]+!![]])+((!![]+[])[+[]])+((!![]+[])[+!![]])+(([][[]]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((!![]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[+!![]])]+[])[+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[+[]])+((!![]+[])[[+!![]]])+((([][[]]+[])+[])[+!![]+!![]+!![]+!![]+!![]])+(([][[]]+[])[+!![]])+((([]+[])[((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+(([][[]]+[])[+!![]])+((![]+[])[+!![]+!![]+!![]])+((!![]+[])[+[]])+((!![]+[])[+!![]])+(([][[]]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((!![]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[+!![]])]+[])[+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]])](((+!![]+!![]+!![])+[])+(+!![]+!![]+!![]+!![]+!![]+!![]))+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[[+!![]]])+((![]+[])[+!![]+!![]])+(([][[]]+[])[+!![]+!![]])
```

<details><summary><strong>コード開くとこんな感じです</strong></summary>

`(((+[])[((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+(([][[]]+[])[+!![]])+((![]+[])[+!![]+!![]+!![]])+((!![]+[])[+[]])+((!![]+[])[+!![]])+(([][[]]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((!![]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[+!![]])])(+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]))[((!![]+[])[+[]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((([]+[])[((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+(([][[]]+[])[+!![]])+((![]+[])[+!![]+!![]+!![]])+((!![]+[])[+[]])+((!![]+[])[+!![]])+(([][[]]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((!![]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[+!![]])]+[])[+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[+[]])+((!![]+[])[[+!![]]])+((([][[]]+[])+[])[+!![]+!![]+!![]+!![]+!![]])+(([][[]]+[])[+!![]])+((([]+[])[((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+(([][[]]+[])[+!![]])+((![]+[])[+!![]+!![]+!![]])+((!![]+[])[+[]])+((!![]+[])[+!![]])+(([][[]]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((!![]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[+!![]])]+[])[+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]])](((+!![]+!![]+!![])+[])+(+!![]+!![]+!![]+!![]+!![]+!![]))+((!![]+[])[+!![]+!![]+!![]])+((![]+[])[+!![]+!![]])+((![]+[])[+!![]+!![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+(((+[])[((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+(([][[]]+[])[+!![]])+((![]+[])[+!![]+!![]+!![]])+((!![]+[])[+[]])+((!![]+[])[+!![]])+(([][[]]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((!![]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[+!![]])])((!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![])+[]))[((!![]+[])[+[]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((([]+[])[((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+(([][[]]+[])[+!![]])+((![]+[])[+!![]+!![]+!![]])+((!![]+[])[+[]])+((!![]+[])[+!![]])+(([][[]]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((!![]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[+!![]])]+[])[+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[+[]])+((!![]+[])[[+!![]]])+((([][[]]+[])+[])[+!![]+!![]+!![]+!![]+!![]])+(([][[]]+[])[+!![]])+((([]+[])[((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+(([][[]]+[])[+!![]])+((![]+[])[+!![]+!![]+!![]])+((!![]+[])[+[]])+((!![]+[])[+!![]])+(([][[]]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]])+((!![]+[])[+![]])+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[+!![]])]+[])[+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]+!![]])](((+!![]+!![]+!![])+[])+(+!![]+!![]+!![]+!![]+!![]+!![]))+((([][((![]+[])[+!![]])+((!![]+[])[+[]])])+[])[+!![]+!![]+!![]+!![]+!![]+!![]])+((!![]+[])[[+!![]]])+((![]+[])[+!![]+!![]])+(([][[]]+[])[+!![]+!![]])`
</details>
</details>

記事通りにやれば4限には書けるようになります
頑張りましょう！

# ""と[]の違い

前回は`!""`を用いて`true`を返していましたが、今回は`"`は使えません
では`"`の代わりに何を使うかというと`[]`を使います
```js
!""
//true
![]
//false
```
はい今回は`[]`が空の**配列**, !は否定演算子です

前回やった`""`は何もないもの(`falsyな値`)を否定して、`true`を返していますが、
JSFで使える`[]`は空の**配列**、つまり**配列**という**箱**が**有る**わけです

そのため、[]は`truthy`な値となり、`!`で否定してあげると`false`が帰ってきます

:::note info
[]は配列という存在があるから **true**
""は何もないから**false**
:::

# 数字の手に入れ方

前回やった通り、`false`に単項演算子をつけると`0`が、`true`に単行演算子をつけると`1`が帰ってきます
数字の手に入れ方はこの仕組みを使うだけです
> trueとfalseの書き方は下記参照

```js
+false
//0
+true
//1
+true+true
//2
+true+true+true+true
//4
+true+true+true+true+true+true+true+true
//8
+true+true+true+true+true+true+true+true+true+true
//10
```
このように一桁の数字の場合は+trueを繰り返すことによって手に入れることができます

では二桁の場合はどうでしょうか？

二桁の場合は文字の連結を使用することで冗長になることを回避できます
**~~もともと冗長ですが...~~**

```js
+((+true+[])+(+false+[]))
//10
```
なんとこれだけで`10`を表現できます！
分解して見ていきましょう
```js
(+true+[])
//'1'
(+false+[])
//'0'
(+true+[])+(+false+[])
//'10'
+((+true+[])+(+false+[]))
//10
```
実はやっていることは前回説明していることだけなんですね

`true`に単項演算子をつけて`1`にした上に,空のStringと結合してStringの`'1'`に
`false`も同じようにしてStringの`'0'`に
そしてその二つを結合させてStringの`'10'`に
最後に単項演算子の`+`をStringの`'10'`につけることによって`10`になります

:::note info
String + Number = String
で出力されるため、1桁だけStrを入れればその他は全てNumでよくなります
これによりコードの短縮化をはかれます
```js
+((+true+[])+(+false+[])+(+false+[])+(+false+[])+(+false+[]))
//10000


+((+true+[])+(+false)+(+false)+(+false)+(+false))
//10000
```
:::



# 文字の手に入れ方

```js
chr = !false
//chr = true

chr = chr+""
//chr = true+"" = "true"

console.log(chr[0])
// "t"
//console.log("true"[0])

```

基本的には前回学んだ書き方を用いて、返り値を手に入れ、それをStringに直し、そこから添え字を用いて文字を取得していきます

次から具体例で説明していきます

# false
まずはJSFで一番最初に使う`false`からです
`false`の書き方は
```js
![]
```
となります

`truthy`な値である`[]`(配列)を否定することによって、`false`を手に入れることができます

このままだと、falseがboolean型で帰ってきているため、
```js
![]+[]
//'false'
```
でStringに
```js
(![]+[])[0]
//'f'
```
添え字をつけることにより、その番号が振られている文字を取得できます

`false`から手にれられる文字たちは以下の通りです
```js
(![]+[])[+[]]
//'f'
(![]+[])[+!![]]
//'a'
(![]+[])[+!![]+!![]]
//'l'
(![]+[])[+!![]+!![]+!![]]
//'s'
(![]+[])[+!![]+!![]+!![]+!![]]
//'e'
```

# true
次はJSFで`false`の次に使うであろう`true`です
`true`の書き方は
```js
!![]
```
となります

`truthy`な値である`[]`(配列)を否定することによって、`false`を手に入れるところまでは一緒ですが
`false`を二重否定することによって`true`を得られます
~~気持ち悪いですね~~

`false`と同じように
```js
(!![]+[])[]
```
という書き方で文字を取得していきます

`true`から手にれられる文字たちは以下の通りです
```js
(!![]+[])[+[]]
//'t'
(!![]+[])[+!![]]
//'r'
(!![]+[])[+!![]+!![]]
//'u'
(!![]+[])[+!![]+!![]+!![]]
//'e'
```
# undefined
次は!を使わずに出せる`undefined`です
`unedifined`の書き方は
```js
[][[]]
```
となります

`undefined`は今までとは少し違います
```js
[]
//[]

[][[]]
//undeifined
```
というように空の配列を作り、それの中に無いもの(配列の中にあるからの配列)を取得しようとするが、失敗するため
`undefined`が帰ってくるのです

:::note info
`[]`というなんも無い配列を作り、その中に存在しない空の配列にアクセスしてます
もちろん無いものはないため存在しねーよ(`undefined`)と返ってきます
:::


そこから先は今までと同じように
```js
(([]+[[]])+[])[]
```
という書き方で文字を取得していきます

`undefined`から手にれられる文字たちは以下の通りです
```js
([]+[[]])[+[]]
//'u'

([]+[[]])[+!![]]
//'n'

([]+[[]])[+!![]+!![]]
//'d'

([]+[[]])[+!![]+!![]+!![]]
//'e'

([]+[[]])[+!![]+!![]+!![]+!![]]
//'f'

([]+[[]])[+!![]+!![]+!![]+!![]+!![]]
//'i'
```

# NaN

次は`NaN`(Not a Number)です
`NaN`の書き方は
```js
+[![]]
```
となります

`NaN`は前回話した通り、単行演算子で文字列をNumberに直すとき、
変換元の文字列がNumberに変換できない時に返ってくる返り値です
```js
[![]]
//[false]
+[![]]
//NaN
```
このようにリストの中に入っている`false`を`+`を用いて数字に変換しようとしていますが
`[false]`は数値に変換できないため、`NaN`が返ってきます

あとは今までと同じように
```js
(+[![]]+[])[]
```
という書き方で文字を取得していきます

`NaN`から手にれられる文字たちは以下の通りです
```js
(+[![]]+[])[+[]]
//'N'

(+[![]]+[])[+!![]]
//'a'
```

# Infinity
そしてさいごは一気に難易度の上がる`Infiniy`です

これが理解できるかどうかで、今までの理解度の確認にもなります

`Infinity`の書き方は
```js
+(+!![]+(!![]+[])[+!![]+!![]+!![]]+(+!![])+(+![])+(+![])+(+![])+(+![]))
//Infinity
```
です
見やすいように改行すると
```js
+(+!![]+(!![]+[])[+!![]+!![]+!![]]+
(+!![])+(+![])+(+![])+(+![])+(+![]))
//Infinity
```
となります
一応自力で解きたい私みたいな方もいると思うので
解説はdetailsに入れておきます

<details><summary><strong>解説</strong></summary>

解読できたでしょうか？
```js
+(+!![]+(!![]+[])[+!![]+!![]+!![]]+
(+!![])+(+![])+(+![])+(+![])+(+![]))
//Infinity
```
というコードは
翻訳すると以下の通りです
```js
+(1+'e'+1+0+0+0)
//Infinity
```
JSでは`1e309`以上の数値をInfinityとして扱います

もちろん`1e309`とJSFで書いてもいいのですが
JSFの場合`1e309`よりも`1e1000`の方が文字数が短くなるため、`1e1000`と書きます

</details>

# 終わり
以上でJSF講座2限目を終わります

今回学習した部分はJSFの書き方を覚えるという意味もあります
この基本を抑えているとすらすら書けるようになります

3限目では関数の実行を方法を学んでいきます！
>関数の実行に関しては非常に複雑で筆者も理解しきれていないため
明日は今日までのJSFのチートシートを公開します

## 時間割
1限目
[JSF**k講座1限目【基礎講座】](https://qiita.com/shimgo2008/private/b7421974a1aab8131b43)
2限目
[JSF**k講座2限目【最初の文字たち】(ここ)](https://qiita.com/shimgo2008/private/285ba81ee5f925cc0258)
3限目
[JSF**k講座3限目【関数の実行】](https://qiita.com/shimgo2008/items/8fe67d6a40a516b7a6da)
4限目
[JSF**k講座4限目【全ての英字（小文字）】](https://qiita.com/shimgo2008/items/1d9be501040fc6b98c6b)

チートシート
[JSFチートシート](https://qiita.com/shimgo2008/items/5aeaa977d2dbf11ae4ec)