javascript最速マスターからjavascriptを学ぶ
使う機会が増えたので、軽くシンタックスぐらいは把握しておこうという事で、一通り取り敢えず確認してみる事にした。
適当にググり、一番上に出てきたものを参考とする。また、実行は一々ブラウザに表示させるのも面倒なので、jscをシェル上で走らせ、動作確認を行うものとする。
use strict宣言
Perlなどではstrictモードでコーディングするのが標準だが、javascriptではそこまで根付いていないとの事で、use strictをむやみに全スコープ上に反映すると、他のプラグインや外部ファイルと連結した場合に、strictモード準拠のファイルと非strictモード準拠のファイルが混在してしまう問題が起きる。またそれによって動作が保証されない可能性がある。
"use strict"; // all scope var obj="object"; print(obj);
function strict(arg){ "use strict"; // local scope print(arg); } function nostrict(arg){ print(arg); // not strict mode } // not strict mode var hoge="hoge"; strict(hoge); nostrict(hoge);
個人的にはuse strictを書いていくべきだと考えるが、外部ファイルを取り込む事も考えると、ローカルスコープ内でuse strictを宣言し、準拠と非準拠の混在問題を回避しつつ準拠に則るのがベストだと思う。
またラップしている側で既にstrict宣言がされていて、そのインナーにあるスコープ内でもstrict宣言をすると、処理系によってはエラーが出るようだが、当方のjscでは確認できなかった。(jshintではwarningとしてUnnecessary directiveのメッセージが出力された)
$ cat test.js function f() { "use strict"; function g() { "use strict"; print("done"); } g(); } f(); $ jsc test.js done
変数、文字列操作、配列など
function variable() { "use strict"; var a=1,b="2"; a="1"; b=2; } function string() { "use strict"; var a="aaa",b="bbb",c="ccc"; function concatenation() { var d=a+b+c, // 'aaabbbccc' v=[a,b,c,d].join(' '); // 'aaa,bbb,ccc,aaabbbccc' } function split() { [a,b,c].join(' ').split(/ /)[0]; // aaa } function length() { (a+b+c).length==9; // true } function cutout() { (a+b+c).substr(1,2); // aa (a+b+c).substring(1,2); // a } function search() { (a+b+c).indexOf('bb')==3; // true (a+b+c).indexOf('abc')==-1; // true } concatenation(); split(); length(); cutout(); search(); } function array() { "use strict"; var arr0=[1,2,3], // [1,2,3] arr1=new Array(3), // [undefined,undefined,undefined] arr2=new Array(1,2,3); // [1,2,3] arr0.length==3; // true function operation() { var a=arr0.shift(); // a==1,arr0==[2,3] arr0.unshift(a); // arr0=[1,2,3] var b=arr0.pop(); // b==3,arr0==[1,2] arr0.push(b); // arr0=[1,2,3] var c=arr0.slice(1,2); // c==[2],arr0==[1,2,3] var d=arr0.splice(1,2,"a","b","c"); // d==[2,3],arr0==[1,"a","b","c"] } function associative_array() { var a={a:123,b:456}; a['a']==123; // true a.a==123; // true a['c']=789; // add new element a.d=123; // add new element "abc"['length']; // 3 "a,b,c"['split'](/,/); // ["a","b","c"] } operation(); associative_array(); } variable(); string(); array();
制御文
function if_() { "use strict"; if(true); else if(true); else; } function while_() { var i=0; while(i<5)++i; i=0; while(true){ ++i; if(i<5)break; } } function for_() { for(var i=0; i<5; ++i); for(;;)if(true)break; } function for_in() { var arr={a:1,b:2}; for(var i in arr)arr[i]; } /*function for_each() // only firefox { var arr={a:1,b:2}; for each(var i in arr)i; }*/ /*function array_foreach() // only recently browser { ["a","b","c"].foreach(function(v,i))i+": "+v; // "0: a", "1: b", "2: c" }*/ function switch_() { var str="hoge"; switch(str.length){ case 0: break; case 1: break; case 2: // fall through case 3: break; case 4: print("hahaha"); break; case str.length+'': break; case str.length+0: break; case !!str.length: break; // ... default: break; } } if_(); while_(); for_in(); //for_each(); //array_foreach(); switch_();
関数
function main() { "use strict"; var twice=function(arr){ // ラムダ的な for(var i in arr)arr[i]*=2; return arr; }; /* * var add=function(a)++a; // firexのみreturn文のみの場合短縮表記が使える * var add=function(a){return ++a;} と同様 */ var arr=new Array(1,2,3,4,5); arr=twice(arr); // arr is 2,4,6,8,10 }
正規表現
必要な時に見れば良いかな。 RegExp - JavaScript | MDN
例外処理
function error() { try{ throw new Error("error"); }catch(e){ print(e.message); }finally{ ; } } function type_of_error() { try{ f(); }catch(e){ if(e instanceof EvalError){ ; }else if(e instanceof RangeError){ ; } } /* only firefox * * try{ * f(); * }catch(e if instanceof EvalError){ * ; * }catch(e if instanceof RangeError){ * : * }catch(e){ * ; * } */ } error(); type_of_error();
メゾットとクラスのようなもの
関数を作りそのprototoypeプロパティにデータメンバのような感覚で定義したりなど、いじると、クラスのようなものが作れる。また、prototype に親クラスのオブジェクトを代入することで継承する事ができる。
function method() { "use strict"; var man={a:function(arg){return ++arg;},b:function(arg){return arg+=2;}}; man.a(1)==2; // true man.b(1)==3; // true } function class_() { "use strict"; var man=function(arg) // コンストラクタのように動く関数 { this.data=arg; }; man.prototype={f:function(){return this.data;}} var a=new man(10); a.f()==10; // true } function inheritance() { "use strict"; var f=function(){}; f.prototype={return_true: function(){return true;}}; var g=function(){}; g.prototype=new f(); g.prototype.new_function=function(){ this.return_true(); }; var a=new g(); a.new_function(); } method(); class_(); inheritance();
結論
何故だか分からないが外は明るいし、新聞配達のバイク音が聞こえる。
もう少し時間があった時にはこれを見るか・・・
JavaScript | MDN