javascript 學習二

下個這個 youtube 頻道資料很多, 只是多到不好找到自己所需, 因此在這裡分享, 也一併記錄學習的筆記! 這個教程很完整, 也很專業,  我依學習的部份來記錄各段筆記囉!

各段影片快速連結

Lesson 0	Lesson 1	Lesson 2	Lesson 3	Lesson 4	Lesson 5	Lesson 6	Lesson 7
Lesson 8	Lesson 9	Lesson 10	Lesson 11	Lesson 12	Lesson 13	Lesson 14	Lesson 15
Lesson 16	Lesson 17	Lesson 18	Lesson 19	Lesson 20	Lesson 21	Lesson 22	Lesson 23
Lesson 24	Lesson 25	Lesson 26	Lesson 27	Lesson 28	Lesson 29	Lesson 30	Lesson 31
Lesson 32	Lesson 33	Lesson 34	Lesson 35	Lesson 36	Lesson 37	Lesson 38	Lesson 39
Lesson 40	Lesson 41	Lesson 42	Lesson 43	Lesson 44	Lesson 45	Lesson 46	Lesson 47
Lesson 48	Lesson 49	Lesson 50	Lesson 51	Lesson 52	Lesson 53	Lesson 54

Top
Lesson 19 Js 基本語法

Javascript 是實現網頁動態的基石, 可被應用到各個領域
如網頁遊戲、地圖搜索(google,baidu)、股市訊息查詢、web聊天 也是 ajax/jquery/extjs 等框架的基礎。
 js檔案不能獨立使用需與 html 等配合使用 。
大部份皆由java script 由瀏覽器執行 (js 引擎執行)
我們可在 w3cschool 中學習相關資訊
  http://www.w3schools.com/js/default.asp
 js 是物件導向
其放置位置, 可置於 head、body、或 html 之後
EX1 出現對話框
一. 置於 head 內

執行結果出現對話框, 按下確定後, 再往下執行

二. 於 body 中,

也產生同樣的結果

若有多個要執行, 需用 script language="javascript" 包覆起來
多段執行, 會依序執行。

執行時, 首先出現第一個對話框, 按下確定後

再往下執行。

EX2 運算程序
var : 變量, 在js中, 它的類型由 js 引擎決定。
window.alert()
在 W3CSCHOOL 中使用 JavaScript Reference
http://www.w3schools.com/jsref/obj_window.asp

顯示訊息和一個確認鈕的警告框
js 注意事項 (40min)
1. 標示符號不可用保留字
2. 大小寫為不同符號
3. 以分號 ; 區隔各執行語句, 每個詞用空格, 大括號, 小括號等分隔開
4. 單行註解 //  多行註解 /* xxxxx */

Top
Lesson 20 基本數據類型


var 是可變化的
typeof : 可以用來測試某資料的型態，會傳回型態的字串描述。
http://www.w3schools.com/js/js_typeof.asp
You can use the JavaScript typeof operator to find the type of a JavaScript variable.

EX; js 是動態語言, 類型隨時可變化

執行時, 首先 因 v1=  abc , 顯示 type 為 string

按下確定, 向下執行時, v2 =  456 , 顯示 v2 type 為 number

按下確定, 向下執行時,  v1 值修改為  123 , 顯示 type 為 number

未給 var 值時,

 會彈出 undefine 對話框

對於 js 的資料型態, 可以參考下方連結, 有很清楚說明

http://www.codedata.com.tw/javascript/essential-javascript-data-type/ 

在 JavaScript 中，字串是基本資料型態，可使用單引號或雙引號來包括一串文字，用以表示字串。JavaScript 中沒有字元型態，以單引號或雙引號來包括單一字元，就是字串型態。

數值時要使用數值實字（Number literal），

預設是十進位整數，用 0 開頭表示八進位整數，用 0x 開頭表示十六進位整數。

特殊值

數值有幾個特殊值，

1. NaN 不等於任何值，Not a Number。

2. Infinity : 表示無限大，

數據類型轉換 parseInt 

EX: (% 用於整數取餘數)

a++ 同義於 a=a+1

a--   同義於 a=a-1

b=++a; 同義於 b=a+1; b=a;

b=a++; 同義於 b=a; a=a+1

a+=90; 同義於  a=a+90;

Top
Lesson 21 js 運算符 2
介紹  window.prompt  document.writeln

window.prompt :  Prompt 是提示輸入, 這類對話盒是用來提示觀看者輸入一些資料

參考連結: 

http://www.takka.com.hk/jstutor/ch3/ch3.htm

document.writeln :

parseFloat : 將字串轉為數值

邏輯運算符  && and   || 或    !非

Top
Lesson 22 基本語法 - 三大流程控制
一. 順序控制 - 不控制流程, 依順序執行。
二. 分支控制 - 程序有選擇的執行。
  2.1 單分支 - if  (條件) {執行語句}
  2.2 雙分支 - if  (條件表達式) {} else {}
  2.3 多分支 - if  (條件表達式) {} else if  (條件表達式) {}
                                                        else if  (條件表達式) {}....
                     - 表達式 swith (表達式)
                               case 常量1: 執行語句;
                                break;
                               case 常量2: 執行語句;
                                break;
                               default:...

             
Top
Lesson 23 基本語法 - 三大流程控制2
三. 循環分支 -
3.1 for 循環
     for (起始值, 條件; xx) {語句}
   EX:

3.2 while 循環

    while(條件表達式){執行語句}

3.3 do while  (先執行, 再判斷)
練習: 計算  1+2+3.....+n 之值

js 學習中可以善用 開發人員工具
http://emn178.pixnet.net/blog/post/94152426-%E7%B6%B2%E9%A0%81%E9%96%8B%E7%99%BC%E4%BA%BA%E5%93%A1%E5%B7%A5%E5%85%B7

Top
Lesson 24 js 案例和自定函數

常在程式碼中看到, 已有 language , 又寫上 type

這是預防相容性問題, 有的瀏覽器只認識 type   ↓

另外也常見 <!-- 和 //--> 也是用在相容性, 避免誤認語法為顯示文字。

EX:

自訂函數 - 將上方轉成函數

函數就是包裹在花括號中的代碼塊，前面使用了關鍵詞function：

function functionname()

{  這裡是要執行的代碼  }

下方修改為    ↓

其它文件有需求時, 可以將函數單獨寫到 js, 引入需要的文件中

 獨立下方文件為   myfuns.js

有需求的文件, 以 src 引入 ( line 3)

Top
Lesson 25 js 系統函數 js函數調用方式
系統函數可參考 w3cschool
http://www.w3school.com.cn/jsref/jsref_obj_global.asp

Top
Lesson 26
Top
Lesson 27
Top
Lesson 28
Top
Lesson 29