同一ファイル内にある function funcA() : B { return funcB()} function funcB() : B { ... } においてfuncBをモックにしてfuncAを呼んでもモックが呼ばれない。 import * as thisModule from "./funcA" function funcA() : B { return thisModule.funcB()}…

function removeValueSubOrder<T, K extends keyof T, P extends keyof T[K]>( target: T, subOrder: K, keys: P[] ): T { const obj = { ...target } as any for (const key of keys) { obj[subOrder][key] = undefined } return obj as T } function removeValue<T, K extends keyof T>(target: T, keys: K[]): T { const…</t,></t,>

関数のモック import * as Utils from "hogehoge" jest.mock("hogehoge") jest .spyOn(Utils, "hogeFunc") .mockReturnValue(exampleValue)

作ってみた。 const replace: <T, S extends T>( list: T[], condition: (ob: T) => ob is S, callback: (ob: S) => T ) => T[] = (list, condition, callback) => list.map(t => (condition(t) ? callback(t) : t))</t,>

空白をチェックしているようだ。 javascriptで poge = {oiu:“”, hoge:“a”} !!poge.oiu -> false !!hoge -> true

例えばf(S,N,B)という関数があるとして、args=["a",3,false]というタプルを渡すには f(...args)とやれば良い。同様のことは配列においても可能。

色々やり方はあると思うが一つ聞いたのはこういうもの。 const root = new BehaviorSubject<"start"|"end">("start"); const subject = new Subject<string>(); const op = root.pipe(mergeMap((x) => { if (x == "end") { return throwError(new Error("end")); } r</string>…

const myMap = <const>{ A:{hoge:"a"}, B:{hoge:"b"} }; type keys = keyof typeof myMap;` keysはA|Bという型になる。 ちなみにmyMapはreadonly属性になってる。</const>

型で条件付きで拡張すれば良い。 const MyEmpty = Symbol("MyEmpty"); type Empty<T> = { [P in keyof T]:P extends "hoge" ? T[P] | typeof MyEmpty : T[P] } type ExRoomInfo = Empty<RoomInfo></roominfo></t>

以下を参照した。 mae.chab.in インストール npm install --save-dev parcel-bundler 使い方 npx parcel index.html とするだけで依存関係をたどってdistディレクトリに吐き出される。 webサーバ(ポートは自動)が起動し、 Hot Module Replacementに対応して…

rxjsの someObservable.subscrive((result)=>(....)) が const result = await someObservable.toPromise(); みたいにプロミスに変更してawaitできる。 あとES6から複数値を関数から受け取れるらしい function some() { return {4,3}; } let {x, y} = some();

async関数はPromisで包んで返してくれる。awaitはpromiseが解決されるまでそこでまってくれる。これをつかうためには結局、その関数はasyncにならないといけない。

req.openの２つ目は非同期のフラグ、req.sendはPOSTの場合データが入る。 const req = new XMLHttpRequest(); req.open("GET", "myjson.json", true); req.onreadystatechange = () => { if (req.readyState === 4 && req.status === 200) { const jsonText …

export const eventIdList = <const>["HogeEV", "PoiEV"]; export type EventId = typeof eventIdList[number];</const>

```cterm npm install express-generator-typescript ```作成 ```cterm npx express-generator-typescript "hello-app" ```hello-appの中に入って実行 ```cterm cd hello-app npm run start-dev ```

expressをinstallしておく npm install express typeも npm install @types/express import express from "express"; var app = express(); app.get("/", (req, res) => { return res.send("Hello World!"); }); app.listen(3001, () => { console.log("app …

nodeのtypeを入れておく。 npm install @types/node import * as http from "http" let server:http.Server = http.createServer((req:http.IncomingMessage, res:http.ServerResponse) => { res.writeHead(200, {'Content-Type':'text/plain'}); res.write(…

バージョン確認 node -v v10.16.0 npm -v 6.9.0 typescriptのコンフィグファイル作成 tsc --init npm開始 npm init typescript実験用にhello.ts作成 console.log("hello") トランスパイル tsc 試しに実行してみる。 node hello.js jsの吐き出し先をdistフォ…

node package.config { "name": "hoge", "version": "1.0.0", "description": "hoge", "main": "index.js", "scripts": { "build": "webpack", "watch": "webpack -w", "test": "echo \"Error: no test specified\" && exit 1" }, "author": "KatagiriSo", "…

list[]のfilterに渡すクロージャでreturnを書き忘れてもコンパイルが通ってしまう‥。

環境モナドを作ってみました。 gistb15f8bd0d01559dc9178c748a5f1e49c

typescriptで状態モナドを作ってみます。状態モナドは という状態を受け取って結果と変化した状態を返す関数です。これを export type State<R,S> = (s:S) => {result:R,state:S} と定義しておきます。初期値を作る関数を export const unit = <R,S>(result:R) => (sta</r,s></r,s>…

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を切り替えてみた。 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 plugin プラグインの例 jquery.hoge.js (function ($) { $.fn.hoge = function () { return $("p").click(function () { console.log("test!"); $(this).text("hello!"); }); }; })(jQuery); これをjqueryとともにhtml側で読み込んでおく。 タイプス…

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…