read-eval-print: コンソールの開き方について #85
Comments
|
こちらでまとめられたら、ユースケース側からはread-eval-print節への参照で済ませられそう |
|
Mastering JavaScriptはchapter 1のREPLの話のところで、エラー表示の話もしてた。 後ウェブ版はコンソールがあるので、#56 これを使った解説と分岐が必要になるかなー |
|
http://refactoringjs.com/ |
|
かんたん Rubyを読んで、デバッグの概念についても触れられていて、エラーを次の２つに分けていた
これ最初にあると分かりやすいので、 |
|
スクラッチパッドを使う予定という話を #2 をしていたけど、コンソールへの出力結果が見られないので、微妙に不便。
どの辺にするかを改めて考えたい感じがする。 コンソールとスクラッチパッドは見ているサイトの影響を受けるので、どちらにしても指定した場所への案内が必要になるのではという感じがしている。 |
eloquentjavascriptはこのスタイルだった |
|
#492 で以下みたいな感じにすることにした。
file:/// だけど ajaxとかmoduleとか必要にならなければOK |
|
Vue.js入門 基礎から実践アプリケーション開発まで：書籍案内｜技術評論社 ではHTMLとjsfiddleを使っていた。 |
# コードの評価と結果の表示
目的: ブラウザでのコード評価方法、Console APIの使い方、構文エラーとデバッグについて学ぶ
- ブラウザ
- Firefox
- 開発者
- コンソール
ここではブラウザの評価方法と確認方法について扱う。
エラーが発生したときに何をするかを考える。
## 扱わないこと
- Node.js
- デバッグ方法
- Node.jsのREPL
- ブレークポイント
## アウトライン
- ブラウザの選択 => Firefox
- ブラウザでの実行方法
- index.htmlとindex.jsを作成しscriptとして読み込んで実行する
- Console APIの使い方を学ぶ
- 開発者ツールの開き方
- コードの実行方法、REPL
- (ウェブ版) ウェブ版ではこの方法はワンクリックでできるようになっている
- Node.jsについては2章であつかいます
- 構文エラー(SyntaxError)が出る場合について
- 例) `const 2015;`
- スタックトレースの簡単な読み方
- 詳細はtry...catchの章
- 構文エラーは人間向けのエラーではない問題
- 例) `cosnt a = 1;`
- エラーの行例の前後も見てみよう
- Firefoxではコンソールにエラーの詳細へのリンクがでるぞ
- 実行時エラー(ランタイムエラー)
- 例): `console.logs()`
- 構文としては正しいが実行時に問題があり例外発生するもの
- `TypeError`など`SyntaxError`以外のもの
- 実行時エラーは単純なものから複雜なもの(値に依存するもの)がある
- デバッグ
- あわてずにエラーの原因を追っていく => デバッグ
- エラー文を検索する or MDNのエラーで該当してないものがあるものをみる or コードをよく読む
- SyntaxError => あなたの書き方がなにか間違っています
- TypeError => コードの動かしやメソッドの呼び出し方が何かおかしいです。どこでおかしくなったのかをconsole APIで見よう
- まとめ
- コードの実行
- ログの出し方
- エラーの種類
- デバッグ
fix #85
コンソールへの表示方法を扱っているが、開き方については書かれてない
ここで開き方について簡単に触れる。
(変数宣言より前に持って行ったほうが楽かも)
やること
<script>を使っての実行(ブラウザ(推奨はFirefox)を使ったコンソールの開き方と実行)- index.htmlにscriptタグを書いて、コンソール実行。リロード方式
- script のtypeなしで書く
- CodeSandboxとか設定方法へのリンクをまとめたもの
関連
The text was updated successfully, but these errors were encountered: