コンパイラかく語りき

import { Fun } from 'programming'

JavaScriptの業務スキル判定表に挑んでみた

以前ブクマしたこちらの記事。

d.hatena.ne.jp

 JavaScriptの業務スキル判定表です。JavaScriptについて自信がついてきたので、判定してみました。

 

 

0〜4段階の階級がありますので、それぞれ引用しつつメモします。

 

0,非JavaScript開発者

  • JavaScriptのことをJavaと呼んでいる
  • 画面上で物が現れたり消えたりするのを指して「Ajax」と呼んでいる。
  • JavaScriptの事を、「Javaスクリプト」とか「JAVAスクリプト」と表記している。その表記だと完全に別物bの言語を指す、ということを知らない。

いやいや、さすがにこれは大丈夫でしょう!笑

 

1,初学者(入門書を学習してゆく段階)

  • JavaScriptは,ちょっとさわった事ならばある。
  • if,for,while,switch,break,continue,function などの基本的な制御構文は,何も見ないで書ける。
  • ネット上で拾ったライブラリやサンプルコードを自分で流用する時に,パラメータの部分(数値とか)を変えて,少しだけカスタマイズして使う事ができる。
  • HTMLの地の文の中に処理そのものをベタで書いたり,jsファイルの中に関数をそのまま並べて書く,というコーディングスタイルだ。
  • document.getElementById() という関数を使ったことがある。しかし,DOMについては何も知らない。
  • バグをなくすために,「バグが出たプログラムに対して,あちこちに alert() を埋め込んで確認する」という方法を主に取っている。
  • alert() と書けばアラートを表示できる,ということは知っている。しかし,そのalertというメソッドをどのオブジェクトが持っているのかは知らない。
  • for文を書く際,
    • for( var i = 0; … とせず,
    • for( i = 0; … というようなコードを平気で書く。グローバル汚染の認識がない。
  • document.all や document.form といったコードを書く。
  • インデントが3や4を超えるような,保守性の悪いコードを平気で書く。(例えば,functionの中のforループの中のif文の中にさらにループを書くとか)
  • どこに書いてあるスクリプトがどのタイミングで実行されるか,あまりよくわかっていない。
  • HTMLを書く際,tableタグの中にtbodyタグが無いとJavaScriptの動作上困る,ということの理由が分からない。
  • 本屋や書店で,JavaScriptの本がJavaのコーナーの棚に陳列されているのを目にしても,特に憤りを覚えはしない。
  • Firebugというものを何となく知っているが,それでも「もし作っている物の対象ブラウザIEだけなら,わざわざfirefoxを立ち上げてfirebugを使う必要性はない。」と考えている。

 

うんうん、DOMもわかるしfirebugも使います。

でも、alertmメソッドがどこにあるか知らない…。早くもヤバイかもしれない…笑

調べた→window.alert - Web API インターフェイス | MDN

 

っていうか、デバッグにアラート使います??いちいちポップアップするの邪魔じゃないですか???僕はconsole.log一択なんですが…。あるいはconsole.table。(という醜い言い訳)

 

2,ノーマル

  • JavaScriptで,プロトタイプベースのOOPができる。
    • つまり,自分で独自に定義したJSON形式のオブジェクトを new して,そこで生まれるインスタンスたちに仕事をやらせる,というコーディングスタイルである。
  • ある程度DOM操作ができる。DOM Event(例えばDOM Level 2 Event Model)についてはあまり知らない。
  • DOM要素に対し,各種イベントをセットして,画面に動的なしかけを埋め込む事ができる。
    • しかし,複数の要素に対して色んなイベントのコードをバラバラに記述しているので,次第にイベント周りのコードがめちゃくちゃになり,画面の挙動が理解不能になってしまう。(つまり,個々のイベントリスナ関数をバラバラに記述しており,1つの管理オブジェクト内にまとめて定義していない。)
  • jQueryprototype.jsを並存させるためには「(function( $ ){ ~ })( jQuery )」のように記述する必要があるわけだが,このコードの意味を理解できる。
  • 静的CSSの作成だけでなく,動的なCSS操作もまあできる。つまり,CSSプロパティをJavaScriptから動的に変える事により,静的CSSの限界を補うことができる。
  • thisというキーワードを日常的に使ってコーディングできる。つまり,JavaScriptでオブジェクトをまともに利用できる。thisが文脈依存である事は何となくだけ知っている。
  • 無名関数/クロージャを日常的に使ってコーディングできる。その詳しい効用は分かっていない。
  • JavaScriptの変数には,参照と実体の2種類があるという事を理解している。それを理解していないと問題が起こる,という事を人に説明するための短いサンプルコードを作れる。その点を図を使って人に説明できる。
  • function f( x, y ) という関数を定義したときに, f( 1 ) のように呼び出し時の引数の数が少なかったり, f( 1, 2, 3 ) のように呼び出し時の引数の数が多かったりする場合の挙動がどうなるのか,理解していない。そういった仕様がどう役立つのかわからない。だから,「arguments」というオブジェクトの使い方もよく知らない。
  • 配列中の要素を順番に操作する時に,for文やwhile文を使ってスキャンするのが間違っており,オブジェクト指向として正しくない,という事を説明できる。かわりに,いつも map(),each(),select() などのイテレータメソッドを使ってコーディングしている。
  • 例外オブジェクトやthrow文を使ったコード設計が具体的にどういう時に必要になるのか,よく理解していない。
  • 「DHTML」という死語をいまだに口にすることがある。
  • JavaScriptを使って複雑なHTMLを動的に生成しなければならず,面倒だと感じることがよくある。または,サーバ側のCGIのコードと全く同じようなロジックを,JavaScriptのコードでも書かなければならず,二度手間・二重管理になってしまう。
  • JavaScriptの自動単体テストの方法を知らないので,品質の保証されたコードを書くことができない。ある程度手動で試験を行なうが,そのために,素早い仕様変更に対応することを難しく感じている。

うおお、いよいよヤバイ。まだノーマルだよ…。

JavaScriptオブジェクト指向プログラミングなんてしたことない。Javaではもちろんやってるけど…。擬似的にクラスを作成してnewすればできるんだろうけど…。

正規表現もぜんぜん書けないよね。Cookieの読み書きはjQueryプラグインを使えばなんとか…。

thisとかクロージャはGoodPartsで読んだしOK!クロージャとして無名即時関数も使うようになったしね!

DHTMLって何???XmlHttpRequestね…以前Ajaxやったときにちょっと勉強したけど忘れちゃった。単体テストもやったことないよ…。

 

3,中級者(開発プロジェクトで1人月としてカウントできる水準)

  • JavaScriptでやりたい事は,JavaScriptでほぼ実現する力を持っている。
    • (外部仕様が渡されたら,とりあえず完成にこぎつけられる。ただし,内部仕様と工数は度外視している。)
  • Prototype.jsjQueryなどのライブラリを渡されたら,中身のコードを自力で追って動作を理解したり,動作を軽く修正する事まではできる。
  • thisというキーワードを使ってコーディングできる。thisのコンテキストがわかり,自分でコンテキストを変更する方法も知っている。
  • JavaScriptで,クラス(プロトタイプ)の継承ができる。(ライブラリを使わない)
  • メインの関数を作るとき,当然,引数はJSONにする。その理由を説明できる。
  • 無名関数/クロージャを使わないとJavaScriptのコーディングが困難である,という事を知っており,遅延評価について説明できる。
  • inというキーワードを使ってコーディングできる。配列に対してinを使ってはならないという事を知っており,inが必要になる局面を具体的に例をあげて説明できる。
  • argumentsというキーワードを使ってコーディングでき,どう役立つのか説明できる。
  • Ajaxのおかげでビューの製造工程をDRYにできる,という事を説明できる。
  • XmlHttpRequestをラップするようなライブラリを日常的に使っている。なので,自分にとってAjaxは,空気や水のような存在であると言える。
  • Firebugで,XmlHttpRequestのレスポンスの中味を見たり,XPathの調査やパフォーマンス計測(プロファイル)ができる。
  • alertやconfirmがDOM構造に属さない特殊な存在であり,イベント発動処理に際して問題を引き起こす可能性がある事を知っているので,取扱いに注意している。
  • ブラウザ間でJavaScriptの動作にどのような差異があるのか,と尋ねられたら,5~6個程度ならばその場ですぐに言える。
  • 「サイ本」とは何か理解しており,内容もだいたい把握している。

うぎゃあああ。もうダメです。半分以上わかりません(´;ω;`)

「メインの関数を作るとき、当然、引数はJSONにする。その理由を説明できる。」→すみません、何をおっしゃっているのか全くわかりません…

Ajaxのおかげでビューの製造工程をDRYにできる、ということを説明できる」→DRYって何…。

その他に関しても、なんとなーくサイ本やGoodPartsで読んだなあ…レベル。すごく知識が曖昧。

 

判定結果

この判定表によると僕は初心者以上、中級者未満だと思います。

JavaScriptに関する自分の知識が偏ってると感じました。僕はブラウザでのWeb制作としてJavaScriptを書いてきたので、クライアントJavaScriptの知識は中級者レベルだと思います。けれど、コアな部分というか、JavaScriptで何かをまるごと作るような、そんな知識がごっそり抜けてますね。

 

今後の課題

幸い、僕のような自称中級者のために救済が用意されていました。サイトには各々のレベルに応じたフォローアップ用のURLが載っていました。

2,ノーマルと3,中級者向けの参考URLをしっかり消化しようと思います。