投稿先: https://noratetsu.blogspot.com/2023/02/NTA-DIY-1-4.html
NTA-DIY:1ヶ月目④~for文を解らないまま使う~
プログラミングでは繰り返し処理(ループ処理)が非常に重要です。どんなツールを作るのでも避けては通れないことではないかと思います。
そもそもの話、同じことの繰り返しを手でやらなくて済む、というのがコンピューターの最大の利点でしょう。
ループさせるには、「どこからどこまで、どういう条件のもと繰り返すのか」ということを指定する必要があります。それがわからないとコンピューターとしては処理しようがないので当たり前のことなのですが、これがなかなか曲者です。
JavaScriptでn回繰り返したいという時はfor文を使います。
for (let i = 1; i < 10; i++) {
console.log(i + "回目のループ");
}
こうすると、コンソールに「1回めのループ」「2回めのループ」…「9回めのループ」と表示されます。同じ処理を9回繰り返したことになります。
このfor文はプログラミングらしいことを実行するには必須なので、早い内に習得する必要がありますが、しかし構造としてはかなり複雑な形をしているように見えます。括弧の中の「let i = 1; i < 10; i++
」ってなんやねん、と。括弧の中身はセミコロンで区切られた3つの文が含まれていますが、こういう形で書くものというのはfor文くらいでは?と思いますし、いきなりイレギュラーな形式と直面することになるのです。
この文はつまりこういうことになります。
for (
let i = 1; // 初期化式(ループ開始前に実行する式)
i < 10; // 条件式(ループの継続条件を示す式)
i++ // 変化式({}内が実行される度に実行する式)
) {
console.log(i + "回目のループ");
}
基本形は「iを初期化(i=0が一般的)」「iの条件を指定」「i++でカウントアップ」となりますが、こうでなければいけないわけではなく、無限ループに気をつければ色々複雑にすることも可能です。可能ですが、最初にfor文と出会った時には急に三種類の式の話をされても圧倒されるばかりで、応用なんてできる状態にはありませんでした。括弧内に文が複数入っている、という意味がまずもってわかりません。
ではどうするか。「for (let i = 0; i < hoge.length; i++) {}
」という形を単語登録(あるいはエディタのスニペット機能に登録)して、「弄るのはhoge.length
の部分だけ」と決めてしまいました。よくわからんがhoge.length
回繰り返すことがわかればそれでいい、ということです。つまり、理解するのをとりあえず諦めました。(そのように片付けて次に進むのは少数派ではないだろうと思います。)
ちなみに、iを使ったループの内側でまたfor文のループをする際にはi以外の文字を使いたいので、「for (let j = 0; j < hoge.length; j++) {}
」「for (let k = 0; k < hoge.length; k++) {}
」も登録していました。コーディングのレベルが上がるにつれてこれらを使うことはなくなっていきましたが、最初は「ループの中でループ」という構造を形にしようとするだけでも精一杯なのでよく活用しました。
繰り返し処理は他にも色々なやり方があります。それぞれに特徴があり使い分ける必要がありますが、最初のうちは学習コストが高いですし理解するより動く何かを作りたかったので、馬鹿の一つ覚えを決め込んでfor文+if分岐のゴリ押しでいきました。ループの仕方はどうあれここからここまでこれを繰り返せればいいのだ、ということです。慣れてきて「なんかfor文連発はダサいな」と感じたら他のやり方を覚える良いタイミングだなと思っています。
なお一年が経ち一応理解はしても、敢えてfor文を複雑にしてループさせたいタイミングというのはありませんでした。ただ他の人が書いたコードを読むにあたってはfor文が捻って使われていることがしばしばあるので、そういうコードを見た時にはやはり「ちゃんとわからないと駄目だ」という気分にはなりました。
理想はその都度理解して適切なものを選択することです。ですがプログラミングが得意なわけでもなく現実はそうスムーズにはいかないので、回り道万歳と思ってやるのが良いと思っています。楽しんでいさえすれば、いずれ「そもそもこれってどういう意味なんだろう」と気になってくるように思います。
そしてこのことは、あらゆる勉強に於いて同じではないかなと思います。
Backlinks
関連度が高いかもしれない記事
- NTA-DIY:1ヶ月目①~どうせならTypeScriptを覚えればいいんじゃね~
- NTA-DIY:1ヶ月目⑤~小さいチャレンジ集~
- NTA-DIY:1ヶ月目②~感動したもの勝ち~
- NTA-DIY:2ヶ月目④~よくわからん三銃士~
- ゼロからのプログラミングについての所感
「ノートテイキングアプリDIY体験記」シリーズの記事
- NTA-DIY:何をどう書いたらいいか考え直す
- NTA-DIY:2ヶ月目④~よくわからん三銃士~
- NTA-DIY:糸口②~環境を整えよう~
- NTA-DIY:なんでこれを書いているのか考え直す
- NTA-DIY:2ヶ月目③~付箋ツールを自作してみる-後編-~
- NTA-DIY:2ヶ月目②~付箋ツールを自作してみる-前編-~
- NTA-DIY:糸口①~結局何をどうしたら動くのさ~
- NTA-DIY:2ヶ月目①~アウトライナーを自作してみる~
- NTA-DIY:前日譚④~VBScriptの感動~
- NTA-DIY:余談①~ScrapboxとGitの貢献~
- NTA-DIY:1ヶ月目⑩~初めてのノートテイキングアプリDIY~
- NTA-DIY:前日譚③~Excelの拡張としてのデジタルDIY~
- NTA-DIY:1ヶ月目⑨~ブックマーク管理ツールを作ってみる~
- NTA-DIY:1ヶ月目⑧~ScrapboxのUserScriptを作ってみる~
- NTA-DIY:1ヶ月目⑦~DOMとAmazonブックマークレット~
- NTA-DIY:1ヶ月目⑥~実作:簡単なブックマークレット~
- NTA-DIY:1ヶ月目⑤~小さいチャレンジ集~
- NTA-DIY:1ヶ月目③~おみくじいろいろ~
- NTA-DIY:前日譚②~JavaScriptを書けると何が嬉しいの?~
- NTA-DIY:1ヶ月目②~感動したもの勝ち~
- NTA-DIY:1ヶ月目①~どうせならTypeScriptを覚えればいいんじゃね~
- NTA-DIY:前日譚①~カスタマイズできる人ずるい!~
- NTA-DIY:まえがき
他の「JavaScript」タグの記事