29
変数・演算子・文 開発部 てるー

JavaScript 勉強会 ― 変数・演算子・文

Embed Size (px)

DESCRIPTION

JavaScript 勉強会、「JavaScript 第6版」の 3 章「型、値、変数」の変数、4 章「式と演算子」、5 章「文」のスライド。

Citation preview

Page 1: JavaScript 勉強会 ― 変数・演算子・文

変数・演算子・文

開発部てるー

Page 2: JavaScript 勉強会 ― 変数・演算子・文

アジェンダ

1. 変数

2. +演算子

3. 関数定義式と関数宣言文

Page 3: JavaScript 勉強会 ― 変数・演算子・文

アジェンダ

1. 変数

2. +演算子

3. 関数定義式と関数宣言文

Page 4: JavaScript 勉強会 ― 変数・演算子・文

変数の宣言

var x;var i, sum;

var message = ‘hello’;var a = 0, b = 0, c = 0;

Page 5: JavaScript 勉強会 ― 変数・演算子・文

グローバル変数とローカル変数

● グローバル変数○ 変数の有効範囲はプログラム全体

● ローカル変数○ 変数の有効範囲は変数が宣言された関数の中に限定

Page 6: JavaScript 勉強会 ― 変数・演算子・文

グローバル変数とローカル変数

var g1 = ‘global’; // グローバル変数

var checkscope = function() { var local = ‘local’; // ローカル変数

g2 = ‘global’; // グローバル変数

};checkscope();

Page 7: JavaScript 勉強会 ― 変数・演算子・文

同じ名前があった場合はローカルを優先

var scope = ‘global’;var checkscope = function() { var scope = ‘local’; return scope;};checkscope(); // local

Page 8: JavaScript 勉強会 ― 変数・演算子・文

JavaScript にはブロックスコープがない

var test = function() { for (var k = 0; k < 10; k++) { console.log(k); // 0 から 9 が出力される

} console.log(k); // 10 が出力される

}test();

Page 9: JavaScript 勉強会 ― 変数・演算子・文

JavaScript にはブロックスコープがない

function test(obj) { if (typeof obj === ‘object’) { var j = 0; } console.log(j); // 0 or undefined が出力される

}

Page 10: JavaScript 勉強会 ― 変数・演算子・文

問題

var scope = ‘global’;var f = function() { console.log(scope); // (1) var scope = ‘local’; console.log(scope); // (2)}f();

● (1) で出力されるのは?a. globalb. localc. 上記以外

● (2) で出力されるのは?a. globalb. localc. 上記以外

Page 11: JavaScript 勉強会 ― 変数・演算子・文

問題 (答え)var scope = ‘global’;var f = function() { console.log(scope); // (1) var scope = ‘local’; console.log(scope); // (2)}f();

● (1) で出力されるのは?a. globalb. localc. 上記以外

● (2) で出力されるのは?a. globalb. localc. 上記以外

Page 12: JavaScript 勉強会 ― 変数・演算子・文

巻き上げ

var scope = ‘global’;var f = function() { console.log(scope); // undefined var scope = ‘local’; console.log(scope); // local}f();

var scope = ‘global’;var f = function() { var scope; console.log(scope); // undefined scope = ‘local’; console.log(scope); // local}f();

=

Page 13: JavaScript 勉強会 ― 変数・演算子・文

アジェンダ

1. 変数

2. +演算子

3. 関数定義式と関数宣言文

Page 14: JavaScript 勉強会 ― 変数・演算子・文

「+」演算子は2つの可能性がある

● 加算

● 文字列の連結

Page 15: JavaScript 勉強会 ― 変数・演算子・文

「加算」 or 「文字列の連結」の判定方法

1. オペランドのどちらかがオブジェクトの場合、以下の方法で基本型値に変換する○ Dateオブジェクトの場合は、toString()で変換○ それ以外は、valueOf()で変換を試みて、基本型値を返さなかった場合には

toString()で変換

2. オペランドの一方が文字列の場合、もう一方のオペランドを文字列に変換し、連結処理をする

3. それ以外の場合は、両方のオペランドを数値にして加算処理をする

Page 16: JavaScript 勉強会 ― 変数・演算子・文

1 + 2 // 3'1' + '2' // '12''1' + 2 // '12'1 + {} // '1[object Object]'true + true // 22 + null // 22 + undefined // NaN

Page 17: JavaScript 勉強会 ― 変数・演算子・文

アジェンダ

1. 変数

2. +演算子

3. 関数の定義

Page 18: JavaScript 勉強会 ― 変数・演算子・文

関数の定義方法は3つある

var f = function(x) { return x * x;};

console.log(f(2)); // 4

function square(x) { return x * x;}

console.log(square(2)); // 4

関数定義式

(無名)関数宣言文

var f = function square(x) { return x * x;};

console.log(f(2)); // 4console.log(square(2)); // エラー

関数定義式

(名前付き)

Page 19: JavaScript 勉強会 ― 変数・演算子・文

3 つの差異がある

● スタックトレース

● if や while の中での定義

● 巻き上げ

Page 20: JavaScript 勉強会 ― 変数・演算子・文

スタックトレース(1 / 2)

var f = function() { throw new Error();};

f();

function test() { throw new Error();}

test();

関数定義式

(無名)関数宣言文

var f = function test() { throw new Error();};

f();

関数定義式

(名前付き)

Page 21: JavaScript 勉強会 ― 変数・演算子・文

スタックトレース(2 / 2)Error at f (/Users/teloo/test.js:2:9) at Object.<anonymous> (/Users/teloo/test.js:5:1) at Module._compile (module.js:456:26) ...

Error at test (/Users/teloo/test.js:2:9) at Object.<anonymous> (/Users/teloo/test.js:5:1) at Module._compile (module.js:456:26) ...

Page 22: JavaScript 勉強会 ― 変数・演算子・文

if や while の中での定義

if (true) { var f = function(x) { return x * x; }; console.log(f(2)); // 4}

if (true) { function square(x) { return x * x; } console.log(square(2)); // 4}// IE11, Firefox, Chrome, Node.js で確認したところ動作した

// 仕様的にはしてはいけないらしい

関数定義式

(無名)関数宣言文

if (true) { var f = function square(x) { return x * x; }; console.log(f(2)); // 4}

関数定義式

(名前付き)

Page 23: JavaScript 勉強会 ― 変数・演算子・文

巻き上げ (1 / 2)

// TypeError: undefined is not a functionconsole.log(f(2));

var f = function(x) { return x * x;};

console.log(square(2)); // 4

function square(x) { return x * x;}

関数定義式

(無名)関数宣言文

// TypeError: undefined is not a functionconsole.log(f(2));

var f = function square(x) { return x * x;};

関数定義式

(名前付き)

Page 24: JavaScript 勉強会 ― 変数・演算子・文

巻き上げ (2 / 2)

var f;

// TypeError: undefined is not a functionconsole.log(f(2));

f = function(x) { return x * x;};

function square(x) { return x * x;}

console.log(square(2)); // 4

関数定義式

(無名)関数宣言文

var f;

// TypeError: undefined is not a functionconsole.log(f(2));

f = function square(x) { return x * x;};

関数定義式

(名前付き)

Page 25: JavaScript 勉強会 ― 変数・演算子・文

お わ り

Page 26: JavaScript 勉強会 ― 変数・演算子・文

宿題 (1 / 4)引数またはオプションに入力された文字列を、なんらかの形で

ファイルに書き込んでいくコマンドを作成せよ。

● 1行ずつファイルに書き込む形式でもいいし、CSV 形式でも

いい

● 各成果物によって仕様が異なるので、README を添付する

こと

Page 27: JavaScript 勉強会 ― 変数・演算子・文

宿題 (2 / 4)例

> addtext hoge -f C:/Users/teloo/data.txt> addtext --file C:/Users/teloo/data.txt piyo あああ

>

hogepiyoあああ

data.txt

Page 28: JavaScript 勉強会 ― 変数・演算子・文

宿題 (3 / 4)● 目的

○ Node.js でのファイル操作のやり方を学ぶ

○ Node.js での外部ライブラリの使用方法を学ぶ

Page 29: JavaScript 勉強会 ― 変数・演算子・文

宿題 (4 / 4)● Node.js v0.10.26 Manual & Documentation

○ Node.js の公式のAPIドキュメント

● commander○ コマンドラインのプログラムを簡単に作成するためのライ

ブラリ

● 宿題置き場にサンプルプログラムを置きました