前端三層
- HTML 結(jié)構(gòu)層
- CSS 樣式層
- JS 行為層
JS是什么
- 是一種運(yùn)行在客戶端的腳本語言疏日，最早是在HTML網(wǎng)頁上使用，用來給HTML增加動(dòng)態(tài)功能。
- 瀏覽器就是一種運(yùn)行JS腳本語言的客戶端平委，JS的解釋器被稱為JS引擎间唉，為瀏覽器的一部分。
JS組成
ECMAScript + DOM(文檔對(duì)象模型) + BOM(瀏覽器對(duì)象模型)
JS注釋
/*塊級(jí)注釋*/
//單行注釋
數(shù)據(jù)類型
字面量
- 是用于表達(dá)一個(gè)固定值的表示法唱蒸，又叫常量
- 字面就是所見即所得，js程序執(zhí)行到代碼中的字面量灸叼，會(huì)立即知道它是什么類型的數(shù)據(jù)神汹，值是多少。
- 可以用于表示固定值古今，比如：數(shù)字屁魏、字符串、undefined捉腥、布爾類型的字面值等氓拼。
eg：
- 數(shù)值字面量：8,9,10
- 字符串字面量："大前端"
- 布爾字面量：true, false
數(shù)字字面量
- 這里的數(shù)字就是數(shù)學(xué)意義上的數(shù)字
- 數(shù)字字面量區(qū)分：整數(shù)字面量、浮點(diǎn)數(shù)字面量抵碟、特殊值
- 書寫時(shí)直接書寫字面量桃漾，不需要添加任何輔助符號(hào)
整數(shù)字面量
- 整數(shù)字面量寫法分進(jìn)制
- 整數(shù)可以被表示成十進(jìn)制（基數(shù)為10）、八進(jìn)制（8）以及十六進(jìn)制
- 十進(jìn)制最基本拟逮，可以直接在代碼里輸入
- 八進(jìn)制字面值必須帶前導(dǎo)0撬统、0O、0o敦迄。八進(jìn)制整數(shù)只能包括數(shù)字0-7
- 十六進(jìn)制的前綴是0x或0X恋追。后面可以有數(shù)字和字母a～f
- 在進(jìn)行算數(shù)計(jì)算時(shí)或者參與程序，所有八進(jìn)制和十六進(jìn)制的數(shù)字都會(huì)被轉(zhuǎn)換成十進(jìn)制
浮點(diǎn)字面量
- 就是小數(shù)
- 不區(qū)分進(jìn)制
- 如果浮點(diǎn)數(shù)是大于0小于1的罚屋，可以忽略小數(shù)點(diǎn)前面的0不寫
//科學(xué)計(jì)數(shù)法
console.log(1.2e10)
Infinity無窮
- 由于計(jì)算機(jī)能力有限苦囱，如果高于最大計(jì)算值直接顯示為正無窮Infinity，如果低于最小顯示-Infinity
-
Infinity本身就是一個(gè)數(shù)字
image.png
NaN
- not a number 表示不是一個(gè)正常的數(shù)
- NaN與任何值都不相等脾猛，包括它本身
- isNaN():判斷一個(gè)數(shù)據(jù)是不是NaN
字符串字面量
- 字符串是由任意個(gè)數(shù)的有序或無序的字符組成的串撕彤，類似人類的語言，在JS中有自己特殊的寫法
- 組成： 字母尖滚、漢字喉刘、特殊符號(hào)、空白等
- 寫法：用單引號(hào)或雙引號(hào)內(nèi)的字符構(gòu)成漆弄，可以是沒有字符的空字符串
- 注意：字符串中如果字符包含了雙引號(hào)睦裳，則其外部應(yīng)該由單引號(hào)表示，反之相同
*轉(zhuǎn)義符號(hào)*
- 字符串中撼唾，有一些特殊功能的字符不能直接書寫廉邑，還有一些特殊效果不能直接書寫。
- 這時(shí)，可以使用轉(zhuǎn)義符號(hào)\對(duì)這些字符進(jìn)行轉(zhuǎn)義
- 在字符串中可以使用轉(zhuǎn)義字符加普通字母蛛蒙，替代一些特殊字符
\n 換行
\t Tab制表 - 字符串中可以使用轉(zhuǎn)義符號(hào)講特殊功能字符變成普通符號(hào)
'單引號(hào)
"雙引號(hào)
\反斜杠
變量
- 是計(jì)算機(jī)內(nèi)存中存儲(chǔ)數(shù)據(jù)的標(biāo)識(shí)符糙箍，根據(jù)變量名稱可以獲取到內(nèi)存中儲(chǔ)存的數(shù)據(jù)
- 變量相當(dāng)于一個(gè)容器，內(nèi)部可以存儲(chǔ)任意類型的數(shù)據(jù)牵祟，使用變量時(shí)深夯，用的是內(nèi)部存儲(chǔ)的數(shù)據(jù)
變量聲明
- 變量聲明又叫做定義變量、創(chuàng)建變量
- 變量在使用前诺苹，必須先有定義咕晋，如果沒有定義，會(huì)出現(xiàn)引用錯(cuò)誤
- 定義方法：使用一個(gè)var的關(guān)鍵字進(jìn)行定義收奔，后面必須加一個(gè)空格掌呜，空格后面自定義變量名。
建議使用駝峰命名法
變量賦值
- 變量定義后坪哄，初始沒有進(jìn)行賦值质蕉，內(nèi)部有一個(gè)默認(rèn)的值叫undefined
- 變量賦值的方式：通過等號(hào) = 賦值，等號(hào)右邊的值賦值給左邊的變量
- 注意：書寫時(shí)翩肌，等號(hào) = 兩側(cè)習(xí)慣書寫一個(gè)空格
// 變量定義
var a;
// 變量賦值
a = 3;
// 變量調(diào)用
console.log(a);
一個(gè)var關(guān)鍵字可以同時(shí)定義多個(gè)變量
var a = 1,b = 2,c = 3;
數(shù)據(jù)類型
- Number 數(shù)字類型
- String 字符串類型
- undefined undefined類型
- Boolean 布爾類型
- null null類型
- Object 對(duì)象類型
Null
- null本身是一個(gè)數(shù)據(jù)
- 從邏輯角度模暗，null值表示一個(gè)空對(duì)象指針
- 如果定義的變量準(zhǔn)備在將來用于保存對(duì)象，最好將該變量初始化為null
檢測數(shù)據(jù)類型
- 使用typeof()進(jìn)行檢測
數(shù)據(jù)類型轉(zhuǎn)換
字符串
- toString()方法
- String()方法 比如：undefined和null
+ 號(hào)拼接字符的方法
數(shù)值類型
- Number()方法
字符串：純數(shù)字字符串轉(zhuǎn)為對(duì)應(yīng)數(shù)字念祭，空字符串和空白字符串轉(zhuǎn)為0汰蓉，非空非純數(shù)字字符串轉(zhuǎn)為NaN。
布爾值：true轉(zhuǎn)為1棒卷，false轉(zhuǎn)為0
undefined：轉(zhuǎn)為NaN
null：轉(zhuǎn)為0 - parseInt()方法：字符串轉(zhuǎn)整數(shù)方法
作用：第一，對(duì)浮點(diǎn)數(shù)進(jìn)行取整操作祝钢；第二比规，將字符串轉(zhuǎn)為整數(shù)數(shù)字。
1 對(duì)數(shù)字取整功能拦英，直接舍棄小數(shù)部分蜒什，只保留整數(shù)
2 將字符串轉(zhuǎn)為整數(shù)數(shù)字，也包含取整功能
字符串中疤估，必須是純數(shù)字字符串或者數(shù)字字符串開頭的字符串灾常，才能轉(zhuǎn)換為正常數(shù)字，且只取整數(shù)部分铃拇，如果不是數(shù)字打頭的字符串钞瀑，會(huì)轉(zhuǎn)換為NaN - parseFloat()方法：字符串轉(zhuǎn)浮點(diǎn)數(shù)方法
作用：將字符串轉(zhuǎn)為浮點(diǎn)數(shù)數(shù)字
要求：滿足浮點(diǎn)數(shù)數(shù)字字符必須在字符串開始，如果不在開始返回值都是NaN
布爾類型
- Boolean()方法
false: NaN慷荔、0雕什、“”空字符串、null、undefined
true: 非0非NaN數(shù)字贷岸、非空字符串
比較運(yùn)算符
- 字符串與字符串比較
- 不會(huì)發(fā)生隱式轉(zhuǎn)換：從前往后0-9壹士，A-Z，a-z偿警，前面的小于后面的
- 比較時(shí)躏救，不關(guān)心兩個(gè)字符串的長度，從第一個(gè)字符開始比較螟蒸，依次往后順延比較盒使，知道比出大小，就不再往后比較
邏輯運(yùn)算符
- 邏輯運(yùn)算符常用于布爾類型值之間尿庐；當(dāng)操作數(shù)都是布爾值時(shí)忠怖，返回值也是布爾值。
&& 邏輯與運(yùn)算符 且
|| 邏輯或運(yùn)算符
抄瑟！ 邏輯非運(yùn)算符
隱式轉(zhuǎn)換為布爾值的規(guī)律
- (邏輯與 a&&b) 如果a能被轉(zhuǎn)換為false凡泣，那么返回a；否則皮假，返回b
- (邏輯或 a||b) 如果a能被轉(zhuǎn)換為true鞋拟，那么返回a；否則惹资，返回b
綜合運(yùn)算順序：非贺纲、與、或
運(yùn)算優(yōu)先級(jí)
1 ()
2 一元運(yùn)算符
3 算數(shù)運(yùn)算符
4 關(guān)系運(yùn)算
5 相等運(yùn)算符
6 邏輯運(yùn)算符 先&&再|(zhì)|
7 賦值運(yùn)算符
流程控制語句
IF語句
- if語句是最常用的條件分支語句褪测，作用就是通過某個(gè)指定的判斷條件猴誊，決定走哪個(gè)分支的代碼
if (condition expression) {
statement1
} else {
statement2
}
- condition expression : 條件表達(dá)式，可以是任意代碼或者表達(dá)式侮措，參與程序過程都會(huì)強(qiáng)制得到一個(gè)布爾值執(zhí)行結(jié)果懈叹。表達(dá)式，js中遇到任何表達(dá)式都會(huì)先計(jì)算出一個(gè)結(jié)果才能繼續(xù)參與程序
- statement：結(jié)構(gòu)體分扎，js中可以用{}包括一行到多行語句澄成，這些語句整體組成了一個(gè)結(jié)構(gòu)體，結(jié)構(gòu)體中的語句要執(zhí)行就都執(zhí)行畏吓，要不執(zhí)行就都不執(zhí)行
if注意事項(xiàng)
- 如果statement 單行墨状，可以省略大括號(hào)不寫
- if語句可以不寫else分支，表示條件成立就執(zhí)行后面的結(jié)構(gòu)體菲饼，如果條件不成立肾砂，直接跳出if語句不執(zhí)行
- if語句可以實(shí)現(xiàn)選擇功能，兩個(gè)分支可以選擇一個(gè)執(zhí)行宏悦，不會(huì)都執(zhí)行
- if語句能夠控制自己內(nèi)部的流程通今， 但是不論走哪個(gè)分支粥谬，結(jié)束后都要繼續(xù)執(zhí)行if語句后面的其他語句，叫做殊途同歸現(xiàn)象
三元表達(dá)式
- 又叫三元運(yùn)算符辫塌，必須有三個(gè)操作數(shù)參與的運(yùn)算
- 操作符號(hào)：?:
- 表達(dá)式：在參與js程序時(shí)漏策，都必須先計(jì)算出表達(dá)式結(jié)果，才能參與后續(xù)程序
- 由于三元表達(dá)式具備了一些選擇的效果臼氨，所以也是一種條件分支語句
語法
- boolean_expression ? true_value : fasle_value;
- boolean_expression：布爾表達(dá)式
- true_value：布爾表達(dá)式的值為真時(shí)掺喻，三元表達(dá)式的結(jié)果
- fasle_value：布爾表達(dá)式的值為假時(shí)，三元表達(dá)式的結(jié)果
- 作用：根據(jù)布爾表達(dá)式的記過储矩，如果為真感耙，三元表達(dá)式結(jié)果就是真值，如果為假持隧，三元表達(dá)式結(jié)果就是假值
switch
語法
switch () {
case 值1:
結(jié)構(gòu)體1;
break;
case 值2:
結(jié)構(gòu)體1;
break;
default:
結(jié)構(gòu)體n;
break;
}
- switch：關(guān)鍵字表示開始進(jìn)入一個(gè)開關(guān)語句
- 表達(dá)式：會(huì)求出一個(gè)具體的值即硼，將這個(gè)值去與{}內(nèi)部的case后面的值進(jìn)行對(duì)比、匹配屡拨，如果值相等表示匹配成功只酥。匹配相等時(shí)，方式是進(jìn)行全等于匹配呀狼，不止值要相等裂允，數(shù)據(jù)類型也要相等
- case：示例的意思，作為關(guān)鍵字后面必須跟一個(gè)空格哥艇，書寫匹配的值
- case后面的結(jié)構(gòu)體：每個(gè)case匹配成功之后要執(zhí)行的語句
- break：用于打斷結(jié)構(gòu)體绝编，直接跳出程序
- default：相當(dāng)于if語句中的else，否則的情況貌踏，如果前面的case都不匹配十饥，執(zhí)行default后面的語句
for
for (;;) {
}
do while
- do while循環(huán)是一種后測試循環(huán)語句，會(huì)先執(zhí)行一次結(jié)構(gòu)體祖乳，執(zhí)行完后才會(huì)去判斷入口條件绷跑，如果條件為真能夠繼續(xù)下一次循環(huán)，如果條件為假跳出循環(huán)凡资。
do{
結(jié)構(gòu)體;
}while(條件表達(dá)式);
while循環(huán)
- while循環(huán)是一種前測試循環(huán)語句，在執(zhí)行循環(huán)體之前都要測試入口條件谬运，條件為真繼續(xù)執(zhí)行隙赁，條件為假直接跳出循環(huán)
- 語法
while(條件表達(dá)式){
循環(huán)體;
}
- 當(dāng)條件表達(dá)式為真時(shí)，執(zhí)行循環(huán)體梆暖，如果為假伞访，跳出循環(huán)
break
- break如果沒有特殊指示，只能停止自己所在的那一層循環(huán)轰驳，并不能終止外部循環(huán)
- 如果想停止外層循環(huán)厚掷，可以給外層循環(huán)添加一個(gè)標(biāo)簽名label弟灼，在內(nèi)層循環(huán)的break關(guān)鍵字后面空格加一個(gè)label名。
