Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationEventAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
122
Help us understand the problem. What are the problem?

More than 5 years have passed since last update.

javascript初心者によく教えること

色々な人に同じことを教えている気がするのでまとめておく。
他の言語でもいいので、変数、分岐、繰り返し、関数くらいがわかってたら、下のことにとりかかっても早くない。

上の方が効果/学習コストが高い。

困ったらChromeデバッガ

とにかく困ったらChromeデバッガを使う。jsもcssもhtmlもChromeデバッガを使って確認する。
使い方は一通り勉強した方がいい。

とりあえずjQueryとcoffeescriptを使う

jsのmvcフレームワークとかに比べると学習コストが激安。
初心者であれば、とりあえず使っておいて間違いない。

検索は、「javascript+◯◯」ではなく、「jquery+◯◯」

生jsを排除してなるべくjQueryに寄せて書くことで、IE対応を減らせる。記述量も減る。

変数を一つのグローバルなオブジェクトにまとめて格納する

名前空間の汚染を小さくするために、状態保存用のwindowオブジェクトプロパティ(≒グローバル変数)は一つのアプリケーションで一つだけしか使わないようにする。

//ダメな例
foo = 1
bar = 2
//良い例
window.hoge = {}
hoge.foo = 1
hoge.bar = 2

クロージャを覚える

外に出さなくてもいい変数は隠蔽する。下記では、fooが隠蔽されている。隠蔽は、coffeescriptのclassを参考にするとわかりやすいと思う。

func = function(){
  var foo = 0;
  return function(){
    return foo = foo + 1;
  }
}
bar = func()
bar()//->1
bar()//->2
bar()//->3

副作用のない書き方を覚える

jsは並列っぽい動き方をする上にスコープがわかりにくいので、意図しないところで変数が上書きされやすい。再帰関数、無名オブジェクト、無名関数を利用する。

テストを書くな

宣伝です。テストコードを書かないでリグレッションテストができるテスティングツールporkyをつくったので、使ってみてください。
https://github.com/puriketu99/porky

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
122
Help us understand the problem. What are the problem?