Javascript入門①
ドットインストールの「Javascript入門」を少しずつまとめていきます。
http://dotinstall.com/lessons/basic_javascript_v2
Javascriptとは何か?
概要
リファレンス
- MDN(Mozilla Developer Network)
https://developer.mozilla.org/ja/docs/Web/JavaScript
必要な知識知識
- HTML
- CSS
ツール
- ブラウザ(Google Chrome)
- エディタ
はじめてのJavascript
-
書き方は2通り
-
HTMLファイル内に記述
< script>
console.log(“hello,world”);
< /script> -
外部ファイル参照の場合は以下で取得
< script src=”myscript.js”>< /script>
-
-
console.logの確認はChromeならChromeDeveloperToolの「Console」タブで確認
Chrome Developer Toolは「Ctrl + Shift + i 」で表示。 - 文末は;(セミコロン)で区切る
- 複数行のコメントは以下で記述
/ *
コメント文
*/ - 単一行のコメントは以下で記述
// 一行コメント
変数を使ってみよう
変数
- データにつけるラベルの事。
- 変数宣言は以下で行う。
var msg;
msg = “hello,world!”;
console.log(msg); - 宣言と代入を同時に行う事も可能。
var msg = “hello,world!”;
データ型
- 数値
- 文字列
- 真偽値(True/False)
- オブジェクト
- 配列
- 関数
- 組み込みオブジェクト
- undefined(値が定義されていない)
-
null(意図的に値が無い)
Javascript基礎文法マスター(随時更新)
Javascriptとは
Javascriptの特徴
- スタンドアローンの言語としては不便だが、ウェブブラウザなどの他製品やアプリケーション上での実装、動的なWebサイト構築等が得意。
- Javascriptの仕様は、ECMAScriptというスクリプト言語で定められている。EMACScriptはコア言語とも呼ばれる。
(ECMAScriptを各社で実装したのが、Mozilla社のJavascriptだったり、MicrosoftのJScript、AdobeのActionScriptだったりする。) - クライアントサイドJavascriptは、コア言語に加えて、ブラウザ&DOM;コントロール用オブジェクト を拡張している。
- サーバサイドJavascriptは、コア言語に加えて、サーバ上でのJavascript実行関連オブジェクトを拡張している。
- Javascript ≠ Java。別物。オーストリアとオーストラリアくらい違う。
他言語との違い
- クラス(似たオブジェクトを量産するための仕組み)が無い。
- 通常クラスという「型」を元にして、クラスの特設(属性や機能)を引き継いだオブジェクト(「実体」)を作成する
- クラスで行っていた、同等特性のオブジェクト量産は、
- 関数自身もオブジェクト
実行の仕方
- HTML/XHTMLファイル内に以下記述で埋め込んで直接実行
< script >
スクリプト文
< /script > - 外部スクリプトファイル(「ファイル名.js」)として以下記述で呼び出して実行
< script src = “ファイル名.js”>< /script>
書き方
- 文末にセミコロン(;)をつける
- 大文字、小文字は区別される(NUMとnumは別物。)
- スクリプトファイル内の空白、改行は無視される。
出力
- Javascriptの標準ライブラリには入出力関連の関数がほぼ無い。
出力には以下を使用する。
ブラウザへの出力関数(alert)
alert(“Hello,world!”);
コンソールへの出力関数(console.log)
console.log(“Hello, world”);
コメント
コメント(単一行)は以下。
//ここから1行はコメントです。
コメント(複数行)は以下。
/* ここからは複数行でも閉じるまではコメントです。 */
エラー処理
- 以下でエラー発生する可能性のある処理と、エラー発生時の対応を記述
try{
test(“test”) //エラー発生する可能性のある処理
} catch(e){
alert(“エラーは”+e+”です。”);
宣言
変数
- 変数宣言はvarで行う。
var 変数名
変数宣言と初期化は同時実行可能
var a=1;
変数には型は無い。
-
- 1文字目は、英字、アンダースコア(_)、ドル記号($)
- 2文字目以降は1+数字
- 変数名の大文字、小文字は区別される
- Javascriptの予約語は使えない。
◯ _test
◯ $num
× 1num
定数
データ型
型はalert(typeof(値))などで確認可能。数値
数値は10進数、8進数、16進数を扱う事が可能。
例として
- 65535(10進数)
- -123.56(10進数)
- 0xffff(16進数)
- 0x9ab4(16進数)
- 011(8進数)
- -3.1E12
文字列
- “(ダブルクォーテーション)か、’(シングルクォーテーション)で囲む。
”このように文字列を記述”
‘シングルクオーテーションでもOK’ ダブルクオーテーション内の文字列として、ダブルクオーテーションを使いたい場合は、\”を使う。
シングルの場合も同じ。(\’)“ここでダブルを使用する場合は\”と記述”
‘シングルの場合は\’と記述’文字列途中に変数を含む場合は以下のように記述
alert(“このように” + x + “+で連結します”);
文字列から数値への返還は以下
parceInt(“123”); //整数値
parcefloat(“1.5”); //少数値
演算子
- 代入演算子
- +=、-=、*=、/=、%=
- <<=、>>=、>>>=
- &=
- ^=
- |=
- 比較演算子
- ==、!=
- ===、!==
- >、>=、<、<=
- 算術演算子
- +、―、*、/
- %(余り)
- ++ (インクリメント)
- — (デクリメント)
- -a (符号反転)
- ビット演算子
- a & b、a | b、a ^ b、~ a、a >> b、a >>> b
- 論理演算子
- a && b (aかつb)
- a || b (aまたはb)
- !a (aではない)
- 特殊演算子
オブジェクト
- オブジェクトは以下のように定義される
var objName = new Object();
もしくは
var objName = {} //こちらは「オブジェクトリテラル形式」と言う。 - オブジェクトには以下の種類が有り。
制御文
if文
var num = 2;
if (num >= 6) {
alert(“6以上です。”)
} else if *1 {
alert(“3以上6未満です。”)
} else {
alert(“3未満です。”)
}
while文
while (true) {
// 無限ループ!
}
for文
for (var i = 0; i < 5; i++) {
// 5 回実行されます
alert(i+”回目の実行です。”);
}
関数
function add(x, y) {
var total = x + y;
return total;
}
参考
- Mozilla公式
https://developer.mozilla.org/ja/docs/Web/JavaScript/A_re-introduction_to_JavaScript - 最強オブジェクト指向言語 Javascript再入門
http://www.slideshare.net/slideshow/embed_code/23768378# - 感謝のプログラミング10000時間
http://programming-10000.hatenadiary.jp/entry/20130622/1371910881 - Javascript超入門 基礎
http://www.slideshare.net/tetsu6/java-script-16522956?qid=ab99cdad-308c-411f-98a4-2a80ee8f232b&v;=default&b;=&from;_search=8 - はじめてのJavaScript / JS Girls Tokyo #1
http://www.slideshare.net/tacamy/js-girls1-32102921?qid=ab99cdad-308c-411f-98a4-2a80ee8f232b&v;=default&b;=&from;_search=15
*1:num<6)&&(num>=3
【書籍要約】入門 考える技術・書く技術
わかりやすい伝え方に必要なステップを一から学ぶことができる良書でした。
いくつもあるロジカル本の中でも個人的に一番わかりやすかったです。
0. 誤解に気付く
- × 【誤解1】おれが書きたい事を書く→ 読み手が知りたい事を書く。
- × 【誤解2】起承転結で書く → まず結論。それから理由・詳細。
- × 【誤解3】とりあえず書き始める → まず考えを整理する。それから書く。
1. 読み手を理解する
→ 読み手が「この人おれの知りたい事に答えてくれるかも!」と思うから。
→ 読み手の知りたいことに答えないと。
- 読み手って誰?
- 読み手の知りたい事って何?
- OPQ分析の大原則
- O(Objective)
読み手の望ましい状況 「読み手はどうしたい?」 - P(Problem)
読み手にとっての問題=Objectiveとのギャップ 「読み手の希望に対して実際はどう?」 - Q(Question)
OPで読み手が抱くであろう疑問 「読み手はそういう時どう思う?」 - A(Answer)
Qに対する読み手の結論(答え) 「読み手はこうするべきでは?」
+ - レール
文章のテーマ、ものさし
- O(Objective)
- OPQ分析のポイント
- 全て主語を「読み手」にして読んでみて変じゃない?
- レール(文章のテーマ)がずれていない?
- QOPQAのQへの回答Aは直接の回答になってる?
- OPQ分析の大原則
2. 考えをまとめる
- WhySo なんでそうなるの?(結論(答え) → なんで? → 理由)
- SoWhat だから何なの?(理由 → だから何? → 結論(答え))
3. 考えを整理する
- 帰納法で考える(推論である結論(答え)が本当に正しいか?理由が裏付ける)
- まず結論(答え)を冒頭に置く。
- 次に理由。 WhySoチェック。 「なぜならば、例えば、具体的には」+「下部メッセージ」で不自然じゃない?
- 下部メッセージの「つなぎ言葉」は全て同じ種類か。
- 演繹法で考える(全ての前提(下部メッセージ)が正しければ、結論(答え)も絶対に正しい。)
- その前提は本当に間違いなく正しい?
- 縦と横の2次元を意識する
- 縦の関係=「論理の帰結」=上が結論、下が根拠/説明
- 横の関係=「ロジックの流れ」=同種類のメッセージ群
- ピラミッドの縦横を無視しない
- 同じメッセージの繰り返しに注意
- メッセージ作成のポイント
- 名刺表現、体言止めは禁止(メッセージでは無く単語になってしまう)
- 「あいまい言葉」は禁止(見直し、再構築、適切な、問題 等)
- 1つのメッセージは1つの文章。
- 構成を、結論とメッセージの構造がひと目でわかるようにする
- 列挙する事柄は5個まで。(マジックナンバー7±2の下限値)
- しりてが接続詞は禁止(〜し、〜であり、〜して、〜だが、〜せず)←前後関係がAndで論理関係が無い
- ピラミッド内で文章を書こうとしない(構成作成と文書作成は分ける)
4. 文章を書く
- メッセージ毎に段落を作る(メッセージは冒頭に)
- メッセージの塊をわかりやすく
- 文章同士をロジカル接続詞でつなげる
時間/対比/原因・結果/目的/条件
5. 具体的なアクション
- まず「だれが何を知りたい?」
- 次に「知りたい事の答えは~。なんでかっていうと~だから。」
- チェック「文章がロジカル接続詞でつながってる?」
- 最後に「自分が読み手だったとしてこれ読んで納得出来る?」
viの操作方法まとめ(随時更新)
#文字列の検索
$ / 文字列
でEnter
※次候補を検索する場合は「n」を押していく。
「Your VM has become "inaccessible."」メッセージでVagrant起動に失敗した場合の復旧方法
Vagrant環境の起動(Vagrant up)を実行した所、
以下メッセージで起動に失敗した時の復旧方法になります。
-----------------------------------------------------------------------
C:\HashiCorp\Vagrant\localdev>vagrant up
Bringing machine 'default' up with 'virtualbox' provider...
Your VM has become "inaccessible." Unfortunately, this is a critical error
with VirtualBox that Vagrant can not cleanly recover from. Please open VirtualBox
and clear out your inaccessible virtual machines or find a way to fix
them.
C:\HashiCorp\Vagrant\localdev>
-----------------------------------------------------------------------
VirtualBox上で確認すると、「アクセスできません」というステータスで
操作できなくなっているようです。
対象のVirtualBox用ディレクトリにある仮想マシンイメージファイル(.vox)
の「xxxxxx.vbox-tmp」を「xxxxxx.vbox」にリネームして、
Virtualboxを再起動すると「中断」状態で正常認識されました。
この状態で再度vagrantupを実行すると正常起動を確認できました。
-----------------------------------------------------------------------
C:\HashiCorp\Vagrant\localdev>vagrant up
Bringing machine 'default' up with 'virtualbox' provider...
[default] Clearing any previously set forwarded ports...
[default] Creating shared folders metadata...
[default] Clearing any previously set network interfaces...
[default] Preparing network interfaces based on configuration...
[default] Forwarding ports...
[default] -- 22 => xxxx (adapter 1)
[default] Booting VM...
[default] Waiting for machine to boot. This may take a few minutes...
-----------------------------------------------------------------------
Virtualbox上でも正常起動が確認できました。
直前にvagarant halt実行しないまま、うっかりPCシャットダウンしてしまったので、間違いなくそれが原因だと思います。。
この時、起動時に参照するべきVirtualBox用仮想マシンイメージファイル(.vox)が正常終了していないためにtmpファイルとして別名保存されていたようです。
同様の現象の場合はお試しあれ。
Linux基礎コマンドまとめ(随時更新)
MySQLのバックアップ、復元方法
# MySQLのバックアップ、復元方法
環境は以下
CentOS :CentOS release 6.5 (Final)
MySQL :5.5
【バックアップ】
# 全てのDBの場合
$ mysqldump -u ユーザ名 -p パスワード --all-databases > backup.sql
# 特定のDBの場合
$ mysqldump -u ユーザ名 -p パスワード DB名 > 出力ファイル名
例)mysql -u root -p password dbname > dbname.sql
※実行時に以下エラーが出る場合有り。
mysqldump: unknown variable 'symbolic-links=0'
この場合は、以下を実行
MySQLの設定ファイル「my.cnf」にて「symbolic-links」をコメントアウト
symbolic-links=0
↓
# symbolic-links=0
【復元】
# 全てのDBの場合
mysql -u ユーザ名 -p < 出力ファイル名
# 特定のDBの場合
mysql -u ユーザ名 -p DB名 < 出力ファイル名