- Back to Home »
- JavaScriptを簡単に覚えれる様に日本語に変換
Posted by : Izumikawa Fukumi
2014年8月13日水曜日
JavaScriptを今頑張って勉強しているけど、全然頭に入らない 。・゚(゚⊃ω⊂゚)゚・。
等、初めてプログラミングする方には難しい所も多々あると思います。
っと言っても私からすると、JavaScriptである程度何か作れるのは当たり前。
でも私は何故ある程度の物なら作れるのかと言うと、単にルールを覚えているだけで、
関数・や値の取得方法等は全て検索し、情報を得てます。
恐らく大体のプログラマはそうですけど、何も検索しないで何らかのアプリケーションを作る事は不可能です。基本的な記述は出来るけど、詳しくは知らないから検索する。
または、この関数の引数は何なのか調べる。
プログラマは確実にオフライン状態で生きて行くのは結構難しいでしょう。
全ての関数の引数・取得したい値の取得方法なんて全部覚えている人は1/100くらいの確率でしょう。
でも何故プログラムが組めるか?それは基本的な記述方法と基礎知識があるからなのです。
また、一番プログラマを苦しめるのはアルゴリズム(処理の順序や流れ)でしょう。
って事で前置きが長くなりましたが、今回はJavaScriptの基本的な記述の仕方を覚えて独り立ち出来る様になりましょう。
いつ処理を始める??
プログラムを組む前にいつ処理を始めるのか決めましょう。
色々な場面で魔法を発動したい時があるでしょう。例えば、ローカルアプリケーションの場合は、実行ファイルがクリックされた時に処理を開始します。
ですが、JavaScriptはブラウザーと言う既に実行されている環境の中処理するので、いつ処理を開始するのかを決めておく必要があります。
この「いつ処理するか」の事をイベントと言います。
そうまず始めにプログラムの具体的な処理を書く前に、イベントを作りその中に書いて行きます。主に、JavaScriptにはイベントが2つの分類があります。
- ロード後にそのまま実行。
- マウス等で操作によるイベント
一番簡単なのは[1.]のロード後によるイベントです。
以下のコードでロード後に処理を開始します。
window.addEventListener('load', function(){
//ここに具体的な処理
}, false);
では、このソースを日本語に変換してみましょうか。
ウィンドウ.イベントハンドラ(ロード後に, この関数の中身を実行せよ(){
//ここに具体的な処理
}, false);
こんな感じに変換する事が出来ます。
正直これでホントはJavaScript入門は終わりなのです。
Q「本当にかよw」って言われそうなのですが、後は何がしたいかにより検索すれば情報は腐る程出てきます。ここからはあなたの検索力のよる戦いとなりますが、Google先生は凄いのでどんな下手な検索でも適切な結果を表示してくれます。
例えば、とあるID属性のある要素の値わ取得したい場合は、
まずその要素を取得してから表示すればいいだけなので、要素の取得等と検索すれば出てきます。
window.addEventListener('load', function(){
var data = document.getElementById("test");
alert(data);
}, false);
このソースを日本語に変換すると、
ウィンドウ.イベントハンドラ(ロード後に, この関数の中身を実行せよ(){
var データ = ドキュメント.ID属性のある要素をGetする(テスト);
アラート(データ);
}, false);
恐らくこの辺で大体分かると思いますが、プログラマに必要な力は検索する力。
これが無くてはまずプログラミングをする事は不可能でしょう。
っと言う事で今回のプログラミングの授業は終わりです。