JavaScriptJavaScriptでURIをエンコード、デコードする JavaScriptでURIをエンコード、デコードするencodeURI()URIをエンコードするにはencodeURI()メソッドを使用します。const moji = encodeURI('あいうえお')console.log(moji...2023.02.17JavaScript
JavaScriptJavaScriptで前ゼロ(先行ゼロ)を付ける JavaScriptで前ゼロ(先行ゼロ)を付けるpadStart文字列型のpadStart()メソッドを使用して前ゼロを付けます。4桁の数値にする例です。const str = '5'const pad = str.padStart(4,'...2023.02.16JavaScript
JavaScriptのロジックJavaScriptで日付文字列をフォーマットする(yyyy-mm-dd,mm/dd,yyyy/mm/dd) JavaScriptで日付文字列をフォーマットする(yyyy-mm-dd,mm/dd,yyyy/mm/dd)2022.10.05JavaScriptのロジック
JavaScriptのロジックJavaScriptで不定な配列を一定数の二次元配列に変換する JavaScriptで不定な配列を一定数の二次元配列に変換する2022.03.31JavaScriptのロジック
DB2node.jsでdb2に接続 node.jsでdb2に接続node.jsからIBMのDB2にアクセスしてみます。環境 項目 バージョン node v10.15.3 npm 6.4.1 ibm_db 2.5.2installnode.jsでDB2にアクセス...2019.07.19DB2JavaScriptnode.js
AmplifyAWS Amplifyを使って静的ファイルを扱う AWS AmplifyのStorageを利用して静的ファイルを扱います。Authenticationを利用した認証については、以下を参照してください。1.AWS Amplifyを使ってサインインを実装する-12.AWS Amplifyを使っ...2019.07.17AmplifyAWSJavaScriptvue.js
JavaScriptJavaScriptで現在地を取得したり追跡したりする方法 JavaScriptで現在地を取得したり追跡したりする方法navigator.geolocation.getCurrentPositionメソッドを使えばブラウザから現在地を取得することができます。これで許可すると緯度と経度の情報が取得でき...2019.05.11JavaScript
JavaScriptag-gridのLoadingオーバーレイをカスタマイズ。 ag-gridのLoadingオーバーレイをカスタマイズ。ag-gridのデフォルトはLoadingと文字が表示されますが、今回は簡単に簡単なLoadingを実装する。で紹介したepic-spinnersを利用してみます。Loadingオー...2019.05.11JavaScriptvue.js
JavaScriptag-gridでソートやフィルタを利用する。 ag-gridでは簡単にソートやフィルタを利用することが可能です。簡単に追加可能ですので、ag-gridの列幅をgrid幅に合わせて表示する。のコードに追加してみましょう。ソートを追加する。enableSortingを指定をtrueに設定す...2019.05.11JavaScriptvue.js
JavaScriptag-gridの列表示をCellRendrerを作成して変更する。 ag-gridの列表示をCellRendrerを作成して変更する。ag-gridでは列の表示方法を変更することが可能です。また、vue,react,angularなどを利用して作成することが可能となっています。今回は、vueを使用して作成し...2019.05.11JavaScriptvue.js
JavaScript簡単にLoadingを実装する。 簡単にLoadingを実装する。vue.jsコンポーネントとして提供しているepic-spinnerを使用すると、簡単にかっこいいLoadingを実装できます。epic-spinnerをインストールnpm installするだけです。npm...2019.05.11JavaScriptvue.js
ChromeChromeのJSコンソールが便利です ChromeのJSコンソールが便利です昔、node.jsの開発していた時にChromeの開発者ツールのコンソールを使ってJSを書いていたのでご紹介です。今更ですが、、。Chromeを起動して、F12を押します。開発者ツールが開くので「con...2019.04.19ChromeJavaScript
ChromeChrome,IEでAタグで画像をダウンロードする方法 Chrome,IEでAタグで画像をダウンロードする方法Aタグにdownload属性っていうのがありまして(昨日知りました)これでAタグをクリックすると画像でもなんでもhrefで指定したリソースをダウンロードすることができます。<a href...2018.12.05ChromeIEJavaScript
JavaScriptjavascrip:void(0)の意味を今更ながら調べました(javascript) javascript:void(0)の意味を今更ながら調べましたアンカータグのhrefにjavascript:void(0)と何げなく使っていましたが、ちゃんと意味を調べてみました。アンカータグを無効にするというそれだけです。ただし、カーソ...2018.09.28JavaScript
JavaScriptag-gridで列を消せるけど邪魔。 ag-gridでヘッダー列をドラッグしてgrid外に移動させると、列を消すことが可能です。しかし、消されたくはないので、消えないようにする方法を記載します。列削除を無効にする。列削除を無効にするには、suppressDragLeaveHid...2018.09.02JavaScriptvue.js
JavaScriptag-gridの列幅をgrid幅に合わせて表示する。 前回記事のag-gridで大量データを軽快に表示する。で作成したgridは、各列が左に詰まっており、右に無駄なスペースができます。そこで、今回はgridの幅に合わせて列幅を大きくします。列幅をgridに合わせるGridAPI sizeCol...2018.09.02JavaScriptvue.js
JavaScriptag-gridで大量データを軽快に表示する。 ag-gridで大量データを軽快に表示する。ag-gridは高機能なグリッドライブラリで、大量データでも軽快に動作します。(デモ)Vue.js,React,Angularなどに対応しているため、簡単に利用することができます。今回はこのag-...2018.09.02JavaScriptvue.js
JavaScriptnumeral.jsで数値のformat変換 数値のformatを変換するのに便利な、numeral.jsを紹介します。例えば、3桁区切りに変換などは簡単に実装できます。numeral.jsインストールインストールにはnpm installを利用します。npm install --sa...2018.09.02JavaScript
JavaScriptJavaScript(TypeScript)のObject.keysの使い方 JavaScript(TypeScript)のObject.keysの使い方Object.keysを時々使いますが、メモってなかったことに気づいたのでメモです。Object.keysの引数にはオブジェクトを渡します。そのオブジェクトの列挙可...2018.08.11JavaScriptTypeScript
JavaScriptJSのforEach文の使い方とコールバック関数 JSのforEach文の使い方とコールバック関数JSの配列にはforEach文が存在します。let arr = ;arr.forEach((data,i,arr) => { console.log(i);});forEachの引数はコール...2018.07.22JavaScriptJavaScriptのロジック
JavaScript[vue.js]単一ファイルコンポーネントでコンポーネントを定義 vue.jsではコンポーネントを定義する方法として、単一ファイルコンポーネントがあります。これは、1コンポーネントを1ファイルで管理することができる物となります。このファイルでは、コンポーネントで使用するHTML,javascript,cs...2018.06.03JavaScriptvue.js
JavaScript日時を扱うmoment.js moment.jsは日付を扱うライブラリです。フォーマット・差分・演算などの機能があります。環境 項目 バージョン node 9.11.1 moment.js 2.22.1インストールnpm install --save mom...2018.05.26JavaScriptnode.js
JavaScriptutil.promisifyでコールバックスタイルからPromiseに変換 node.jsが提供するutil.promisifyの使い方を記載します。※async/awaitの使い方で既に利用しています。util.promisify?コールバックを必要とする関数をPromiseに変換するutilです。制約Promi...2018.04.21JavaScriptnode.js
JavaScriptasync/awaitの使い方 いまさらですが、ECMAScript 2017でasync/awaitが追加されました。これまでのコールバック,Promise,async/awaitと書き方の違いを書いていきます。前提node.js v7.6以上node.js v7系で試...2018.04.21JavaScript
JavaScriptvue-cliを使ってvue.jsを使ったプロジェクトの開発環境を整える vue-cliはvue.jsを使用したプロジェクトの開発環境を作成する公式のツールです。環境 項目 バージョン node.js 8.11.1 vue-cli 2.9.3注意vue.js + typescriptについては記載して...2018.04.01JavaScriptvue.js
ECMA Script6JSのvarはほぼ非推奨で良いと思う JSのvarはほぼ非推奨で良いと思うJSの言語仕様がこれだけ変わっていくと、もはやvarなんて使うことはないような気がします。letかconstで代用できます。さらに言うとconstだけでも良いような気がしてきます。再代入するものに関しては...2018.03.29ECMA Script6JavaScript
JavaScriptRedux 入門 Redux とはstate(状態)を管理することに特化した、ライブラリです。React.js を利用していると、コンポーネントに state が含まれ状態の管理が複雑になります。Reduxでstateを一元管理し、コンポーネントとstate...2018.02.05JavaScriptreact.jsredux
JavaScriptReact.js入門 React.js とはFacebook が開発した、UI パーツを作成するライブラリです。仮想 DOM という仕組みを採用し、ページの表示をはやくしています。前提node.js がインストールされていること。環境記事作成時の環境を記載してい...2018.01.30JavaScriptreact.js
JavaScriptJavaScriptの浮動小数点数型の誤差をなくす JavaScriptの浮動小数点数型の誤差をなくすJavaScriptの浮動小数点数型の計算をすると誤差が生じます。以下計算をしてみます。let a = 1051.8;console.log(a / 10);// 105.179999999...2017.12.28JavaScript
JavaScriptJavaScriptでclass構文で定義したクラスのメソッドを列挙する方法 JavaScriptでclass構文で定義したクラスのメソッドを配列で列挙する方法です。 まずクラスを定義します。 class ClassObj { test() { return true; } } Object.get...2017.12.24JavaScript
JavaScriptJavaScriptでJSON配列をグルーピングする方法(reduce) JavaScriptでJSON配列をグルーピングする方法(reduce)JSON配列をグルーピングする方法です。JSON配列は以下とします。const arr = [ { 名前: 'あじ', 分類: '魚', 価格: 2...2017.10.06JavaScript
JavaScriptJSDdocの書き方 JSDdocの書き方です。 /** * 説明 * @param{String} userId ユーザId * @param{boolean} flg フラグ * @return {object} promiseオブジェクト ...2017.10.03JavaScript
JavaScriptキャッシュを読み込まずに外部jsを必ず読み込ませる キャッシュを読み込まずに外部jsを必ず読み込ませるキャッシュを読み込まずに外部jsを必ず読み込ませる方法です。「キャッシュのせいだから再読込して」と毎回言わなくて済むようにする記述方法上記サイトが大変詳しく書いてありました。外部jsを更新し...2017.06.26JavaScript
JavaScriptJavaScriptをオブジェクト指向で使用する JavaScriptをオブジェクト指向で使用する方法です。 クラスという概念があり、newできたりします。 a.jsファイル内に以下を記述します。 function test() {} これで、test.prototypeが自動生成され...2017.06.22JavaScript
JavaScriptJavaScriptのオブジェクト指向 JavaScriptのオブジェクト指向について簡単にまとめました。 Javaで言うクラスはfunctionを使って定義します。nameはプロパティです。 var Sample = function(name){ this.name =...2016.06.26JavaScript
JavaScriptJavaScriptでJSON配列を特定のキーでグルーピングする方法(reduce) JavaScriptでJSON配列を特定のキーでグルーピングする方法(reduce)JSON配列をグルーピングする方法です。JSON配列は以下とします。[{'code':1,money:100,name:'卵'}, {'code':1,mo...2016.02.05JavaScript
JavaScriptJavaScriptでクラス定義 JavaScriptでクラス定義JavaScriptではnew演算子がありますが、クラスというのは存在しません。newするとコンストラクタからインスタンスを生成します。function Car(speed,color){ this.spe...2015.11.14JavaScript
JavaScriptのロジックJavaScriptの関数宣言と関数式 JavaScriptの関数宣言と関数式JavaScriptの関数宣言と関数式についてです。関数宣言はそのままです。// 関数宣言function a() { return 'a';}関数式とは、関数宣言を変数に格納する式を言います。// ...2015.11.14JavaScriptのロジック
JavaScriptのロジックJavaScriptの文字列’false’はtrueになる JavaScriptの文字列'false'はtrueになるJavaScriptで文字列の'false'はtrueと判断されてしまいます。Boolean('false');としてもtrueになるので注意ですね。<script type="te...2015.11.13JavaScriptのロジック
JavaScriptform要素にid指定してコントロール部品を操作する form要素にid指定してコントロール部品を操作するform要素にid指定してコントロール部品を操作します。<form id="testForm"><input type="button" onClick="test(testForm);"...2015.11.03JavaScript
JavaScriptのロジックJavaScriptで文字列を含む判定するindexOf JavaScriptで文字列を含む判定するindexOfJavaScriptで文字列を含む判定するにはindexOfを使います。indexOfの戻り値が-1の場合含まない、それ以外は含みます。正確には文字位置を返します。<script ty...2015.10.24JavaScriptのロジック
JavaScriptJavaScriptのキャッシュを削除する方法 JavaScriptのキャッシュを削除する方法JavaScriptのキャッシュを削除する方法です。ブラウザでF5を押したり、Ctrl + F5を押したりして消えることがあります。これでも消えない場合は、IEの場合ですが、F12を押して開発者...2015.10.24JavaScript