前端基本功—js 第1天
[if !supportLists]1.1[endif]課程介紹
前6天js的基礎(chǔ)語法(變量膝昆，表達(dá)式以清，運(yùn)算符泡躯，分支語句贮竟，數(shù)組丽焊，函數(shù)，對(duì)象)
后7天DOMAPI
后5天js高級(jí)
jQuery基本使用及小項(xiàng)目
[if !supportLists]1.2[endif]瀏覽的介紹
五大瀏覽器：谷歌火狐IE歐朋safari
國內(nèi)的瀏覽器：360坝锰，百度粹懒，搜狗，獵豹顷级，遨游
[if !supportLists]1.3[endif]瀏覽器的運(yùn)行原理
1凫乖、User Interface用戶界面，我們所看到的瀏覽器
2弓颈、Browser engine瀏覽器引擎帽芽，用來查詢和操作渲染引擎
3、Rendering engine用來顯示請(qǐng)求的內(nèi)容翔冀，負(fù)責(zé)解析HTML导街、CSS
4、Networking網(wǎng)絡(luò)纤子，負(fù)責(zé)發(fā)送網(wǎng)絡(luò)請(qǐng)求
5磷箕、JavaScript Interpreter(解析者) ??JavaScript解析器，負(fù)責(zé)執(zhí)行JavaScript的代碼
6谱醇、UI Backend ??UI后端戳杀，用來繪制類似組合框和彈出窗口
7、Data Persistence(持久化)數(shù)據(jù)持久化卡乾，數(shù)據(jù)存儲(chǔ)cookie,HTML5中的sessionStorage
[if !supportLists]1.4[endif]Js的發(fā)展歷史
1995的時(shí)候誕生的liveScript ?java ??javascript
微軟Jscript在自己的系統(tǒng) 內(nèi)部的瀏覽器里面翼悴，內(nèi)置了jscript
1997 ??js的規(guī)范提出了ECMA
2003年之前js的地位很低
2004的時(shí)候ajax的出現(xiàn)讓js的地位發(fā)生了翻天覆地的變化
2007年的時(shí)候iphone的出現(xiàn)，讓js的市場(chǎng)地位又水漲船高
2010年的時(shí)候H5 ??canvas的實(shí)現(xiàn)也需要js
2011年的時(shí)候node.js伸向了服務(wù)器端
Js的書寫位置
行內(nèi)式寫在html標(biāo)簽內(nèi)
內(nèi)嵌式寫在頁面的script標(biāo)簽間
? ?外鏈?zhǔn)綄懺谝粋€(gè)單獨(dú)的js文件中幔妨，然后引入進(jìn)來
使用內(nèi)嵌的話推薦寫在html標(biāo)簽的最后
Js的兩個(gè)網(wǎng)站
http://www.webhek.com/
Js的組成
ECMA(歐洲計(jì)算機(jī)制造商協(xié)會(huì))規(guī)定了js的組成
ECMAScriptjs的基礎(chǔ)語法
DOM文檔對(duì)象模型
BOM瀏覽對(duì)象模型
Js的語言特性
JavaScript是世界上用的最多的腳本語言
腳本語言：不需要編譯鹦赎，只有運(yùn)行時(shí)邊解析邊執(zhí)行的語言
JavaScript是一種客戶端的腳本語言
JavaScript是一種弱類型的動(dòng)態(tài)語言(動(dòng)態(tài)添加一些屬性或是方法)
動(dòng)態(tài)：可以隨時(shí)動(dòng)態(tài)的給對(duì)象添加屬性和方法
可以隨時(shí)的更改數(shù)組中的元素
直接量
直接量就是可以拿過來直接使用的數(shù)據(jù)值。
alert("這是一個(gè)彈出框的內(nèi)容");
變量
變量就是幫助我們往計(jì)算機(jī)中存儲(chǔ)數(shù)據(jù)用的误堡。
變量的命名規(guī)則
命名規(guī)則：
變量名必須以字母或下劃線“_”或$開頭,不能以數(shù)字開頭
變量可以包含數(shù)字(從A至Z的大小字母),下劃線或是$
JavaScript嚴(yán)格區(qū)分大小寫古话，computer和Computer是兩個(gè)完全不同的變量
建議：
變量的名稱要有意義
變量的命名遵守駝峰命名法，首字母小寫,第二個(gè)單詞的首字母大寫
例如：userName
取名的時(shí)候锁施，一定不能用系統(tǒng)中的保留字或是關(guān)鍵字
+的作用
varname =prompt("請(qǐng)輸入你的姓名");// ?console.log(name);alert("你好"+name);// +連接字符串和變量
[if !supportLists]1.[endif]連接字符串和變量+兩邊只要有一邊中是字符串陪踩，就是連接的作用
[if !supportLists]2.[endif]數(shù)學(xué)中的運(yùn)算+兩邊都是數(shù)字的話，則是數(shù)學(xué)中的運(yùn)算
轉(zhuǎn)義符
\+一個(gè)字符,組成轉(zhuǎn)譯字符.一般用于表示特殊符號(hào)
常用的轉(zhuǎn)譯符:\n(換行) \b(退格) \\ \t(縮進(jìn)) \”
typeof關(guān)鍵字用來檢測(cè)變量的數(shù)據(jù)類型
//js中所有變量的聲明都使用一個(gè)關(guān)鍵字var// js的特點(diǎn)沾谜，是弱類型的動(dòng)態(tài)語言//所謂的弱類型膊毁，就是js對(duì)變量里面存儲(chǔ)的數(shù)據(jù)類型要求不嚴(yán)格varname ="張三";varage =20;console.log(typeofname);console.log(typeofage);
Js中的數(shù)據(jù)類型
簡單(基本)數(shù)據(jù)類型：string ?number ?boolean ?undefined null
內(nèi)存中的棧空間中開辟內(nèi)存空間
復(fù)雜數(shù)據(jù)類型：對(duì)象object ?Array ?function ?Date ??Regexp
是在內(nèi)存中的堆空間中開辟內(nèi)存空間基跑。
變量的重新賦值
// ?var n1= 20; ?//變量的值傳遞// ?var n2 = n1; //是將自己內(nèi)存空間中的數(shù)據(jù)值婚温，復(fù)制一份存儲(chǔ)到變量當(dāng)中// ?console.log(n2);// ?var n3 = 50;// ?n3 = 80; //重新賦值為80，會(huì)將原來的數(shù)據(jù)給覆蓋掉媳否，內(nèi)內(nèi)存空間不變// ?console.log(n3);varstr ="文字1";str ="文字2";console.log(str);//因?yàn)樽址哂胁豢勺冃哉っ坏┞暶髁酥缶Ｇ兀臻g里面的值就不會(huì)變了
算術(shù)運(yùn)算符
//就是小學(xué)的數(shù)學(xué)運(yùn)算+ ???- ??* ??/%算術(shù)運(yùn)算符vara =10;varb =20;varc = a+b;console.log(c);
二元運(yùn)算符：+ ??- ??* ???/ ??%
一元運(yùn)算符：++ ????--
前加與后加的區(qū)別：
前加加的時(shí)候，是先將自身的值加1,然后拿著新值參與運(yùn)算力图，而后加加是先用原值參與運(yùn)算步绸，而后將自身的值再加1.
優(yōu)先級(jí)：一元運(yùn)行符的優(yōu)先級(jí)要高于二元運(yùn)算符
復(fù)合賦值運(yùn)算符
其實(shí)就是將算術(shù)運(yùn)算符和賦值運(yùn)算符(=)進(jìn)行一個(gè)合寫
+= ?-= ??*= ?/= ??%=
關(guān)系運(yùn)算符
就是用來比較兩者之間的一個(gè)關(guān)系
> ??< ???>= ??<= ?== ?!= ?=== ?!==
==:判斷兩者之間是否相等，只是判斷的值
===： 是判斷兩者類型是否一樣吃媒，再判斷值是否相等
關(guān)系運(yùn)算符的結(jié)果要用boolean類型來表示瓤介。
邏輯運(yùn)算符
邏輯運(yùn)算符：&& ???|| ????!
&&的兩邊的表達(dá)式，如果有一邊的表達(dá)式為假的話赘那，則整個(gè)表達(dá)式的結(jié)果就是false.
表達(dá)式1表達(dá)式2表達(dá)式1&&表達(dá)式2
TrueTrueTrue
TrueFalseFalse
FalseTruefalse
FalseFalsefalse
||如果||的兩邊有一個(gè)是true的話刑桑，則整個(gè)表達(dá)式的結(jié)果就是true
表達(dá)式1表達(dá)式2表達(dá)式1||表達(dá)式2
TrueTrueTrue
TrueFalseTrue
FalseTrueTrue
FalseFalsefalse
!原來為true！就變?yōu)閒alse ,原來 為false的話募舟，則取!之后就變成了true.
表達(dá)式祠斧！表達(dá)式
TrueFalse
Falsetrue
[if !supportLists]1.20[endif]運(yùn)算符的優(yōu)先級(jí)
優(yōu)先級(jí)從高到底
()優(yōu)先級(jí)最高
一元算術(shù)運(yùn)算符++ ??-- ??!
二元算數(shù)運(yùn)算符先* ?/ ?%后+ ??-
關(guān)系運(yùn)算符> ??>= ??< ??<=
關(guān)系(相等)運(yùn)算符== ??!= ???=== ???!==
邏輯運(yùn)算符先&&后||
賦值運(yùn)算符=
就是四部分：算術(shù)>關(guān)系>邏輯>賦值
數(shù)據(jù)類型轉(zhuǎn)換
將其它的數(shù)據(jù)類型轉(zhuǎn)換為number
隱式類型轉(zhuǎn)換：+ ?- ??* ??/ ?%
顯式(強(qiáng)制)類型轉(zhuǎn)換，使用函數(shù)拱礁。Number() ?parseInt() ?parseFloat()
NaN ?not a number不是一個(gè)數(shù)字琢锋，是屬于number類型，表示數(shù)字的一種不正常狀態(tài)呢灶，也就是說本來要轉(zhuǎn)換為number類型的值吴超，沒有轉(zhuǎn)換過來。
NaN是number類型not a number不是一個(gè)數(shù)字或者說是非數(shù)字 ?用來表示數(shù)值的一種不正常狀態(tài)填抬，是一個(gè)特殊的值
這個(gè)值用來表示一個(gè)本來要返回?cái)?shù)值的操作數(shù)未返回值的情況(這樣就不會(huì)報(bào)錯(cuò)了)
任何涉及NaN的操作都會(huì)返回NaN ??NaN與任何值都不相等烛芬，包括自己
isNaN()判斷值是否(不是數(shù)值),接收值后會(huì)嘗試將值轉(zhuǎn)換為數(shù)值隧期，不能轉(zhuǎn)換為NaN.
強(qiáng)制類型轉(zhuǎn)換之Number()
特點(diǎn)：
a.如果轉(zhuǎn)換的內(nèi)容可以轉(zhuǎn)成數(shù)字飒责，那么就直接返回這個(gè)內(nèi)容對(duì)應(yīng)的數(shù)字。
b.如果不可以轉(zhuǎn)換那么返回NaN.
c.如果在內(nèi)容中出現(xiàn)小數(shù)仆潮，那么小數(shù)會(huì)保留宏蛉。
d.如果內(nèi)容為空，那么轉(zhuǎn)換成0;
強(qiáng)制數(shù)據(jù)類型轉(zhuǎn)換之parseInt()的特點(diǎn)：
a.如果轉(zhuǎn)換的內(nèi)容可以轉(zhuǎn)成數(shù)字性置，那么就直接返回這個(gè)內(nèi)容對(duì)應(yīng)的數(shù)字拾并。
b.如果不可以轉(zhuǎn)換那么返回NaN.
c.如果帶有小數(shù)，那么會(huì)去掉小數(shù)鹏浅，而不是四舍五入嗅义。
d.如果第一個(gè)字符是數(shù)字，則繼續(xù)解析直至字符串解析完畢或者遇到一個(gè)非數(shù)字符號(hào)為止.
強(qiáng)制數(shù)據(jù)類型轉(zhuǎn)換之parseInt()：
a.特點(diǎn)與parseInt()幾乎一樣隐砸，不同點(diǎn)就是parseFloat()可以轉(zhuǎn)換小數(shù)部分
其它數(shù)據(jù)類型轉(zhuǎn)string
隱式類型轉(zhuǎn)換+””
顯式(強(qiáng)制)類型轉(zhuǎn)換.toString()
任何數(shù)據(jù)值都有toString()方法之碗，但是有特殊的兩個(gè)是沒有toString()方法的，是undefined和null ????String()
其它數(shù)據(jù)類型轉(zhuǎn)boolean類型
隱式類型轉(zhuǎn)換!!
顯式(強(qiáng)制)類型轉(zhuǎn)換Boolean()
Js中的語言結(jié)構(gòu)
順序結(jié)構(gòu)
分支結(jié)構(gòu)有條件的執(zhí)行if ??if-else
選擇結(jié)構(gòu)if else-if ???switch-case
循環(huán)結(jié)構(gòu)while ??do-while ??for ??for-in
If的用法
If(判斷條件){一般是boolean類型的值或是關(guān)系表達(dá)式或是邏輯表達(dá)式
要執(zhí)行的代碼;
}
執(zhí)行過程：
首先代碼運(yùn)行到if處的小括號(hào)處季希，判斷條件是否成立褪那，如果條件成立幽纷，也就是返回true,則進(jìn)入大括號(hào)里面，執(zhí)行里面的代碼博敬，如果判斷條件不成立友浸，也就是返回false,則跳過大括號(hào)，執(zhí)行后面的代碼偏窝。
If只能判斷執(zhí)行一種情況收恢，如果要判斷兩種情況，就得用if-else結(jié)構(gòu)
If-esle的用法
if(判斷條件){一般是boolean類型的值或是關(guān)系表達(dá)式或是邏輯表達(dá)式
要執(zhí)行的代碼;
}else {
要執(zhí)行的代碼
}
執(zhí)行過程：
首先代碼運(yùn)行到if處的小括號(hào)處祭往，判斷條件是否成立派诬，如果條件成立，也就是返回true,則進(jìn)入大括號(hào)里面链沼，執(zhí)行里面的代碼默赂，如果判斷條件不成立，也就是返回false,則執(zhí)行else大括號(hào)里面的代碼括勺，執(zhí)行完畢 跳出當(dāng)前結(jié)構(gòu)缆八。
If ?else-if結(jié)構(gòu)
if(判斷條件){一般是boolean類型的值或是關(guān)系表達(dá)式或是邏輯表達(dá)式
要執(zhí)行的代碼;
}else if(判斷條件){
要執(zhí)行的代碼;
}else if(判斷條件){
要執(zhí)行的代碼;
}else if(判斷條件){
要執(zhí)行的代碼;
}else {
要執(zhí)行的代碼;
}
執(zhí)行過程：
首先代碼運(yùn)行到if處的小括號(hào)處，判斷條件是否成立疾捍，如果條件成立奈辰，也就是返回true,則進(jìn)入大括號(hào)里面，執(zhí)行里面的代碼乱豆，如果條件不成立奖恰，則依次的進(jìn)行else if小括號(hào)里面，判斷條件是否成立宛裕，如果成立瑟啃，也就是返回true,則進(jìn)入對(duì)應(yīng)的else if里面的大括號(hào)，執(zhí)行里面的代碼揩尸，如果所有的條件都不成立蛹屿，也就是返回false，則要看是否有else,如果有岩榆，則進(jìn)入else里面错负，執(zhí)行代碼，如果沒有勇边，則跳出當(dāng)前結(jié)構(gòu)犹撒。
Switch-case結(jié)構(gòu)
Switch(值){變量的值或是數(shù)據(jù)值
case值1：
要執(zhí)行的代碼;
break;
case值2：
要執(zhí)行的代碼;
break;
case值3：
要執(zhí)行的代碼;
break;
case值4：
要執(zhí)行的代碼;
break;
...
default:
要執(zhí)行的代碼;
break;
}
執(zhí)行過程：
程序執(zhí)行到swtich處的小括號(hào)，先計(jì)算里面的值粒褒，拿著計(jì)算后的定值识颊，依次和case中的值進(jìn)行匹配，如果匹配成功怀浆，則執(zhí)行此case里面的代碼谊囚，執(zhí)行完畢之后怕享，遇到break,則跳出當(dāng)前結(jié)構(gòu)，如果匹配都不成功镰踏，則要看當(dāng)前結(jié)構(gòu)當(dāng)中有沒有default,如果有的話函筋，則進(jìn)入到dafault處執(zhí)行里面的代碼，如果沒有奠伪，則跳出當(dāng)前結(jié)構(gòu)跌帐，執(zhí)行后面的代碼。
If else-if與switch-case的區(qū)別
If ?else-if多用于區(qū)間的判斷
switch-case多用于定值的判斷
While循環(huán)
所謂的循環(huán)就是重復(fù)的做同一件事情绊率。
while(循環(huán)條件){一般是boolean類型的值或是關(guān)系表達(dá)式或是邏輯表達(dá)式
循環(huán)體(需要重復(fù)執(zhí)行的代碼);
}
執(zhí)行過程：
程序運(yùn)行到while處的小括號(hào)處谨敛，先判斷循環(huán)條件是否成立，如果成立滤否，也就是返回true脸狸，則進(jìn)行大括號(hào)執(zhí)行里面的循環(huán)體，執(zhí)行完畢之后藐俺，再次回到小括號(hào)處炊甲，判斷循環(huán)條件是否成立，如果成立欲芹，繼續(xù)執(zhí)行里面的代碼卿啡，如果不成立，則跳出當(dāng)前循環(huán)結(jié)構(gòu)菱父。只要是循環(huán)颈娜，總有一行碼可以改變循環(huán)條件，如果沒有改變循環(huán)條件的代碼浙宜，這樣的循環(huán)叫做死循環(huán)官辽。
