JavaScript
- React の基本的な使い方React について、開発を行うために必要な基本事項について記載します。 JSX 構文で React element を定義 ReactDOM.render(element, container) の第一引数に指定する React element は JSX で記述できます。
- React Hook のサンプルコード
React 16.8 で導入された Hook のサンプルコードを記載します。 コンポーネントの機能を共有するための手法であった Render Props や [Higher-Order Components](https://reactjs.org/docs/higher-order-components.html - React 開発環境の構築手順について
React は、当時のバージョン 1 について Angular と比較されることの多い、UI 構築のための JavaScript ライブラリです。Angular と異なり、ES6 や JSX の構文が利用された JavaScript コードをブラウザが解釈可能な JavaScript にコンパイルする Babel や、ファイル分割された複数のファイルからなる JavaScript コードを Nod... - React から jQuery の資産を利用する
バージョン 1 の AngularJS で jQuery を内部的に利用できるのと同様に、React でも jQuery を内部的に利用した component を作成できます。本ページでは実際に jQuery プラグインをラップした簡単な React component のサンプルコードを示します。 関連ページ Refs and the DOM [Uncontrolled Compo - Ajax 周辺技術のまとめAjax (Asynchronous JavaScript + XML) は JavaScript でサーバと非同期通信を行うための仕組みです。非同期通信には JavaScript の仕様として標準で提供されている XMLHttpRequest オブジェクトを利用することが多いです。XMLHttpRequest は Ajax のためのオブジェクトではなく HTTP 通信を行うための汎用オブジェクト...
- オブジェクトと配列 (JavaScript)オブジェクト JavaScriptにおけるオブジェクトは、クラスのインスタンスとしての性格と、Perlなどの連想配列としての性格の二つを兼ね備えています。 クラスのインスタンスとしてのオブジェクト sample.js var date = new Date(); console.log(date.toString()); 実行例 $ node sample.js Sun Jul 28 2013 ...
- DOM 操作ディレクティブ (AngularJS)AngularJS のビルトインディレクティブのうち DOM 操作に関するものを、コード例とともに列挙します。公式ドキュメントはこちらです。 DOM 操作ディレクティブ <!DOCTYPE html> <html lang="ja" ng-app> <head> <meta charset="utf-8"> <script type="...
- フィルター (AngularJS)AngularJS にはモデルの値を表示用に変換するフィルタという機能があります。コマンドラインにおけるパイプのように使用します。公式ドキュメントはこちらです。 フィルターの使用例 <!DOCTYPE html> <html lang="ja" ng-app="myApp"> <head> <meta charset="utf-8"> <...
- サービス (AngularJS)AngularJS のビルトインサービスのうち代表的なものをコード例とともに列挙します。公式ドキュメントはこちらです。 <!DOCTYPE html> <html lang="ja" ng-app="myApp"> <head> <meta charset="utf-8"> <script src="angular.min.js">...
- JavaScript の落穂拾い基本は理解しており大抵の処理は書ける人でも使用頻度が低いためか忘れてしまいがちな JavaScript の雑多な知識を書き出してみました。 タイマー 一定間隔毎に繰り返し実行 var intervalId; var intervalTime = 1000; //msec var cnt = 0; var intervalFunc = function(){ console.log(cnt); ...
