0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

JavaScript入門のメモ

Last updated at Posted at 2016-03-21

JavaScript (JS) 入門でメモしたものです。主に、O'REILLYのJavaScript(第5版)読書のまとめです。

文字コード

  • 2バイト

大小文字

  • 区別してる
  • JS のオブジェクトとプロパティーは、HTMLのタグや属性と同じ名前が使用されてるものがたくさんある。ただし、HTMLで大小文字を区別しない。(XHTMLでは区別する)

空白スペースと改行

  • 空白、タブ、改行を無視

セミコロン

  • それぞれの文が別の行で記述すれば、セミコロンをなくしてもいい。ただし、入れるほうが。
// これも正しく動く
x = 1
y = 2;

リテラル

  • ES3 では、配列リテラルとオブジェクトリテラルもサポートされてる
// オブジェクトリテラル
{x:1, y:2} 

// 配列リテラル
[1,2,3] 

識別子

  • 先頭の文字:Unicode文字、アンダースコア_、ドル記号$(数字はできない)
  • その後:Unicode文字、数字、アンダースコア、ドル記号
  • Unicodeエスケープシーケンス(\uという文字に続いて、文字に対応する16ビット文字コードを表す4桁の16進数文字を記述する)を使用可能→この記述のおかげで、Unicode文字を使用するJSプログラムを、Unicode文字をサポートしないテキストエディタなどで扱えるようになる。例えば、
  • 予約語(固有の意味を持つキーワード)を識別子として使用不可

数値

  • 整数と浮動小数点を区別しない
  • 64ビット
  • マイナス記号は、数値リテラルの一部ではなく、単行演算子とみなされる

16進数と8進数の整数リテラル

  • 整数を16進数で指定可能:先頭が0x また0X、その後に一連の16進数値
  • ECMAScript標準では、8進数リテラルはサポートしない。しかし、実装によってサポートされた場合もある。先頭が0、その後に一連の数値(0-7)

浮動小数点リテラル

  • 書式:[数値][.数値][(E|e)[(+|-)]数値]

数値の操作

  • 複雑な数学演算を行う関数は、Math という名前のオブジェクトのプロバティとしてコア言語に組み込まれてる。
sine_of_x = Math.sin(x);
hypot = Math.sqrt(x * x + y * y); 

関数

  • JS での関数はデータ型の一つ。コードから操作できる
    • 関数を値として扱える。例えば、変数や配列、オブジェクトに関数を格納したり、関数を引数として他の関数に渡したりできる。

関数リテラル

  • 名前を省略できる
  • 関数定義と同じ記述形式
var square = function(x) {return x * x;}

オブジェクト

  • JSのオブジェクトは連想配列として使用可能
image.width;
image.height;
image["width"];
image["height"];

オブジェクトリテラル

  • オブジェクトリテラルも使用可能
  • 定義形式:
{プロパティ名:, プロパティ名:, ...}
  • 入れ子にしても可能

  • プロパティ値に:

    • 定数指定
    • 任意のJS式
  • プロパティ名には、識別子の代わりに文字列も指定可能

var point = {x:2.3, y:1,2};

var rectangle = {upperLeft: {x:2, y:2}, lowerRight: {x:4, y:4}};

var square = {"upperLeft": {x:point.x, y:point.y}, 'lowerRight': {x:(point.x + side), y:(point.y + side)}};

配列

  • インデックスは0を起点にして数える
  • Array()コンストラクタ関数に引数を1つだけ指定すると、配列の大きさを指定したことになる
var a = new Array();
a[0] = 1,2;
a[1] = "JavaScript";
a[2] = true;
a[3] = {x:1, y:2};

var a = new Array(1.2, "JavaScript", true, {x:1, y:2});

var a = new Array(10)
  • 配列リテラル
[, , ...]
var a = [1,2,3];

var matrix = [[1,2,3],[4,5,6],[7,8,9]];

var base = 1024;
var table = [base, base+1, base+2];

var sparseArray = [1,,,,5];

変数の宣言

  • var 文で宣言されていない変数は、グローバル変数とみなさる
  • 関数の中にグローバル変数と同じ名前のローカル変数があった場合、ローカル変数が優先される

ブロックレベルのスコープはない

  • どのブロックで宣言されたのかにかかわらず「関数全体」で有効
  • [お勧めな書き方]変数を関数先頭でまとめて宣言すること

JS でのfinally 文の理解

  • try ブロックのコードが一部でも実行されると、finally句のコードも必ず実行される。つまり、tryブロック中のコードがどのような理由で数量したかにはかからず、いつもfinally区のコードが実行されること。
  • 通常、try ブロックの最後まで処理が進み、finallyブロックに処理が移り後始末処理が実行。
  • return文、continue文、break文で処理がtryブロックから移動する場合は、処理が移動する前にfinallyブロックが実行される
var a = [1,2,3];
var i = 0, total = 0;
while(i < a.length) {
 try {
  if((typeof a[i] != "number") || isNaN(a[i])) {// 数字ではない場合
   continue; // 次のループに処理を移動する
  }
  total += a[i];
 }
 finally{
  i++;// continue 文が使われた場合でも必ず変数iが増加するようにする
 }
}
0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?