Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
JavaScript 基礎Ⅰ
 プログラミングの目的
 開発の手順
 JavaScript とは
 変数と変数型
 制御構文 (if, else)
 課題
 膨大な数の計算を高速で行う
 手間の掛かる処理を自動で行う
 リッチな UI を実装する
テスト
プログラムにバグがないか確認する
実装
プログラミング言語を用いてプログラムを開発する
仕様作成
要件を満たす機能の仕様を定める
要件定義
したいこと、すること(機能)を定義する
 Web ブラウザで動くプログラミング言語
 HTML を動的に操作できる
 HTML5 の API を利用するとブラウザを介して次の
ようなことができる。(一部紹介)
 非同期通信 (XMLHttpRequest)
 2D, 3D ...
 JavaScript の内容を細かく説明する時間は無いため、
ライブラリを用いてゲームを作れるところまで、少
し早足で進む。
1. JavaScript の書き方、変数と型、制御構文
2. 関数の宣言と変数スコープ、無名関数
3. ライブラ...
値を格納する
 変数とは、値を格納する箱
 変数には型があり、 JavaScript には次の 7 種類があ
る
 Number (数値)
 String (文字列)
 Boolean (真偽値)
 Function (関数) ※次の回で説明する...
 var を使って宣言する
 C 言語と異なり、型を宣言しない
 値によって型が決まる
var num = 8;
var str = "ネットワーク講座"
var is8 = true;
var arr = [1, 2, 3, 4, 5,...
 数値 (整数、小数の両方を扱う)
var n = 8;
var m = 9;
// 四則演算 (ブラウザで実行してみよう)
console.log(n + m);
console.log(n - m);
console.log(n * m)...
 文字列 (char 型は存在しない)
var str = "ネットワーク講座";
// String のプロパティ、メソッドの呼び出し
console.log(str.length);
console.log(str.slice(6, 8)...
 真偽値
 true か false の どちらかの値を持つ
 if や for, while などの制御構文で使われる
// 変数 bool を true で初期化
var bool = true;
console.log(bool);...
 値を一列に格納して扱う
var fruits = ["りんご", "みかん", "バナナ
", "キウイ"];
// Array のプロパティ、メソッドの呼び出し
console.log(fruits.length);
console.lo...
 値と key と value のペアにして扱う
 index を自由に指定できる配列 (連想配列)
var obj = {
title: "ネットワーク講座",
sub_title: "JavaScript 基礎Ⅰ",
index: 8
...
プログラムの流れを制御する
 比較演算子
 == 等しい
 != 等しくない
 === 厳密に等しい (型も比較対象)
 !== 厳密に等しくない (型も比較対象)
 > より大きい
 >= 以上
 < より小さい
 <= 以下
 論理演算子
 &&...
 条件式を満たす場合 (true の場合) に実行される
if (条件式) {
/* 実行されるコード */
}
 例
var n = 55;
if (n % 2 !== 0) {
console.log(n + " は奇数");
}
 if の後に使い、条件式を満たさない場合 (false の場合) に実行される
if (条件式) {
/* 条件式が true の場合に実行されるコード */
} else {
/* 条件式が false の場合に実行されるコード */
}...
 複数の条件で処理を分岐したい場合、次のように書け
る。
if (条件 A) {
// A
} else if (条件 B) {
// B
} else {
// C
}
 if, else は条件によって実行するコードが 1 行の場合は中括弧 {} を省略できる
if (条件式) /* 条件式を満たす場合に実行される */
else /* 条件式を満たさない場合に実行される */
 つまり、 else if...
 HTML に書き込む
<script>
/* JavaScript のコード */
</script>
 HTML に読み込む
<script src="file.js"></script>
 アンケート
 課題は別途指定
Upcoming SlideShare
Loading in …5
×
Upcoming SlideShare
後期02
Next
Download to read offline and view in fullscreen.

0

Share

Download to read offline

前期講座08

Download to read offline

北海道工業大学電子計算機研究部ネットワークチーム 前期講座資料08

Related Audiobooks

Free with a 30 day trial from Scribd

See all
  • Be the first to like this

前期講座08

  1. 1. JavaScript 基礎Ⅰ
  2. 2.  プログラミングの目的  開発の手順  JavaScript とは  変数と変数型  制御構文 (if, else)  課題
  3. 3.  膨大な数の計算を高速で行う  手間の掛かる処理を自動で行う  リッチな UI を実装する
  4. 4. テスト プログラムにバグがないか確認する 実装 プログラミング言語を用いてプログラムを開発する 仕様作成 要件を満たす機能の仕様を定める 要件定義 したいこと、すること(機能)を定義する
  5. 5.  Web ブラウザで動くプログラミング言語  HTML を動的に操作できる  HTML5 の API を利用するとブラウザを介して次の ようなことができる。(一部紹介)  非同期通信 (XMLHttpRequest)  2D, 3D 画像の描画 (Canvas, WebGL)  リアルタイム通信 (WebSocket API)  P2P 通信 (WebRTC)  位置情報の取得 (Geolocation API)  ファイルの操作 (File API)
  6. 6.  JavaScript の内容を細かく説明する時間は無いため、 ライブラリを用いてゲームを作れるところまで、少 し早足で進む。 1. JavaScript の書き方、変数と型、制御構文 2. 関数の宣言と変数スコープ、無名関数 3. ライブラリを用いてゲーム作成Ⅰ 4. ライブラリを用いてゲーム作成Ⅱ
  7. 7. 値を格納する
  8. 8.  変数とは、値を格納する箱  変数には型があり、 JavaScript には次の 7 種類があ る  Number (数値)  String (文字列)  Boolean (真偽値)  Function (関数) ※次の回で説明する  RegExp (正規表現) ※前期講座では扱わない  Array (配列)  Object (連想配列、ハッシュ)
  9. 9.  var を使って宣言する  C 言語と異なり、型を宣言しない  値によって型が決まる var num = 8; var str = "ネットワーク講座" var is8 = true; var arr = [1, 2, 3, 4, 5, 6, 7, 8]; var obj = { title: "ネットワーク講座", index: 8 };
  10. 10.  数値 (整数、小数の両方を扱う) var n = 8; var m = 9; // 四則演算 (ブラウザで実行してみよう) console.log(n + m); console.log(n - m); console.log(n * m); console.log(n / m); console.log(n % m);
  11. 11.  文字列 (char 型は存在しない) var str = "ネットワーク講座"; // String のプロパティ、メソッドの呼び出し console.log(str.length); console.log(str.slice(6, 8)); console.log(str[0]); // 文字列の連結 var s = "08"; console.log(str + s);
  12. 12.  真偽値  true か false の どちらかの値を持つ  if や for, while などの制御構文で使われる // 変数 bool を true で初期化 var bool = true; console.log(bool); // 代入 bool = false; console.log(bool); // 比較した結果の代入 bool = 124 % 2 === 0; console.log(bool);
  13. 13.  値を一列に格納して扱う var fruits = ["りんご", "みかん", "バナナ ", "キウイ"]; // Array のプロパティ、メソッドの呼び出し console.log(fruits.length); console.log(fruits[0]); console.log(fruits.join("と"));
  14. 14.  値と key と value のペアにして扱う  index を自由に指定できる配列 (連想配列) var obj = { title: "ネットワーク講座", sub_title: "JavaScript 基礎Ⅰ", index: 8 }; // title, sub_title, index は obj のプロパティになっている console.log(obj); console.log(obj.title); console.log(obj.sub_title); console.log(obj.index);
  15. 15. プログラムの流れを制御する
  16. 16.  比較演算子  == 等しい  != 等しくない  === 厳密に等しい (型も比較対象)  !== 厳密に等しくない (型も比較対象)  > より大きい  >= 以上  < より小さい  <= 以下  論理演算子  && AND  || OR  ! NOT
  17. 17.  条件式を満たす場合 (true の場合) に実行される if (条件式) { /* 実行されるコード */ }  例 var n = 55; if (n % 2 !== 0) { console.log(n + " は奇数"); }
  18. 18.  if の後に使い、条件式を満たさない場合 (false の場合) に実行される if (条件式) { /* 条件式が true の場合に実行されるコード */ } else { /* 条件式が false の場合に実行されるコード */ }  例 var n = 55 + 1; if (n % 2 !== 0) { console.log(n + " は奇数"); } else { console.log(n + " は偶数"); }
  19. 19.  複数の条件で処理を分岐したい場合、次のように書け る。 if (条件 A) { // A } else if (条件 B) { // B } else { // C }
  20. 20.  if, else は条件によって実行するコードが 1 行の場合は中括弧 {} を省略できる if (条件式) /* 条件式を満たす場合に実行される */ else /* 条件式を満たさない場合に実行される */  つまり、 else if は次を省略して記述したもの if (条件 A) { // A } else { if (条件 B) { // B } else { // C } }
  21. 21.  HTML に書き込む <script> /* JavaScript のコード */ </script>  HTML に読み込む <script src="file.js"></script>
  22. 22.  アンケート  課題は別途指定

北海道工業大学電子計算機研究部ネットワークチーム 前期講座資料08

Views

Total views

421

On Slideshare

0

From embeds

0

Number of embeds

2

Actions

Downloads

4

Shares

0

Comments

0

Likes

0

×