~Linux、MySQLからAJAXまでJavaScriptプログラミング、メモAngularJSはよく利用しているのですが、JavaScriptについて体系的に勉強したことが無かったので、基本的な事を再確認し、備忘としてメモ書きしてまとめています。※目次をクリックすると目次の下部にコンテンツが表示されます。・読み込まれてインタプリタまたはエンジンによって実行。コンパイル言語は、コンパイラによって読み込まれ実行ファイルに変換される。・インタプリタがある環境であればどこでも実行できる。大半のオブジェクト指向言語と異なり、継承モデルがクラスベースではなく、プロトタイプベース。function)を持つJavaScriptの関数はオブジェクトで、自身のプロパティ、メソッドを持ち、他の関数を引数として受け渡したり、変数に割り当てる事が出来る。変数の型とそのeval()メソッドなど。typed)・JavaScriptの変数は、実行時に型の判定を行い、オペランドに異なる型が混在する場合は、JavaScript内のルールに基づいて決められる。“orange”);・JavaScriptは動的型付け言語で、引数の型を定義する必要がない。・定義した引数の数と実行時に指定した引数の数は一致しなくてもよい。指定しなかった引数は、”undefined”が代入される。定義より多く指定した場合は、余分な引数は無視される。・同じ名前の関数は定義できず、ポリモーフィズムは利用できない。同じ名前の関数を定義した場合、後に定義した関数によって置き換えられてしまう。“.”);};リターンする結果の型を定義する必要はない。body}・関数を変数に代入。この変数は関数オブジェクトになる。・関数名がない、無名関数を定義出来る。・JavaScriptは動的型付け言語なので、明示的に型を指定しない。実際に変数に設定した値に基づいて自動的に型が決定される。後で型を変換することは出来る。・varキーワードを使って定義。・関数内に定義した変数はローカル変数で、関数内でのみ使用できる。・script要素内で定義した変数はグローバル変数で、同じHTML文書内の他のscript要素内からもアクセスできる。・基本的な型としてstring、number、booleanがある。2)boolean・treuとfalseのどちらかの値。3)string・シングルクォートまたはダブルクォートで囲んで定義する。“・・・”;2)オブジェクトリテラルオブジェクトとそのプロパティをオブジェクトリテラルの書式を使って定義出来る。下記のように波括弧で囲んで記述する。関数をオブジェクトに追加する事ができ、オブジェクト上で定義された関数をメソッドと呼ぶ。}};・メソッドからオブジェクトで定義されたプロパティにアクセスする場合は、thisキーワードを使用しなければならない。オブジェクトが指定したプロパティを持つかチェックできます。結果は、true、falseでリターンされます。src);・extendメソッドは、dstオブジェト内のプロパティとメソッドはそのまま維持する。保持せずにコピーしたい場合は、angular.copyメソッドを使用する。==、===1)==・対象の二つの値が等しい場合はtrue。・対象の二つのオペランドを同じ型に変換してから値を比較する。2)===・二つの異なる型の場合はfalse。・オブジェクト以外の場合は値を型を含めた値を比較するがオブジェクトの場合は、参照を比較する。従って同じ属性値を持っていても異なるオブジェクトはfalse。(2)型変換1)数値演算の+と文字列の結合の+・数値と文字列に+演算子を適用した場合は、文字列の結合が優先。2が文字列”2′′に型変換されて結合される。・宣言するときに、配列の要素数を指定する必要がない。JavaScriptがリサイズしてくれる。・配列の要素の型を指定する必要がない。異なる型の要素が混在できる。true];2)オブジェクトが配列であるかチェックangular.isArray(value)メソッドでチェックできる。文字列をリターン配列内のすべての要素を引数で指定した区切り文字を使って文字列に変換。オブジェクトをリターンスタックと同様の方法で配列の最後の要素から値を削除して、その値をリターン。4push(item)スタックと同様の方法で配列の最後に要素を追加。5unshift(item)配列の最初に要素を追加6reverse()配列の要素の並び順を反転する。配列をリターン指定した範囲の配列要素をリターン。配列をリターン配列内の要素をソート。配列をリターンindexで指定した要素からcountで指定した個数の要素を削除JavaScriptのundefinedとnull1)undefined値が割り当てられていない変数を読もうとした時や存在しないオブジェクトの属性を読もうとした時にundefinedがリターンされる。25};console.log(myData.address);2)null・値がないということを明示的に定義したい場合にnullを割り当てる。→true2angular.isDefined()メソッドでチェック定義済みかどうかチェック。定義済みかどうかをチェックするのでnullであっても定義済みであればtrue。・JavaScriptはオブジェクト指向言語だが、他の多くの言語と異なり継承がクラスではなくプロトタイプを基に行われる。・JavaScriptはクラスをサポートせず、オブジェクトのみ存在。オブジェクトは他のオブジェクトから初期化する。・JavaScriptの継承は、すべてのオブジェクトが持つ”prototype”という名前の属性を通して処理される。“prototype”属性は、その親のオブジェクトから継承されたすべての属性、メソッド、そのprototype自身への参照を持つ。・あるオブジェクトの属性またはメソッドにアクセスすると、JavaScriptはそのオブジェクトのローカルコピーから探し始め、存在しない場合はprototypeを探す。そのprototypeに存在しない場合は、さらにその上位のprototypeを探し、順にプロトタイプチェーンをたどっていく。・プロトタイプの属性、メソッドを上書きする事が出来る。上書きするとそのポイントで探索が完了するのでそれより上位へのプロトタイプチェーンの探索が終了する。上書きしたポイントより下位のオブジェクトにはその上書きした内容が継承される。・あるオブジェクトの属性、メソッドを変更すると、そのオブジェクトを継承した子オブジェクトには、そのオブジェクトが初期化された後の変更であっても変更が反映される。子オブジェクトのprototypeは親オブジェクトの属性とメソッドを参照しているため。・どのグローバルオブジェクトのprototypeであっても変更する事が出来る。//親を変更すると子にも反映される。//"hello"と表示JavaScriptのスコープに関する注意点1)関数レベルのスコープ・グローバル変数はプログラム内のどこからでも参照できる変数のことで、ローカル変数は関数内で宣言された変数のことであり、宣言された関数の内部からしか参照できない。・JavaScriptはC言語のようなブロックレベルのスコープではなく、関数レベルのスコープ。関数内で定義された変数は、if文やforループなどのブロック内でも参照できる。2)暗黙的なグローバル変数ローカル変数を宣言する場合は、varを使って明示的に宣言する。varを使わずに宣言された変数は、グローバル変数として扱う。3)変数の巻上げ(hoisting)JavaScriptの変数は、関数内のいかなる場所で宣言されたとしても、その関数の先頭で宣言されたのと同じように動作する。下記例にあるように関数の下の方で変数を宣言し値を割り当てたとしても、実際には関数の先頭で行われるので注意する。どこからでも参照できる。//変数の巻上げで、関数の先頭で宣言される。//グローバルではなく、ローカルのmytestを参照。testfunc();JavaScriptのスコープチェーンとクロージャ●クロージャとは?・引数以外の変数を実行時の環境ではなく、自身が定義された環境(レキシカルスコープ、静的スコープ、構文スコープ)において解決する。・JavaScriptの関数オブジェクトの内部では、関数のコードだけではなく、定義時の変数のレキシカルスコープを解決するのに必要なスコープチェインへの参照を持っている。・この関数オブジェクトと変数、レキシカルスコープを解決するのに必要なスコープチェーンをクロージャと呼ぶ。●スコープチェーンとは?・JavaScriptにはグローバル変数と関数内で定義された変数であるローカル変数の2種類がある。・JavaScriptの関数はオブジェクトで関数内にネストして関数を持つ事ができる。・ネストされた関数の場合、ある変数がどのスコープの変数かを解決する際、子関数から親関数、グローバルへと順にその変数がどこで定義されたか確認していき、最初にマッチした段階で解決される。これがスコープチェーン。prntVarは関数。prntFnc(“Tom”)・親関数prntFncを実行し、子関数をchldFnc()を定義して変数prntVarに割当て。・子関数chldFnc()では、変数prtStringを参照している。この変数のスコープは定義時のスコープチェーンで解決される。子関数では定義されていないので、スコープチェーンをたどると親関数で定義されていて、ここで解決される。prntVar()・親関数を実行してリターンされた子関数を実行。・C言語などでは、関数が実行されてしまうとその関数で定義された変数はその時点でメモリから開放されて利用できなくなってしまう。上記例では、親関数で定義されたprtStringは親関数実行後に開放されて利用できなくなってしまうので、子関数は期待通りに実行されないことになる。JavaScriptでは、定義時のスコープチェーンを通して変数を解決できるように実行済みの親関数の変数がそのまま維持されていて利用できる状態になっている。このスコープチェーン解決するためにメモリ上に保持されているオブジェクトは、このクロージャが利用されなくなるまでメモリに維持される。上記現象がメモリリークとなってしまい、古いブラウザでも大きく影響を受ける場合があるので注意する。64ビット・String・Object属性とメソッドのコレクション。配列(2)型の確認typeofオペレータで確認できる。(3)プリミティブとオブジェクト非オブジェクトの単純な値。関数などプリミティブではないものはオブジェクト。・Booleantrue、falseキーワード・Nullnullキーワード・Number数値は数値プリミティブ。・Stringクォーティングされた文字は、文字列プリミティブ・Undefinedvarキーワードで作成後、値が見割当ての変数。・JavaScriptでは、プリミティブとオブジェクトの間で変換する事が出来る。boolean、number、stringプリミティブはそれに対応するグローバルオブジェクトを持つ。・JavaScript内部で、toPrimitive()、toNumber()、toBoolean()を使って変換される。(abstractでスクリプトからコールすることは出来ない)1)toPrimitive()・オブジェクトをプリミティブに変換。・valueOf()がプリミティブをリターンしたらそれをリターン。valueOf()でプリミティブに変換出来なかった場合、toStringを使ってプリミティブに変換。それでも変換出来なかったらエラー。-0、+0、NaNはfalse。Undefinedは変数なので、比較する際にスコープチェーンをたどる必要があり性能上の負荷が増大する。JavaScriptの即時関数(IIFE)●関数をネストして定義し、実行JavaScriptでは、関数内に関数を作成し、関数をネストして定義できます。expression)上記サンプルは、下記書式の即時関数を使って記述する事が出来ます。コメントをキャンセルメールアドレスが公開されることはありません。コメントデータの処理方法の詳細はこちらをご覧ください。