js初識＋簡單案例

表單提交的缺點:
(1) 表單提交默認跳轉
(2) 資料傳輸程序中 網速較慢時 用戶體驗極差
(3) 無法判斷提交的資料格式是否正確
所以js最初是用來做提交驗證的

十天成型 (JS弱型別的語言)

JavaScript 是一種直譯型，弱型別的腳本語言，它是一個輕量級，但功能強大的編程語言，js需要靠事件驅動，依靠其他語言，js必須在html中被參考

弱：
1.變數在宣告的時候不區分資料型別
2.數字不分整型和浮點型
3.undefined在其他語言不存在，變數一般要求宣告即賦值
4.結尾可以不寫分號

JavaScript 控制了網頁的行為

JS組成：
ECMAScript 基礎語法,語法規范 1.0 2.0 3.0 5.0 6.0(ES6)
BOM Browser Object Model瀏覽器物件模型，提供與瀏覽器互動的方法和介面
DOM Document Object Model檔案物件模型，提供訪問和操作網頁內容的方法和介面

js的三種引入方式👇
1.外部js，
注意：script標簽做引入作用時，里面寫東西不執行；
2.行內js，
3.內部js，

JavaScript 可以通過不同的方式來輸出資料：
使用 document.write() 方法將內容寫到 HTML 檔案中，
使用 window.alert() 彈出警告框，
使用 console.log() 寫入到瀏覽器的控制臺，
使用 innerHTML 寫入到 HTML 元素，

JS的三種列印方法(完成某個特定功能的工具)
1.彈窗列印
alert(‘xxxx’);需要用戶確認
prompt("");
confirm("");
2.頁面列印
document.write(‘xxxxx’);可以在頁面(檔案)中寫入一段內容
document.write也可以識別標簽，
3.控制臺console列印
console.log(); console.info();console.table()等等

注意👇
document.write(hello);
報錯 ReferenceError: hello is not defined
在JS中單詞都要有一定的代表意義 (a.官方給定的 b.用戶自定義的), 否則會報錯
用法👇
document.write(“hello”);字串(描述一段文本)
document.write(“

hello

	console.log()  在控制臺列印一段內容(不會影響原頁面)
	console.log("hello JS");
	console.log(100);
	console.log(true);
	
	alert()   警告框  彈出框
	alert("hello world");
	alert(100);

document.write中可以列印html結構，如果原樣輸出需要轉碼
&nbsp；一個英文大大小的空格
&emsp；全角空格
&ensp；半角空格
&copy；著作權
&lt；<
> >

變數：存盤資料的容器，方便后續繼續使用

方法1.先宣告再賦值（此寫法只有js支持）
方法2.宣告的同時賦值
方法3.一次宣告多個變數并賦值

變數命名規范
(1) 由數字 大小寫字母 _ 組 成 , 但 是 不 能 以 數 字 開 頭 ( 2 ) 不 能 包 含 空 格 中 文 和 特 殊 字 符 ( 3 ) 不 能 使 用 關 鍵 字 ( 在 j s 中 已 經 有 特 殊 意 義 ) 和 保 留 字 ( 現 在 沒 有 任 何 用 途 , 將 來 可 能 被 用 作 關 鍵 字 ) ( 4 ) 嚴 格 區 分 大 小 寫 ( a 和 A 是 兩 個 不 同 的 變 量 ) ( 5 ) 駝 峰 式 命 名 法 小 駝 峰 t o d a y I s M o n d a y 大 駝 峰 T o d a y I s M o n d a y （ 建 議 ： 語 義 化 命 名 、 最 好 不 要 用 拼 音 、 駝 峰 命 名 或 下 劃 線 、 組成,但是不能以數字開頭 (2) 不能包含空格 中文 和特殊字符 (3) 不能使用關鍵字(在js中已經有特殊意義)和保留字(現在沒有任何用途,將來可能被用作關鍵字) (4) 嚴格區分大小寫 (a和A是兩個不同的變數) (5) 駝峰式命名法 小駝峰todayIsMonday 大駝峰TodayIsMonday （建議：語意化命名、最好不要用拼音、駝峰命名或下劃線、 組成,但是不能以數字開頭(2)不能包含空格中文和特殊字符(3)不能使用關鍵字(在js中已經有特殊意義)和保留字(現在沒有任何用途,將來可能被用作關鍵字)(4)嚴格區分大小寫(a和A是兩個不同的變量)(5)駝峰式命名法小駝峰todayIsMonday大駝峰TodayIsMonday（建議：語義化命名、最好不要用拼音、駝峰命名或下劃線、不要多用）

如何交換兩個變數的值
1.使用第三方進行交換

JS資料的型別
1.字串（string）：雙引號或單引號包起來
2.數字（number）
3.布林值（boolean）：表對錯（true、false）
4.null（空物件）：宣告變數不賦值，就需要給null，但型別是object；獲取元素獲取不到也會回傳null
5.undefined：宣告變數不賦值，也不給空值就是undefined a.默認值也是undefined
6.陣列（array）
7.物件object**

js中的兩個特殊值
NaN Infinity JS中的兩個特殊值(number)
1.NaN 非數字(not a number)
var a = “1a”;
var b = 2;
var c = a*b;
console.log(c,typeof NaN); // NaN
2.Infinity 無窮；無限大；無限距
console.log(-1/0,typeof Infinity);

判斷資料型別typeof

算數運算子
＋ - * / %

自增++和自減–
++a 加后取值，先執行加法運算,再取值
var a = 10；
console.log(++a);//11
console.log(a);//11
a++ 加前取值 ,先取值,再執行加法運算
var a = 10；
console.log(a++);//10
console.log(a);//11
–a, a–

案例：輸入框思路👇
1.獲取物件
2.系結點擊事件
2.1獲取輸入框的值
2.2把值轉為數字
2.3進行計算
2.4把計算結果放入結果框