第3回javascript勉強会

サイ本 javscript 読書会

メンバーも増えてきて、楽しい勉強会になりました。
多面的に議論できて、充実しまくりです。
3章は当番の人が忙しかったので、先に4章を終えることができました。
ちょっと、質問祭りをしてしまって、本筋から離れた議論をしてしまいました。すみません。

運営方針

  • 最強の言語JavaScriptの最強の本「さい本第5版」読む会
  • 輪講形式：みんなでわからないところを考える→目標amachang
  • ustreamで毎回録画
  • 毎回誰かがレポートをあげてくれて、それと録画をみて復習や補習をする

復習

新しい人も多いということで、復習をしました。

リテラルとは何か？
  • ソースにかけるデータのこと
Javascriptのデータには2種類ある。
  • primitive
    • 数
      • 数は、すべて浮動小数点です。
      • 16進数・8進数
      • 2進数はないのはなんでだろうね。
    • 文字列
    • 論理値
    • 未定義=undefined
  • object型（参照型）
    • object
    • null
    • 配列
    • 関数
    • Date
    • RegExp
    • などなど

4章

4-1 変数の型
  • Javascriptには、型がないです
  • 型が異なるものをいれて、下のようなコードが書けます



var i = 10;

i = " hehehe"

  • では、「型付き」とはどのような利点があるか？
    • データがどのような種類のものかを特定するのに使う
    • 異なる型の値を入力すると、エラーが起こる
      • プログラム上ありえない、データの使用を防ぐことができる
      • 安心して、プログラムを書ける（コンパイラでエラーがでる。）
  • 型に応じて、メモリの割り当て領域を確保する。
    • よく、コンパイラ言語の本では、箱を確保する表現で説明される。
  • コンパイル時の挙動
    • Javaは動かすときに型を決める
    • CやC++は、コンパイル時に型を決める
      • なので、Javaのほうが遅い。
  • 昔の言語の特徴
    • アセンブラ
      • 型付？型無し？
      • レジスターという型かもしれない
    • lisp
      • 型無し
      • もともと紙の上で考えるプログラム言語だった。
    • FORTRAN
      • 型あり
      • とにかく早く動かすのが使命
  • 型ありは多重継承の問題がある
    • 詳しくは、『C++の設計と進化』をみよう。
4-2 変数の宣言
  • 宣言とは？



var x;

    • いまから使うという宣言
    • 必ずvarを使え！！
  • deleteの正しい使い方
    • varで宣言したものに使ってはいけない？
      • でも、実際消すことのできる変数は多くある。なぜか？
    • オブジェクトのプロパティは消せる
      • globalオブジェクトは消せる
      • function(){ }内の変数は消せない(ローカル変数は、callオブジェクトのプロパティであるが、callオブジェクトは仮想的なオブジェクトだから、実はローカル変数は変数である。)
4-3 変数のスコープ
  • スコープとは何か？
    • 変数の有効範囲
    • javascriptのスコープは、関数の中だけ。
    • ブロックではないことに注意
  • スコープは狭いほうがいい
    • 狭いほど、変数へのアクセスの見通しが分かりやすいから
    • スコープチェーン：スコープ内に変数を見つけることができなかったら、上のスコープを探しに行く
  • では、明示的に別のスコープ内の変数を見に行くことはできるか？
    • たとえば、オブジェクト経由でがんばるとか（window.aaaで、グローバル変数を直接見に行ける。）
    • 別関数内のローカル変数へのアクセスは無理
      • callオブジェクトは、仮想的なオブジェクトだから
      • こういうプログラムは、スパゲティの原因になるから、普通やるべきでない。
  • グローバル変数はだめだよね。
  • スコープの寿命
    • レキシカルスコープ
      • プログラム上の寿命
    • ダイナミックスコープ
      • プログラムが走っているときのスコープ
      • 関数を実行しているときの寿命
4-4 基本型と参照型
  • 多言語との比較
    • PHPはすべて値渡し
      • シンプルな言語である。
      • 配列などをコピーする手間がかかる
      • perlも
      • 参照渡しにするときは、明示的な文法がある
    • C++は、代入演算子をオーバーライド
      • 値をコピーするか、参照するか自分で決められる。
  • bindとは何か？



var a =5
はどのような動作か？

    • 1.値を覚える空間（ヒープ）に、5ができる
    • 2.スコープ空間に"a"という変数を作って、ヒープの5に結びつける
      • 箱じゃないよね。ポインタっぽいよね。
  • 値渡しとは？
    • ヒープに同じものをコピーして、べつのオブジェクトを指すようにする
  • 参照渡しとは？
    • ヒープにあるおなじオブジェクトを指すようにする
  • pointerと参照とはどう違うのか？
    • pointerはbindが入っている
      • 直接計算可能
      • bindでは、計算できない
4-5 ガベージコレクション（Garbage Collection)
  • GCとは
    • ヒープは使えば使うほど大きくなるので、適当にヒープを開放する手段を用意する必要がある。
    • 自動で参照されていない領域をfreeにする
      • 逆に言うと、プログラマが自由に領域をfreeにすることはできない。
    • C,C++にはない
      • そもそも、これらの言語では、プログラマーが自分でヒープを開放できるのが、ポイント
4-6 Variables as Properties
  • 実行コンテキスト
    • プログラム実行中にインタプリタが参照している名前空間
    • 2つのwindows間で、javascriptを実行するときの問題
      • どちらが実行コンテキストになっているか？
      • globalはwindowごとに変わるよ＞＜
      • 13章をお楽しみに
  • globalオブジェクト＝window object
その他の話題
  • cloneとは何か？
    • 参照型のインスタンスのコピーをヒープ内に作ること
    • 配列内の配列は、どのようにコピーされるのか？
      • shadow clone:外側の配列はコピーされるが、要素としての配列は、同じ要素を参照している
      • deep clone:外側の配列に加え、要素自身もコピーが作成される。
  • thisは難しい



a.c=function(e){..this..};

a.c();
のとき、this=a



Event.observe($('id'),a.c());

関数を代入することと同じ効果

Event.observe($('id'),function(e){..this..});

a.cのthis=window

  • thisに恋した人がよくやること



a.c=function(){..this..}

a.c()
この場合、this=a


b.d=a.c

b.d()
この場合、this=b　→　thisを取り替え放題！！！