ペロハム大学

ヤルゾー

手を動かしながら学ぶTypeScript 3日目(サンプルアプリ作成に入ろうと思ったが・・)

■思ったこと

ゴールデンラヴィットの興奮冷めやらぬ。


■ やってみよう

SECTION-010の環境構築から改めてやっていきます。やっていけるのか?

[SECTION-010]TypeScriptでHelloWorld

①package.jsonの設定

これは1日目にもう作ってたので、scriptsの追記だけしようと思う! ここに設定するとnpm run キースクリプトを実行できるようになる。startに最初に動かしたいファイル名書いとけばOK

  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "tsc",
    "dev": "tsc -w",
    "start": "node dist/index.js"
  },
②index.ts記載

index.tsにHelloWorld的なものを書く

const pleaseKeyword = (name: string) => {
  return `キーワード発表は${name}お願いします!`
};

 console.log(pleaseKeyword(`おいでやす小田さん`));
③ビルドする

tscするとjsファイルになるよ。一日目にtsconfig.jsonでincludeを設定してたので、実行場所はどこでもOK

④npm run startする

こんな感じで実行される

PS E:\mizunomu1v1\work\practice-typescript\practice-typescript> npm run start

> practice-typescript@1.0.0 start E:\mizunomu1v1\work\practice-typescript\practice-typescript
> node dist/index.js

キーワード発表はおいでやす小田さんお願いします!

[SECTION-011]対話用の関数作成

サンプルで作るpromptInput関数難しくない!?

非同期処理
  • 一個の処理が完了してなくても同時に動かせちゃう、つまり並行処理!
  • ただし、処理の順序は制御できない、これじゃあ不便じゃありませんか・・?
  • コールバックを使うことである程度制御できるけど、ネスト地獄に陥りやすい
  • そこでスッキリかけてオススメされるのがPromise、他にもasync/awaitがいる
● コールバック
  • 引数に関数を渡して、渡した先で受け取った関数をしかるべき処理の後に実行させて…てな感じで順番を制御できる
  • ので、順番にやりたい処理があったらそのたびコールバックしなきゃいけない・・そんなことはやってられないぞ
● Promise
  • 引数は、第一引数にresolve、第二引数にrejectが使える。resolveは成功したとき用、rejectは失敗したとき用
  • pending、fulfilled、rejectedの3つの状態を持ってる
  • 基本はpending(待機)、resolveされるとfulfilled(終了)に、rejectされるとrejected(処理失敗)
 new Promise((resolve.reject) => { 
    ...
    });
  • 終わってから実行させるにはthenをメソッドチェーンみたいにして使える
  • が、async/awaitを使って書くこともできる
● async/await
  • awaitを処理の前につけると上から下に処理を実行してくれる!スッキリ
  • そのためには、関数にasyncをつけてあげる必要アリ、簡単だね?

■ 思ったこと

やっぱりもっと基礎知識つけてからじゃないと手を動かすどころではない!本の対象がある程度わかる人向けだからね、、勉強して出直す!!!!!