認識ECMA Script
ECMAscript 是語法的標準,而 JavaScript 是語言本身;或說 ECMAscript 是一個程式語言,而 JavaScript 則是其所延伸的軟體工具。目前這兩種說法較為普及。
我覺得有Javascript與ECMAScipt之間一個很重要的差別
除了腳色不太一樣之外(也就是David所說 規範與軟體工具)
還有就是Javascript有ECMAScript沒有的東西,BOM跟DOM
參考
console.log(“Hello World”)
console.log是開發JS語言的重要工具,這個log不會顯示在網頁上
可以利用chrom的開發人員工具中的console讀取
譬如說你不知道這個element是啥
就把他丟進去console.log去讀取
註解方式
// 這是單行註解 (Comment),不會加入執行程式碼,只為輔助閱讀。
/*
這是多行註解,可以用多行註解寫較完整的描述。
在這份檔案裡,會介紹註解、變數、數學運算、邏輯判斷等。
*/
變數型態與宣告
宣告變數的方式是var
變數的種類主要有三種:數值、字串與布林值
有幾個東西要注意
第一個是undefined,宣告變數之後沒有給值就是預設undefined
第二個是null,變數不參考到其他變數時使用,要直接指定(var y=null;)
第三個是NaN
可以使用語法typeof 查詢物件的型態
參考
http://www.codedata.com.tw/javascript/essential-javascript-data-type/
另外 JS的變數也不一定要使用var宣告
但使用上會有些微差異,此外 AC也建議每個變數都var宣告
若不宣告會占用較多記憶體,拖慢網頁瀏覽速度
http://www.codedata.com.tw/javascript/essential-javascript-variable/
弱型態轉換
JS屬於偏向弱型態,意思是不同變數型態有時可以自動轉換
var result = '3' - '2';
console.log(result); // 1
console.log(typeof result); // number
對或錯(True & False)
在 JavaScript 中若結合布林值作 +、-、*、/ 等運算,true 會被當作 1,而 false 會被當作 0。例如:
1 + true; //2
1 + false; //1
在JS中,除了 0、NaN、’’、null、undefinied 是假的(false)之外,其他都是真的(true)。
參考
http://www.codedata.com.tw/javascript/essential-javascript-4-weak-type-wat/
數學運算子
- 加法運算符號 +
- 減法運算符號 -
- 乘法運算符號 *
- 除法運算符號 /
- 餘數運算符號 %
比較運算子
- ==
- >=
- <=
- >
- <
- !=
補充: 嚴格比較符號===,用於比較左右兩邊的數值和變數種類
邏輯運算子
- &&:AND
- ||:OR
- !:NOT
補充:
使用 NOT 反轉布林值和進行反向判斷
!符號的常見用法:
- 把布林值反轉:false 會變成 true,true 會變成 false。
- 進行反向判斷:在控制流程時,因 if 只有在 true 時才能執行對應的程式碼,因此可以用 NOT 可以進行反向判斷,透過 NOT 把 false 變成 true,達到反向判斷的效果。
Array 和 Map結構
相信大家都對Array跟Hash不陌生
直接放語法了(特別注意符號的使用方式,例如()、[]、{})
Array的部分~
push用來加入資料、concat帶入合併的陣列
var names = ["Arch", "Bernard", "Ellen"];names.push("Claire");
console.log(names); // ["Arch", "Bernard", "Ellen", "Claire"]var admins = ["Sali", "Lilian"];
var alphacamp = names.concat(admins);
console.log(alphacamp); // ["Arch", "Bernard", "Ellen", "Claire", "Sali", "Lilian"]
另外,"Splice"可以插入、刪除
根據帶入的資料,會有三種用法:
— splice(1):從 index 1 開始刪除,會刪除 index 1 和之後所有陣列內
— splice(2, 2):從 index 2 開始刪除 2 個陣列的內容
— splice(2, 2, “Data”):從 index 2 開始刪除 2 個陣列內容,並把 Data 插入 index 2
Map的部分~
set加入資料、get取出資料、delete刪除資料
var map = new Map();
map.set("name", "Arch");
var name = map.get("name");
console.log(name); // Archmap.delete("name"); //delete會直接刪除整組
//使用 Map 的 size 方法取得 Map 裡 key 和 value 的數量
console.log(map.size); // 0
補充Array與Map的用法
Array常用的 參考上述
特別注意到array有map這個用法,但是跟map結構沒有關係
.include(value) 查詢陣列是否包含value,返回布林值
.sort() 排序字串,請特別注意排序數字時的情況
參考下列連結
.find() 也會用於查詢,但是使用上比較麻煩一點
要配合function使用,僅回傳第一個符合條件的值
var array1 = [5, 12, 8, 130, 44];var found = array1.find(function(element) {
return element > 10;
});console.log(found);
// expected output: 12
JavaScript 裡陣列(Array)中的 .map() 和 .reduce()
有點複雜...先留著 希望以後用得上
Map常用的~
參考下面連結
.clear() 直接清空
.has(key) 查詢是否有這個key並返回布林值
弄完基礎中的基礎了
我覺得難的是function與class
下篇再整理,這篇先這樣