Kuzunoha-NEのブログ

プログラミングなどの勉強をしてます

JavaScript

【Javascript】querySelectorAllでDomをとるかねぇ

こんばんは葛の葉です。 今回はdocument.querySelectorAll()をつかってDomをとります。 下記のようにhtml内でpiyopiyoクラスの要素が複数あります。 <html lang="ja"> <body> <div class="hogehoge"> <div class="piyopiyo"> <p>大腸菌がしゃっくりする</p> </div> <div class="piyopiyo"> <b>ほんど</b> </div> </div> <script src="./test.js"></script> </body> </html>

【JavaScript】.addElementListenerを使った関数の呼び出し

葛の葉です。 Javascirptを現在、勉強しております。 さて、今回はhtmlの要素がclickされたときにjavascriptの関数を呼び出す方法を記載します。 まずボタンを作る 以下のようにbuttonを配置します。 <html lang="ja"> <header> <title>TestTitle</title> </header> <body> <button type="button" id="testButton">こんにちは</button> </body> </html> 押しても反応しないボタン…

【TypeScript】抽象クラスの作成

こんばんは、葛の葉です。 今回は抽象クラスを作ってみます。 前回のインターフェイスをパクります。 kuzunoha-ne.hateblo.jp 動物という抽象クラスを作る classを作る際の雛形を作る。共通部分を作る部分としてはインターフェイスと似ているようだけど、内…

【TypeScript】interfaceを作る

こんばんは、葛の葉です。 今回はTypeScriptでinterfaceオブジェクトを作ってみます。 生物に対し足の数と全長メンバー+成長というメソッド 犬というクラスとカエルというクラスを作る。 それぞれ、footというメンバーとlengthというメンバー,そしてgrowthと…

【TypeScript】mochaとchaiでユニットテストする

こんばんは、葛の葉です。 前回からTypeScriptを使っています。 kuzunoha-ne.hateblo.jp 今回はTypeScriptでUnittestを行いたいと思います。 フォルダ構成 ├── src │ └── fizzbuzz.ts └── test └── fizzbuzz.test.ts FizzBuzzをつくる srcディレクトリ内でfi…

【TypeScript】列挙型をTypeScriptで使う

こんばんは、葛の葉です。 現在、TypeScriptを勉強しています。 Enumesをちょっとだけ勉強しました。 ディレクトリ構成 ├── app │ └── enum.ts └── enum.html enum.html /*./app/enum.tsじゃないよ*/ <script src="./app/enum.js"></script> TypeScriptを書く app/enum.tsをいじる。 enum Hoge { f…