07

2013/01

javascriptは以前からいろいろ実装していたものの、なんとは無しに実装していたが運用しやすいコードってどんなもんだろうな。どういう気概でやってるのだろうと思ってこの本を読んでみました。

だいたい大きく纏めると

  • Style Guidlines
  • Programming Practice
  • Automation

で構成されています。今回はその「Style Guildlines」についてぼやいていこうと思います。 だいたい言っていることは他の言語でも通ずるところがあったのでしっくり腹に落とし込めた気がします。あと、「Style Guidlines」に関してはおすすめだけじゃなくてなんでこういう書き方いいのかを説明されているので納得いくものがありました。「Programming Practice 」は結構知らないことが多々あったのでちょっと実用性があるかは疑問なものもあったけど勉強になったと思います。

Basic formatting

コードのインデントや変数名・関数名の決め方がこんな書き方がいいよという紹介から始まり、変数の型について説明されていた。

特にnullとundefinedで細かく説明されていたのでメモ。

null

  • 変数宣言の際には初期化しようね
var hoge = null;
  • 期待されていないオブジェクトだったりしたときはnullを返す
function getPerson(){
  if (condition) {
    return new Person();
  }
  else {
    return null;
  }
}

var person = getPerson();
if (person !== null) {
  doSomething();
}
  • 引数に設定(供給)されたかどうかをnullでチェックしないで! この関数に技術的に間違っているわけじゃないけどそういう想定で
    やるとあとで大変なことになるからやらんほうがいいのかな。
    (すこしわかってない)
function hoge(arg1, arg2) {
  if (arg2 != null) {
    doSomething();
  }
}

undefined

基本的にこれは混乱を招くものなので使わないようにしよう!と筆者は書いていた

var person;
typeof(person); // "undefined"
typeof(hoge);   // "undefined"

変数宣言したけど初期化してないからundefined、宣言してなくてもundefined。仮にエラーが発生しても宣言されていな変数と統一するべきだろう。 あとはこんな混乱が起きないように初期化しようって話

var person = null;
if (person === null) {
  do();     
}

Comments

コメントの書き方のおすすめなんかが説明されています。

Statements and Expressions

条件文を書くときの作法なんか書かれていて、基本的な者から筆者のおすすめやら各コーディング規約に準ずるとこんな書き方できるよっての書かれていてそれを採用してるときりがないので自分もしっくり書き方を紹介

// if,forの次は必ずspace
// ()内部は空白を入れない
if (condition) {  
  do();
} else {
  doElse();
}

for (var i = 0;i < 10; i++) {
  do();
}

switch (condition) {
  'hoge':
    // do something
    break;
  'moge':
    // do something
    break;
  default:
    // none
}

個人的には「if」は以下のように書きたい

if (condition) {
  do();
}
// ここにコメント入れられたりできて見やすい
else {
  doElse();
}

The loop

言わずと知れた構文だが、continueは利用しないほうが分かりやすくてバグの原因とならない

var values = [1,2,3,4,5], i;

for (i=0; values.length < 5; i++) {
  if (i != 2) {
    process(values[i]);
  }
}

The for-in loop

for-in は基本的にはオブジェクトのプロパティを走査するときに利用される。 利用するときはhasOwnPropertyを利用することを筆者はおすすめしている

var prop;
for (prop in object) {
  if (object.hasOwnProperty(prop)) {
    console.log(prop);
    console.log(object[prop]);
  }
}

単純な配列の走査はしないようにすすめている。これは数値的インデックスされたプロパティとして 走査されてしまい、本来値としてのデータとして扱われないのだ!なので先天的なエラーをお越しかねない。

Valiables, Functions, and Operators

まぁ、あたりまえのことなのですが最初に変数宣言はちゃんとしようぜ。 から、無名関数を宣言するときは最後の行でオブジェクトか無名かわからなくなるから 無名関数の場合は()でくくってね!

// Bad
var hoge = function() {
  alert('hohoho-');
}();

var hoge = (function() {
  alert('hohoho-');
}());

Primitive Wrapper Type

結論から言うと型としての扱い方がわからなくなるので利用しないことを進めている。


var name = 'hoge';
// このとき、処理の裏側では一時的にインスタンスが生成されている
// のでこの書き方をしてもエラーにはならないらしい
name.toUpperCase();
console.log(name.toUpperCase());


// ので以下のものはBad
var name = new String('hoge');
var num = new Number(20);
var bool = new Boolean(true);

次回は、「Programming Practice」をメモってみる。

2 comments so far

Add Your Comment
  1. 変数宣言の際にnullで初期化するのはまずいです
    最近のJSエンジンは型推論と言って、
    変数の型は安定しているという統計結果に基づき、
    最初に代入された型をその変数の型と仮に決め打つことで処理を高速化しています

    将来的的なさらなる推論技術の発達にも備えて、
    数値なら0、文字列なら”"、配列なら[]、オブジェクトなら{}のようにそれぞれの型の基本形で初期化すべきです
    配列は更に、整数数値だけの配列、浮動小数点数値含む配列、オブジェクトを含む配列、
    また、連続している配列、穴がある配列等、それぞれに合わせて最適化がされているので、
    それを意識したコーディングも大事です
    []とし、後から要素を追加するか、new Array(n)で予めメモリを確保させてから追加するかでも状況によって結構違ってきます

    continue等も、最適化されたマシン語に翻訳しやすいので、高速化には強力です
    作法を意識するのも大事ですが、逆にコンパイラにとって不適切なものとなってしまうこともあるので注意が必要です
    また、処理系開発陣は今使われているコードの統計からどのような最適化を目指すか決めていますから、
    中途半端に丁寧な書き方はおざなりな書き方よりパフォーマンスが下がることだってあります

  2. うぉーーー。名無しさん。コメントありがとうございます!!!

    内部処理のことまで丁寧説明していただいて大変ありがたいです!!!

    > 将来的的なさらなる推論技術の発達にも備えて、
    数値なら0、文字列なら””、配列なら[]、オブジェクトなら{}のようにそれぞれの型の基本形で初期化すべきです
    配列は更に、整数数値だけの配列、浮動小数点数値含む配列、オブジェクトを含む配列、
    また、連続している配列、穴がある配列等、それぞれに合わせて最適化がされているので、
    それを意識したコーディングも大事です

    初期化の話勉強になります。

    コードの管理だけじゃなくてパフォーマンスも意識した上での管理も
    していかなければいけませんね。(なんかトレードオフのような感じ
    にはなっていくような気がしますがそれは規約なりそのアプリの特性
    に応じてやっていく感じですかね)

    これからは、名無しさんのことも考慮に入れつつ、この著者のやってることの知恵を勉強していきます!!!