yasuaki

JavaScript

JavaScriptで金額を扱う時に使用する2つの関数(3桁区切り・切り捨て)

JavaScriptで金額を扱う際に3桁区切りにする方法と、金額の単位を千円や百万円にする方法について書いています。JavaScriptで金額をカンマの3桁区切りにするJavaScriptで金額を3桁のカンマ区切りにするにはtoLocale...
JavaScript

[JavaScript入門]confirmの使い方の解説とトピックス3つ!

今回はJavaScriptのcomfirmメソッドの使い方について書いています。JavaScriptでconfirmメソッドを使用すると、ブラウザにメッセージと一緒に下記のような確認ダイアログを表示させることができます。このダイアログで、ボ...
JavaScript

Chart.jsを使用して、折れ線グラフを書く方法!【気温のグラフを作る】

今回はChart.jsを使用して、折れ線グラフを書いてみます。Chart.jsは現時点での最新版のバージョン3.7.1を使用しています。少しずつ実装を変えていって、最終的に下記のような折れ線グラフを作成します。Chart.jsを使用して、折...
JavaScript

[JavaScript入門]三項(条件)演算子の使い方!【9つの値で挙動検証】

今回はJavaScriptで三項(条件)演算子を使い方について書いています。最初に三項演算子の使い方について書いています。その後にいろいろな値を渡して、trueとfalseの判定がどうなるのか挙動検証してみたコードを載せています。JavaS...
Vue.js

Vue.jsでTypeScriptを使う方法!【propsでの型定義6つ】

今回はVue.jsで公式サポートされたTypeScriptを使ってみます。はじめにVue CLIでTypeScriptのサポートしているプロジェクトを作成します。その後にプロジェクトに対して、コンポーネントを追加して、TypeScriptを...
JavaScript

Chart.jsを使用して、円グラフを書く方法!【サンプルと解説付き】

今回はChart.jsを使用して、円グラフを書いてみます。円グラフの種類として、ドーナツ(doughnut)とパイ(pie)チャートが描けるようです。Chart.jsは現時点での最新版のバージョン3.7.1を使用しています。Chart.js...
Vue.js

Vue Routerでページ内リンクする方法!【画面遷移時にページトップへ】

Vue Routerを使用しているプロジェクトで、ページ内リンクをつける方法について書いています。ページ内リンクが設定されていない場合("#hoge"でIDが指定されていない)は、ページのトップへスクロールする設定になります。サンプルコード...
Vue.js

Vue.jsのイベントの使い方とイベントサンプル7選

Vue.jsでクリックした時に処理をするなど、イベントを発行して処理する方法の解説を書いています。その後にサンプルコードとして、イベントを7つ書いてみました。サンプルコードはVue.jsのバージョン3で検証しています。(Compositio...
JavaScript

Chart.jsを使用して、棒グラフを書く方法【6つのサンプルと解説付き】

今回はChart.jsを使用して、棒グラフを書いてみます。Chart.jsは現時点での最新版のバージョン3.7.1を使用しています。Chart.jsを使用して、棒グラフを書くChart.jsはグラフをJavaScriptで描画するためのライ...
Vue.js

Vue.jsにVue Routerを導入して、タグで画面遷移する方法!

今回はVue.jsのプロジェクトにVue Routerを導入して、画面遷移する方法について解説しています。まず、Vueのバージョン3に対して、Vue Routerを導入する方法を記載しています。その後にVue Routerを使用して、ルーテ...
Vue.js

Vue.jsのVue Routerを使用してプログラムで画面遷移する方法!

Vue.jsのVue Routerを使用しているプロジェクトで、プログラムを使用して画面遷移する方法を書いています。最初に通常遷移する方法を記載していて、次にURLパラメータとクエリパラメータを渡して、画面遷移する方法を書いています。Vue...
Nuxt.js

Nuxt.jsのバージョンを確認する方法!

Nuxt.jsのバージョンを確認する方法について書いています。Nuxt.jsのバージョンを確認するコマンドを使用して、バージョンを確認する方法を書いています。プロジェクトディレクトリにインストールしたNuxt.jsのバージョンnpm lis...