Rodhos Soft

備忘録を兼ねた技術的なメモです。Rofhos SoftではiOSアプリ開発を中心としてAndroid, Webサービス等の開発を承っております。まずはご相談下さい。

typescript

Discriminated Unions

https://www.typescriptlang.org/docs/handbook/advanced-types.html

わかりやすい資料

www.buildinsider.net

既存メソッドの拡張

declare interface String { getCount(): number; } (String.prototype as any).getCount = function () { return this.length; }; でimportする。

iframeとタイマー

タイマーでiframeを切り替えてみた。 function getID(identifier:string):string { return '[data-id="' + identifier +'"]' } const x:JQuery<HTMLIFrameElement> = $(getID("child")) as JQuery<HTMLIFrameElement> const y = x.get(0); setTimeout(function(){ y.src ="./hoge.html"; },2000) y.</htmliframeelement></htmliframeelement>…

文法の幾つか

1. interfaceを使ってメソッド拡張まがいなことができる。 2. objectの定義に{key?:string, key2?:number}等と?をつけると省略化になる。 3. thisの用法が違う。

JQueryプラグインを使う

Jquery plugin プラグインの例 jquery.hoge.js (function ($) { $.fn.hoge = function () { return $("p").click(function () { console.log("test!"); $(this).text("hello!"); }); }; })(jQuery); これをjqueryとともにhtml側で読み込んでおく。 タイプス…

jquery等を使う。

Webアプリ環境 npm パッケージマネージャ TypeScript 型付きのjavascrpt WebPack TypeScriptやHTMLのパーツ化のために使用 Babel (今回使わなかった。) JSのバージョン吸収 npm プロジェクトでパッケージ管理をスタートしたい場合 npm init ではじめられる。…

感想

1. InputEventは型定義を読み込んだ。 npm install @types/dom-inputevent 2. 定義されてないものはinputEvent["inputType"]で取れた。 3. 定義していないプロパティも input["oldValue"] = input.value;で代入できた。 4. childNodesはArray.prototype.forE…

typescript環境

TypeScript https://ics.media/entry/16329 インストール typescript また、webpackで使用するために ts-loader もインストール 設定ファイル ルートにtsconfig.json { "compilerOptions": { "sourceMap": true, "target": "es5", "module": "es2015" // 出…