版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進(jìn)行舉報或認(rèn)領(lǐng)
文檔簡介
1、2015年6月份達(dá)內(nèi)web前端就業(yè)班培訓(xùn)JS部分前端三大基礎(chǔ)知識:HTML:專門編寫網(wǎng)頁內(nèi)容CSS:專門設(shè)計網(wǎng)頁樣式JavaScript:專門設(shè)計網(wǎng)頁交互的語言(9天)=Day1JavaScript:專門設(shè)計網(wǎng)頁交互的語言交互:輸入數(shù)據(jù),程序處理數(shù)據(jù),返回結(jié)果什么是JavasCript:1. 專門設(shè)計網(wǎng)頁交互的語言2. 運(yùn)行在javaScript解釋器中3. “解釋”執(zhí)行4. 互聯(lián)網(wǎng)第一大語言:JSerECMAScript標(biāo)準(zhǔn):JavaScript核心語法微軟:JscriptW3C:DOM標(biāo)準(zhǔn):專門操作HTML元素,CSS樣式,事件的統(tǒng)一標(biāo)準(zhǔn)!BOM:專門操作瀏覽器窗口的工具。沒標(biāo)準(zhǔn),由瀏覽器
2、廠商自行實現(xiàn)JavaScript=ECMAScript+DOM+BOMJSer最大挑戰(zhàn):瀏覽器兼容性問題JavaScript典型用途:1. 客戶端數(shù)據(jù)計算2. 客戶端表單驗證3. 動畫JavaScript特點(diǎn):純文本;解釋執(zhí)行;弱類型;基于對象如何使用:1. 使用瀏覽器自帶的js解釋器;F12- ->控制臺光標(biāo)處寫腳本代碼,回車執(zhí)行。Console:指代控制臺:專門調(diào)試程序輸出結(jié)果的窗口。log:控制臺console提示的一個功能:向控制臺輸入一行日志多行:shift+enterà換行*JavaScript中區(qū)分大小寫!*字符串單雙引號都行*2.單獨(dú)安裝專門解釋器軟件:node
3、.js Chrome V8Win鍵+Ràcmdànode退出:兩次ctrl+c執(zhí)行.js文件:1.先到cd到.js文件所在路徑 2.node文件名 回車3.隨網(wǎng)頁一同運(yùn)行:瀏覽器包含兩種工具:排版引擎:專門加載HTML內(nèi)容和css樣式解釋引擎:專門運(yùn)行Js腳本<script>中腳本塊何時運(yùn)行?隨網(wǎng)頁加載,解釋執(zhí)行<script>中都要用js語法!Html元素的事件屬性中:什么是事件?元素可以根據(jù)鼠標(biāo)或鍵盤的不同操作響應(yīng)不同的交互行為<html><head><title></title></head
4、><body><script> alert("hello from script");</script> <button onclick="alert('hello from onclick')">按鈕</button></body></html><script>解釋執(zhí)行,讀到才執(zhí)行。先讀到先執(zhí)行,后讀到后執(zhí)行。<script>放置的先后順序影響程序結(jié)構(gòu)。優(yōu)化:放在body后;待網(wǎng)頁全部加載完在實現(xiàn)功能,用戶體驗效果更佳。一次
5、定義,處處使用;一次修改,處處生效!解決:凡是重復(fù)編寫的代碼塊,都要封裝為一個方法:方法:執(zhí)行一個專門功能的一組代碼的序列。定義在<head>下的<script>中語法:function方法名()重用的代碼塊調(diào)用:方法名()à調(diào)用后立即執(zhí)行。*不調(diào)用不執(zhí)行*只要沒反應(yīng)或效果沒有出來就是出錯!àF12調(diào)試查看錯誤原因à定位錯誤位置!<script>腳本塊中的錯誤,僅影響“當(dāng)前腳本塊”中出錯位置之后的腳本執(zhí)行。不影響<script>之外的其他元素加載或腳本塊執(zhí)行。Function中的錯誤:只有調(diào)用方法時才觸發(fā)!頁面內(nèi)部腳
6、本塊問題:僅當(dāng)前頁面可用!解決:外部.js文件!什么是.js文件:專門保存js腳本源代碼的文件。源代碼都要放到j(luò)s解釋器才能執(zhí)行。如何使用.js文件?2 步:1.創(chuàng)建.js文件,編寫源代碼。2.在頁面中引入外部.js文件。ECMAScript(核心語法)*區(qū)分大小寫*字符串必須用引號(單雙都行)包裹*每條語句結(jié)尾都建議有分號*語句:讓程序可以做一件事的一行命令腳本塊:多行語句的序列程序:讓計算機(jī)模擬執(zhí)行人類的想法!注釋:不會被解釋執(zhí)行或顯示的代碼說明給程序員看的注釋也占網(wǎng)頁流量!生產(chǎn)環(huán)境必須去掉!提高加載速度。HTML注釋:<!->CSS注釋:/*/Js注釋:/單行注釋 /*多行注
7、釋*/*變量*什么是變量?內(nèi)存中專門存儲數(shù)據(jù)的空間程序都是在內(nèi)存中運(yùn)行任何程序包括三個部分:IPO: input process output 即:輸入數(shù)據(jù) 處理數(shù)據(jù) 輸出數(shù)據(jù)何時使用變量?只要在程序中臨時存儲數(shù)據(jù),都要放在變量中怎么使用變量?聲明,命名,初始化和使用聲明:在內(nèi)存中開辟一個存儲空間怎么聲明?var 變量名;賦值:將等號右邊的數(shù)據(jù),裝入等號左邊的變量中!如果未賦值:js默認(rèn)賦值為undefined命名規(guī)則:見名知意 保留字/關(guān)鍵字不能當(dāng)變量名保留字:js中已經(jīng)占用的特殊意義的關(guān)鍵字使用:使用變量名等效于直接使用變量中存儲的數(shù)據(jù)+:拼接多段文字為一句話!常量:一旦創(chuàng)建,值不可改變的
8、特殊變量如何使用常量:const 常量名=常量值;前后返回值一樣,因為PI是常量,沒法改變。強(qiáng)調(diào):只有等號可以向變量中存入新值。普通運(yùn)算不會改變變量的值。只是使用變量的值。只要帶var就是聲明,只要聲明就會開辟內(nèi)存空間呢。Js中新同名變量的空間會替換舊變量的空間。有幾個var,就會創(chuàng)建幾個存儲空間。數(shù)據(jù)類型:變量中存儲的數(shù)據(jù)的類型。Js是弱類型:變量本身沒有類型。只有變量中的值才有類型。一個變量,可以反復(fù)保存不同類型的數(shù)據(jù)為什么要有數(shù)據(jù)類型:現(xiàn)實中所有數(shù)據(jù)根據(jù)用途不同,都分為不同數(shù)據(jù)類型。原始類型:數(shù)據(jù)保存在變量本地!Number string Boolean undefined nullNu
9、mber類型:表示一切用于比較或數(shù)學(xué)計算的數(shù)字原始類型大?。篘umber:整數(shù)4字節(jié),浮點(diǎn)數(shù)8字節(jié)String:每個字符2字節(jié)程序中數(shù)字分整數(shù)、浮點(diǎn)數(shù)(現(xiàn)實中的小數(shù))Js中一切數(shù)字都用number保存,不分整數(shù)類型和小數(shù)類型如何定義number類型值?不帶引號的數(shù)字字面量程序中數(shù)字類型的舍入誤差:程序中不能準(zhǔn)確表示1/10,就好像現(xiàn)實中不能準(zhǔn)確表示1/3一樣!如何修正:按指定位數(shù)四舍五入:數(shù)字.toFixed(小數(shù)位數(shù))今后計算結(jié)果小數(shù)位數(shù)超長,說明碰到舍入誤差,按位四舍五入。String類型:一串字符的序列!Unicode:對所有語言文字中的字符編號;如:張(24352)、東(19996);
10、why:因為計算機(jī)只能處理數(shù)字,無法處理文字。計算機(jī)處理unicode,就等效于處理編號對應(yīng)的文字。轉(zhuǎn)義字符:專門表示非打印字符以及特殊符號如何使用轉(zhuǎn)義字符:特殊符號 比如:n換行 t tab健如果字符串中包含于語法相沖突的特殊字符,用轉(zhuǎn)義為原文字符串變量的內(nèi)容一旦創(chuàng)建不可改變!如果改變,只能創(chuàng)建新字符串,拋棄舊字符串。鄙視題(面試題)var str=”Hello”;Str=str+”world”;創(chuàng)建了三個字符串。Boolean類型:僅有兩個值的特殊數(shù)據(jù)類型:true,false何時使用boolcan?只要一個值只有真假兩種情況,就用boolean類型Undefined類型:表示一個變量僅聲
11、明過,但從未賦值。所有未賦值的變量,默認(rèn)值都是undefined。Undefined類型的值還是undefined!Day02數(shù)據(jù)類型間的轉(zhuǎn)換:隱式類型轉(zhuǎn)換:程序自動轉(zhuǎn)換數(shù)據(jù)類型弱類型:1.變量聲明時不必限定數(shù)據(jù)類型,今后可能保存任何類型數(shù)據(jù)。 2.數(shù)據(jù)類型間可以自動類型轉(zhuǎn)換僅考慮+:只要有字符串參與,一切類型都加”變字符串 如果沒有字符串,都轉(zhuǎn)為數(shù)字計算: 其中:true>1 false>0;強(qiáng)制轉(zhuǎn)換:程序員通過調(diào)用專門函數(shù)手動轉(zhuǎn)換類型1 string:x.toString()>將x轉(zhuǎn)為字符串類型2 Number:Number(x)>將任意類型轉(zhuǎn)為number類型St
12、ringnumber:轉(zhuǎn)為整數(shù):var num=parseInt(”str”)讀取字符串中的整數(shù)部分從第一個字符向后讀。如果碰到第一個數(shù)字字符,開始獲取數(shù)字,再次碰到不是數(shù)字的字符,停止讀取如果開頭碰到空格,忽略如果碰到的第一個非空格字符,不是數(shù)字,說明不能轉(zhuǎn)NaN:Not aNumber什么是NaN:不是數(shù)字(內(nèi)容)的數(shù)字(類型)讀取浮點(diǎn)數(shù):var num=parseFloat(“str”)讀取了浮點(diǎn)數(shù)部分用法和parseInt完全相同唯一差別:parseFloat認(rèn)識小數(shù)點(diǎn),僅認(rèn)第一個Console.log(parseFloat(“22.0”);/22;parseFloat可將小數(shù)點(diǎn)后占用
13、字節(jié)但無意義的部分去掉。Prompt(“提示信息”):專門用于請求用戶輸入數(shù)據(jù),收集數(shù)據(jù)的對話框!Var str=prompt(“提示信息”);*凡是從頁面上獲得的數(shù)據(jù),都是字符串!必須先來轉(zhuǎn)換再計算*數(shù)據(jù)類型轉(zhuǎn)換綜合圖:什么是運(yùn)算符:程序模擬人類運(yùn)算的特殊符號算數(shù)運(yùn)算:任意類型數(shù)據(jù)做運(yùn)算,都會被轉(zhuǎn)為數(shù)字類型,如果有參數(shù),不能自動轉(zhuǎn)為數(shù)字,則返回NaN如果除數(shù)為0:Infinity無窮大typeof(x):判斷任意數(shù)據(jù)的類型被除數(shù)%除數(shù) 模運(yùn)算:被除數(shù)/除數(shù),取除不盡的余數(shù)何時用:限制一個數(shù)不能超過某個最大范圍時遞增/遞減運(yùn)算:+:i+ài=i+1;只要遇到對變量+1,就用i+i+單
14、獨(dú)用:+放前放后,效果一樣:i+=+i;前+,先+1,再參與表達(dá)式后+,先用舊值參與表達(dá)式,表達(dá)式之后再+1;關(guān)系運(yùn)算:判斷大小!條件判斷中使用結(jié)果:成立:true,不成立:false*自帶隱式類型轉(zhuǎn)換*字符串參與關(guān)系運(yùn)算:從第一個字符開始,取出每個字符PK Unicode編號”Hello” H e(101) “Hi” H i(105)“hello”<”Hi”Hello” H e “HI” H I“hello”>”HI”所有小寫字母的Unicode都大于大寫字母關(guān)系運(yùn)算中:任何類型和數(shù)字比較,都轉(zhuǎn)為數(shù)字,再比較/與字符串和其他相加區(qū)別布爾類型參與關(guān)系運(yùn)算,始終轉(zhuǎn)為數(shù)字比較實際中,關(guān)
15、系運(yùn)算:先將參與判斷的數(shù)據(jù),強(qiáng)轉(zhuǎn)為相同類型,在比較字符串比較:Undefined做比較Undefined類型,從null類型繼承來的Undefined值被自動轉(zhuǎn)換為null!Undefined=null=true=嚴(yán)格相等:不帶自動類型轉(zhuǎn)換的相等比較!要求類型和值必須都相等!才返回true。只要不確定比較的類型,又不希望自動類型轉(zhuǎn)換時,就用=; NaN做比較:NaN和任何數(shù)字做比較,永遠(yuǎn)返回false NaN=NaN=falseisNsN(x):專門用來判斷一個數(shù)據(jù)是否是NaN 如果是NaN返回true;如果不是NaN返回false 是數(shù)字返回false;如果不是數(shù)字返回true;只要不能自動
16、轉(zhuǎn)換為數(shù)字的,都返回true只要能自動轉(zhuǎn)換為數(shù)字的,都返回false關(guān)系運(yùn)算總結(jié):1.普通數(shù)據(jù),先轉(zhuǎn)為相同類型,再比較2.undefined,就用=3.NaN,就用isNaN(x)邏輯運(yùn)算:基于多組關(guān)系運(yùn)算,得出一個結(jié)論&&:而且; 所有條件為true,才返回true;只要一個為false就返回false。|:或者; 只要任意一個為true,就返回true;只有所有條件都為false時,才返回false。?。悍?;顛倒true和false;今后只要顛倒判斷結(jié)果,就用! !true=false !false=true 短路邏輯:只要前一個判斷足以得出最終結(jié)論,則后續(xù)條件不執(zhí)行!位移
17、:左移幾位就乘幾個2;右移幾位就除幾個2;左移n<<m=>n*(2的m次方);右移:n>>m=>n/(2的m次方) 賦值運(yùn)算:賦值運(yùn)算結(jié)果就是等號右邊表達(dá)式的結(jié)果擴(kuò)展的賦值表達(dá)式:對已有數(shù)據(jù)計算同時,將結(jié)果再存回變量三目運(yùn)算:根據(jù)不同條件,動態(tài)返回不同結(jié)果!三目:至少需要3個表達(dá)式。語法:一個條件,二選一:條件?當(dāng)條件滿足時返回的值:當(dāng)條件不滿足時返回的值多個條件,多選一:條件1?條件1滿足時的值:條件2?條件2滿足時的值:條件n?條件n滿足時的值: 默認(rèn)值;典型用法:注意:后一個條件中不用包含否定前一個條件的關(guān)系判斷。因為,進(jìn)入后一個條件隱含的條件就是前一
18、個條件不滿足。例子:Day03函數(shù):(方法)封裝執(zhí)行一項專門任務(wù)的步驟的代碼序列何時定義方法?只要發(fā)現(xiàn)一段代碼重復(fù)使用,就封裝為方法。語法:聲明 Function 方法名(參數(shù)列表) 方法體:步驟清單 return 返回值;調(diào)用:方法名(參數(shù)值列表);參數(shù):方法內(nèi)獨(dú)有的變量,接收傳入數(shù)據(jù),在方法內(nèi)處理。參數(shù)讓方法變靈活!如何聲明方法參數(shù):不用var!參數(shù)何時被創(chuàng)建?只有方法被調(diào)用時才自動創(chuàng)建。返回值:方法執(zhí)行完成后,由方法返回的一個數(shù)據(jù)定義返回值:不用再聲明變量,直接用return值!為什么定義返回值:因為調(diào)用方法的人需要明確的返回結(jié)果。返回值主要給調(diào)用者使用。return:本意退出方法! 退
19、出同時,可返回數(shù)據(jù)!可以在任何需要的地方,調(diào)用方法執(zhí)行;帶返回值的方法,使用時,等效于直接使用返回值數(shù)據(jù)例子:比較找到三個數(shù)之間的最大值作用域:一個變量的可用范圍?。ê苤匾┤肿饔糜颍褐苯勇暶髟谌肿饔糜蛑械淖兞?,叫全局變量今后只要希望所有作用域公用的變量都要聲明在全局作用域局部(函數(shù))作用域:聲明在方法內(nèi)部的變量或方法的參數(shù)變量都叫局部變量值傳遞:將一個變量的值賦值給另一個變量,其實將原變量中的值,復(fù)制一份給新變量。JS中一切賦值都是值傳遞!對未聲明的變量賦值:js會自動在全局創(chuàng)建該變量!函數(shù)作用域和變量作用域完全一樣函數(shù)作用域在調(diào)用方法時創(chuàng)建,方法執(zhí)行完立刻銷毀!問題:方法參數(shù):依據(jù)方法
20、內(nèi)部的處理邏輯至少需要幾個數(shù)據(jù)才可正常執(zhí)行。方法參數(shù)和外部定義了哪些變量沒有任何關(guān)系。方法參數(shù)作用:1.接收外部傳入數(shù)據(jù),在方法內(nèi)處理 2.規(guī)定調(diào)用方法的人必須提供哪些參數(shù)!方法返回值:根據(jù)方法調(diào)用者的需要!如果方法調(diào)用者需要明確返回一個結(jié)果,就定義返回值!否則,可以不定義返回值!有返回值的方法,可以當(dāng)做一個值用!何時必須用變量接???方法的返回值,后續(xù)程序可能反復(fù)使用!自定義函數(shù):全局函數(shù):ECMScript定義了標(biāo)準(zhǔn),由各瀏覽器廠商已經(jīng)實現(xiàn)的函數(shù)。咱們直接調(diào)用! isNaN(x) parseInt/Float(x)encodeURI:將url中的非法字符轉(zhuǎn)為單字節(jié)符號編碼decodeURI:
21、將encodeURI轉(zhuǎn)后的字符串,轉(zhuǎn)換回原文解碼返回如下:unicode編碼:每個字符2個字節(jié);字母單字節(jié)。utf-8編碼:字母、數(shù)字單字節(jié) 漢子3字節(jié)url規(guī)定參數(shù)值中,再次出現(xiàn)保留字,就是非法:保留字:/ ? $ : encodeURIComponent:即能對多字節(jié)非法字符編碼,又能對單字節(jié)非法字符編碼今后只要使用component就夠了何時使用?將數(shù)據(jù)通過url發(fā)送時,都要先編碼再發(fā)送decondeURIComponent:對encodeURIComponent編碼的字碼。收到編碼后的字符串后,都要先解碼,再處理。返回:程序結(jié)構(gòu):3種:順序;分支;循環(huán)分支結(jié)構(gòu):程序運(yùn)行過程中,可以根據(jù)
22、不同的條件執(zhí)行不同的任務(wù)。分支結(jié)構(gòu):if結(jié)構(gòu) :一件事,要么做,要么不做 ifelse結(jié)構(gòu):2件事,二選一執(zhí)行else if結(jié)構(gòu):多件事,多選一執(zhí)行語法:if(條件1)/滿足條件1,執(zhí)行的代碼else if(條件2)/滿足條件2,執(zhí)行的代碼else if(條件n)/滿足條件n,執(zhí)行的代碼else/以上條件都不滿足時,默認(rèn)執(zhí)行的代碼如果前一個條件已經(jīng)滿足,則后續(xù)else if不再執(zhí)行!分支結(jié)構(gòu)中的條件,可以不是邏輯表達(dá)式!*如果不是,js會自動轉(zhuǎn)換為Boolean類型:*0,null,undefined,NaN,”都轉(zhuǎn)為false;其余,都轉(zhuǎn)為true!*Day04switchcase多條分支,
23、根據(jù)條件判斷,選擇執(zhí)行語法:switch(表達(dá)式)case 表達(dá)式1:/ 如果表達(dá)式的值=表達(dá)式1的值 代碼段1;Case 表達(dá)式n:代碼段n;default:/如果表達(dá)式的值和所有case都不相等, 默認(rèn)代碼段;運(yùn)行機(jī)制:如果找到與表達(dá)式值匹配的case,不但執(zhí)行當(dāng)前case下的代碼,而且之后所有代碼都被觸發(fā)! 返回值:break:退出當(dāng)前結(jié)構(gòu);返回值> 多個條件共用同一套執(zhí)行邏輯時,不加break!循環(huán)結(jié)構(gòu):程序反復(fù)執(zhí)行同一套代碼段。遇到結(jié)束條件,會結(jié)束執(zhí)行。沒有循環(huán)結(jié)束條件,永遠(yuǎn)循環(huán)執(zhí)行死循環(huán)循環(huán)三要素:1.循環(huán)條件:循環(huán)繼續(xù)執(zhí)行的條件。 一旦循環(huán)條件不滿足,循環(huán)立刻退出! 2.循
24、環(huán)變量:用于循環(huán)條件中做判斷的變量 循環(huán)變量都會向循環(huán)退出的趨勢變化(不滿足循環(huán)條件的趨勢)循環(huán)計數(shù)器3.循環(huán)體:每次循環(huán)要做的事情while循環(huán):當(dāng)滿足條件時,就繼續(xù)循環(huán)做事語法:var 循環(huán)變量while(循環(huán)條件) 循環(huán)體;迭代變化循環(huán)變量;break:退出當(dāng)前結(jié)構(gòu)while中何時用break:循環(huán)條件不滿足之前,希望強(qiáng)行退出循環(huán)。如何使用break?可以放在任何需要退出循環(huán)的位置。隨機(jī)數(shù):Math.random():0<=n<1任意minmax之間取隨機(jī)數(shù)公式:parseInt(Math.random()*(max-min+1)+min)例子:do-while循環(huán):先執(zhí)行一
25、次循環(huán)體,再判斷是否繼續(xù)!如果第一次循環(huán)條件不滿足,循環(huán)體至少可以執(zhí)行1次!變量聲明提前:相同作用域內(nèi),var無論出現(xiàn)在什么位置。解析時,優(yōu)先提取到j(luò)s開始位置聲明!while vs do while:如果第一次條件就可能不成,也想執(zhí)行一次,必須用do while如果第一次條件一定滿足,do while等效于whilefor循環(huán):完全等效于while循環(huán)。循環(huán)變量變化規(guī)律固定,循環(huán)次數(shù)已知/固定for(聲明并初始化循環(huán)變量;循環(huán)條件;迭代循環(huán)變量;)循環(huán)體continue:跳過本輪循環(huán),繼續(xù)執(zhí)行下一輪循環(huán)Day05 數(shù)組:存儲:連續(xù)存儲多個數(shù)據(jù)的存儲空間 使用:相當(dāng)于多個變量的集合why?現(xiàn)實
26、中數(shù)據(jù)都是批量分類管理何時使用:只要批量管理多個數(shù)據(jù),就要用數(shù)組保存如何使用:創(chuàng)建,初始化,訪問數(shù)組中的數(shù)據(jù)創(chuàng)建:數(shù)組都是用創(chuàng)建出來的。var arr=;à創(chuàng)建了一個數(shù)組對象,數(shù)組中包含0個元素var arr=95,61,95;à創(chuàng)建了一個數(shù)組對象,數(shù)組中連續(xù)存儲3個元素:91,61,95兩個不限制:1.不限制元素個數(shù)!2.不限制元素數(shù)據(jù)類型*數(shù)組是引用類型的對象*原始類型:數(shù)據(jù)保存在變量本地引用類型:數(shù)據(jù)不保存變量本地!保存在“堆”中。由地址指向?qū)嶋H數(shù)據(jù)引用類型特點(diǎn):可以保存多個數(shù)據(jù),而且數(shù)據(jù)個數(shù)隨時可變why?原始類型中只能保存一個值,1個值無法精確描述一個東西,現(xiàn)實中
27、,都是用多個屬性共同描述一個東西只要是對象,一定在堆里,對象一定有地址。對象:凡是存儲在堆中的,都是對象!使用引用類型的對象:使用變量,等效于使用對象的地址 使用對象地址,等效于使用對象本身數(shù)組對象支持直接輸出數(shù)組內(nèi)容其他數(shù)組創(chuàng)建語法:var arr=new Array(num); New:要在堆中開辟空間! Array:ECMAScript標(biāo)準(zhǔn)中的內(nèi)置類型 new Array:在堆中創(chuàng)建一個數(shù)組類型的存儲區(qū)域 (num):初始創(chuàng)建num個元素var arr=new Array(7);undefined, undefined, undefined, undefined, undefined,
28、undefined, undefinedundefined輸出時,變?yōu)橐粋€空字符var arr=new Array(元素1,元素2,元素3,.元素n);null:一個變量沒有指向任何對象何時使用null:主動釋放對象!主動釋放的對象不能被找回為什么原始類型不適用null?原始類型占用的空間很小,堆中的數(shù)據(jù)是海量的,占用空間很大null vs undefined:null 專用于主動釋放對象!undefined:專用于自動初始化任何未賦值的變量垃圾回收:js引擎自動銷毀不再被引用的對象!垃圾回收程序:隨js程序運(yùn)行而后臺同時運(yùn)行只要對象還有變量引用,就不回收。訪問數(shù)組:數(shù)組:一組變量的集合。如何
29、獲得其中一個變量/數(shù)據(jù):下標(biāo),數(shù)組中唯一標(biāo)識一個元素的序號。從0開始。最后一個元素的下標(biāo)是“元素個數(shù)-1”js內(nèi)置對象不但封裝存儲,而且封裝常用APIAPI:已經(jīng)實現(xiàn)的方法!可以直接調(diào)用!Array API:1. arr.length屬性:數(shù)組中的元素個數(shù)訪問任意數(shù)組的最后一個元素:arrarr.length-1length屬性值,隨數(shù)組長度變化而自動變化!js中數(shù)組可以根據(jù)程序的需要,自動擴(kuò)容,保證程序正常執(zhí)行數(shù)組擴(kuò)容和縮容:都是設(shè)置length屬性的值。如果length屬性值>舊值,會擴(kuò)容。;反之,縮容(截斷)被截斷的元素,不能被找到,不會被回收。只能隨數(shù)組對象一起回收。固定用法:在
30、任意數(shù)組結(jié)尾追加一個新元素:arrarr.length=新值;例子:一次輸入員工姓名直到輸入exit退出,輸出所有員工姓名:調(diào)用完函數(shù)后出棧 什么是數(shù)組遍歷:對數(shù)組中每個元素執(zhí)行相同的操作for(var i=0;i<arr.length;i+) arrià當(dāng)前元素返回:關(guān)聯(lián)數(shù)組:數(shù)組下標(biāo)可以自定義名稱!key/value對兒何時使用關(guān)聯(lián)數(shù)組:數(shù)組元素的內(nèi)容無法描述自己的意義時 使用關(guān)聯(lián)數(shù)組為每個元素起名關(guān)聯(lián)數(shù)組的.length屬性作廢了!所以用for(var key in arr)for in:專門遍歷關(guān)聯(lián)數(shù)組用的!for(var key in arr)/從第一個元素開始,將元
31、素的key賦值給臨時變量keyarrkeyà當(dāng)前正在遍歷的元素的值(value)例子:返回:關(guān)聯(lián)數(shù)組直接量定義方式:“key1”:”value1”, “key2”:”value3”,還是上面的例子改下:返回:冒泡排序:數(shù)組常用方法:x.toString()方法:任何對象都有toString方法,默認(rèn)用逗號(,)分隔每個元素將對象轉(zhuǎn)為字符串,一般不主動調(diào)用,js在需要時自動調(diào)用x.valueof()方法:同toString()var arr=arr.join(“分隔符”):將數(shù)組轉(zhuǎn)為字符串??勺远x分隔符!用法:將字符拼接為單詞或句子 固定用法:chars.join(”);例子:返回值
32、:var newArr=arr.concat(元素值,數(shù)組,):將參數(shù)拆散成單個元素,追加到數(shù)組中。*不會修改原數(shù)組,只能返回新數(shù)組對象*返回值:var subArr=arr.slice(start,end+1):截取數(shù)組下標(biāo)從start開始到end位置的元素,生產(chǎn)子數(shù)組對象。*含頭不含尾*返回值:arr.splice:刪除!插入!替換!刪除數(shù)組元素:arr.splice(start,count);替換元素:arr.splice(start,count,值1,值2,)插入元素:arr.splice(start,0,值1,值2,)à從下標(biāo)為2的數(shù)組開始刪除2個元素,然后插入16,6,2
33、2三個新的 的元素,刪除兩個插入三個,比原來多了一個元素,數(shù)組自動擴(kuò)容一個。arr.reverse():顛倒所有數(shù)組元素 arr.sort():默認(rèn)升序排列。默認(rèn)都轉(zhuǎn)為字符串排序! Day06排序:arr.sort():默認(rèn)按字符串升序排列自定義排序:2步:Step1:定義比較器函數(shù)!什么是比較器函數(shù)?定義任意兩值比較策略的方法比如:num1-num2>0 ànum1>num2 num1-num2<0 ànum1<num2function compare(a,b) return a-b;/如果返回>0數(shù),a>b; 如果返回<0數(shù),a
34、<b; 如果返回<0數(shù),a<b;如果剛好=0,a=b;Steb2:將比較器函數(shù)傳遞給sort方法!如何將方法作為參數(shù)傳遞?Js中方法也是一個對象!方法名就是指向方法對象的變量名!function compare(a,b)return a-b;/可以定義在使用前后的任何位置/原因:var聲明和function聲明自動提前!相當(dāng)于:var compare=new Function(“a”,”b”,return a-b);/必須定義在使用之前!原因僅聲明提前,賦值不提前。這里的Function中的F必須大寫,可能選擇題會考。arr.sort(compare);注意!將方法作為對象傳
35、遞時,僅使用方法名,后不加圓括號。返回值:降序:顛倒比較結(jié)果的正負(fù),可以導(dǎo)致升序變降序升序:Function compareASC(a,b)return a-b;顛倒(*-1):Function compareDESC(a,b)return -(a-b);例子:棧和隊列:什么是棧?后進(jìn)的先出!(LIFO-last in fist out)棧其實就是數(shù)組,只不過用一對兒方法模擬了棧的操作!入棧:arr.push() 出棧:var last=arr.pop()只能從數(shù)組一端出棧,入棧。另一端封閉!棧和隊列:js中,其實就是數(shù)組! 棧:只能從一端插入/彈出元素,另一端封閉。棧操作:結(jié)尾入棧出棧:入棧
36、:arr.push(值1,.) 出棧:var last=arr.pop();/給個變量接住出來的 開頭入棧出棧:所有元素下標(biāo)隨入棧出棧操作而變化 入棧:arr.unshift(值1,) 出棧:var first=arr.shift()隊列:FIFO 先到先得 入隊列:arr.push(值1.) 出隊列:var first=arr.shift()二維數(shù)組:數(shù)組的元素又是另一個數(shù)組對象!創(chuàng)建二維數(shù)組:創(chuàng)建普通數(shù)組,完全一樣! 只不過將普通元素,換為一個數(shù)組對象而已比如:var arr=1,2,3; var arr2=1,2,3,4,5,6,7,8; arr23=11,12,13;如何訪問二維數(shù)組中
37、的任意元素: arr父數(shù)組中的下標(biāo)子數(shù)組中的下標(biāo)何時使用二維數(shù)組:數(shù)據(jù)包含明顯上下級關(guān)系內(nèi)置對象:10個內(nèi)置對象要記住,筆試string包裝類型:*字符串內(nèi)容一旦創(chuàng)建,不能改變 str.length:返回str字符串中的字符個數(shù) 比如:var str=”Hello馬里奧”; str.length/8 str的length只管個數(shù),不管字節(jié)大小寫轉(zhuǎn)換:都轉(zhuǎn)小寫:str=str.toLowerCase()都轉(zhuǎn)大寫:str=str.toUpperCase()何時使用:希望大小寫一視同仁時,就要先轉(zhuǎn)換,再處理Day7轉(zhuǎn)義字符:代替字符串中的非打印字符:n t如果字符串內(nèi)容中包含和語法沖突的特殊字符,可
38、用轉(zhuǎn)為普通字符!比如:console.log(”js是互聯(lián)網(wǎng)”第一大語言”);字符串內(nèi)容一旦創(chuàng)建不可改變!如果修改。都要創(chuàng)建新字符串,保存新結(jié)果,替換舊字符串var str=”Hello”;str.toUpperCase();console.log(str);*規(guī)律:所有字符串API ,都需要變量接收返回值!*字符串的字符個數(shù):str.length屬性字符串類型底層其實都是用字符數(shù)組實現(xiàn)的比如:stri大小寫轉(zhuǎn)換:大小寫字母一視同仁時,先轉(zhuǎn)化,再處理比如:重名驗證,重復(fù)郵箱,驗證碼獲取指定位置字符:var char=str.charAt(index); 在index位置的char獲取指定位置字
39、符的unicode編號:var num=str.charCodeAt(index);字符串三大操作:1.查找關(guān)鍵字!2.替換關(guān)鍵字3.獲取子字符串查找關(guān)鍵字:var index=str.indexOf(”關(guān)鍵字”);返回關(guān)鍵字所在位置!*如果沒找到,返回-1!*IndexOf:懶:只找第一個關(guān)鍵字的位置!蠢:默認(rèn)只能從位置0開始!var index=str.indexOf(”關(guān)鍵字”,from);from:開始查找的位置。從from開始向后查找從最后一個字符,向前找:只要關(guān)鍵字離結(jié)尾近,就用lastvar index=str.lastIndexOf(“關(guān)鍵字”,from);from:開始查找的
40、位置,從from開始向前查找*返回的index完全相同!因為字符在數(shù)組中的下標(biāo)是固定的!所以與查找方向無關(guān)*2. 獲取子字符串:var subStr=str.slice(start,end+1)Str.substring(start,end+1)用法同slice!唯一差別:不支持負(fù)值作為參數(shù)!str.substr (start,count) count表示個數(shù)以上三個方法省略第二個參數(shù),默認(rèn)都是取到結(jié)尾!按規(guī)律分割字符串:var subs=str.split(“分隔符”,count)à中括號表示可加可不加,加count表示要切的個數(shù)鄙視題:把no zuo no die每個單詞第一個字
41、母變大寫,輸出返回:課堂練習(xí):判斷字符的種類:unicode范圍:48-57: 0-9數(shù)字字符65-90: A-Z 大寫字母97-122: a-z 小寫字母19968-40869:漢字其他字符什么是模式匹配:可以設(shè)置查找或替換的規(guī)則!何時使用模式匹配:要查找的關(guān)鍵字可能發(fā)生有規(guī)律的變化。如何使用模式匹配:1.先定義模式:/關(guān)鍵字/模式比如:var reg=/no/i; no是要查找的關(guān)鍵字原文,不管是不是字符串,都不加”i表示忽略大小寫!String類型中,提供了專門支持模式匹配的API!按模式替換關(guān)鍵字:str=str.replace(reg,”新值”);默認(rèn)replace僅替換第一個關(guān)鍵字
42、!要想全局替換,要在模式中定義“g”獲得*所有*關(guān)鍵字的*內(nèi)容*:var kwords=str.match(reg);只能取得關(guān)鍵字的內(nèi)容,無法確定每個關(guān)鍵字的位置!kwords.length:找到的關(guān)鍵字個數(shù)!*如果未找到,返回null!*只要有可能返回null!都要先判斷!=null,再處理!var index=str.search(reg);和indexOf完全相同!IndexOf不支持模式查找!search其實是indexOf的模式查找版*正則表達(dá)式:*重點(diǎn)什么是正則表達(dá)式:字符串中字符出現(xiàn)的規(guī)則何時使用正則表達(dá)式?驗證字符串格式,查找關(guān)鍵字,替換關(guān)鍵字比如:銀行卡查詢密碼:6位數(shù)字
43、用戶名:字母,數(shù)字,_的組合正則表達(dá)式:選擇符號:所有備選字符:必須多選一使用一個,只能代表1位字符的規(guī)則!xxxx:表示除了xxxx都行!注意必須放在中的第一個位置,否則,變?yōu)槠胀ㄗ址ヅ洹?符號:字符的范圍:備選字符連續(xù)的范圍!比如:0-9 a-z A-Z a-zA-Z/-可以局部使用漢字范圍:u4e00-u9fa5預(yù)定義字符集:使用簡化的符號,定義字符集比如:0-9- ->d a-zA-Z0-9- ->w 空字符- ->s如果規(guī)則正文中出現(xiàn)特殊符號,用轉(zhuǎn)為原文比如:”.” 表示一個任意字符!. 表示愿意.數(shù)量詞:規(guī)定前邊一個字符出現(xiàn)次數(shù)的量詞語法:min,max num
44、:固定長度 min,:至少min個,多了不行手機(jī)號:86s13578d9用戶名:w8,16Day8比如 :驗證座機(jī)號碼:d3,4-d7,8特殊數(shù)量詞:+ * ? 如果正文中出現(xiàn)+*?,都要用轉(zhuǎn)義?:可有可無用?,如果有,最多只能出現(xiàn)一次*:也是表示可有可無,但不限制出現(xiàn)次數(shù)+:至少出現(xiàn)一次!不限制出現(xiàn)次數(shù)():分組:改變模式的匹配順序比如:驗證身份證號:d15(d20-9xX)?比如:驗證手機(jī)號:(+86)?s*134578d9:整個正則表達(dá)式的開頭,表示以xxx開始$:整個正則表達(dá)式的結(jié)尾,表示以xxx結(jié)束?=:預(yù)判,前一個字符之后,必須緊跟xxx?!:預(yù)判,前一個字符之后,必須不能跟xxx
45、課堂練習(xí):中文姓名:u4e00-u9fa52,6電子郵件:w+w+(-w+)*(.w+)+其中:w+(-w+)* - -匹配域名一個以上的字母,后可跟“-字母”,可有可無(.w+)+ “.字母”組合至少出現(xiàn)1次。RegExp對象:專門封裝一條正則表達(dá)式,提供使用正則表達(dá)式的常用API如何使用RegExp對象:1.創(chuàng)建 2.調(diào)用API如何創(chuàng)建正則表達(dá)式對象:var regExp=/正則表達(dá)式/ig;API:var boolcan=regExp.test(“被檢查的字符串”)如果驗證通過:返回true;否則返回false驗證要求完整匹配!查找要求部分匹配!test方法默認(rèn):只要找到就返
46、回true!如何讓test完全匹配:正則表達(dá)式前加,正則表達(dá)式后加$;查找:exec:查找關(guān)鍵字的位置,又能找到關(guān)鍵字的內(nèi)容indexOf不支持正則,search支持正則,每次只能找1個match所有內(nèi)容,但得不到位置!var arr=regExp.exec(”被查找的內(nèi)容”)arr0:找到的關(guān)鍵字內(nèi)容arr.index屬性:找到的關(guān)鍵字的位置exec方法每次也只能找一個,但是每次自動修改regExp對象的lastIndext屬性!regExp對象的lastIndex屬性:表示下次開始匹配的位置!查找:僅判斷有沒有,或者僅查找位置:indexOf 支持正則表達(dá)式:search() 僅找所有關(guān)鍵
47、字的內(nèi)容:match() 既找位置,又找內(nèi)容:excc()從正則表達(dá)式匹配的內(nèi)容中,取一部分:RegExp.$nn:正則表達(dá)式中第n個分組,其實就是第n個圓括號強(qiáng)調(diào):分組從1開始必須通過RegExp類型,直接調(diào)用$n,不能使用對象!string對象與正則表達(dá)式str.replace(/正則表達(dá)式/ig,”替換值”)str.match(/正則表達(dá)式/ig) str.search() str.split(/正則表達(dá)式/)trim功能:去除字符串開始和結(jié)尾的空格。中間空格不去掉!對輸入字符串的處理,多數(shù)要先清除開頭和結(jié)尾空格,再處理IE8不支持trim()方法!自定義一個trim方法解決IE8不支持
48、的問題:String總結(jié):所有API都無法修改原字符串,都會返回新字符串,所有stringAPI都需要用變量保存結(jié)果!str.length字符個數(shù)str=str.toLowerCase()/toUpperCase()查找關(guān)鍵字:var index=str.indexOf(“關(guān)鍵字”,from) var arr=str.match(/正則表達(dá)式/g)獲得子字符串:var substr=str.slice(start,end+1); str.substring(start,end+1); str.substr(start,count);替換:str=str.replace(/正則表達(dá)式/g,”替換
49、值”);獲得指定位置的字符:var char=str.charAt(index) strindex字符編碼轉(zhuǎn)碼:var code=str.charCodeAt(index); var char=string.fromCharCode(code);RegExp對象總結(jié):var reg=/正則表達(dá)式/ig;var reg=new RegExp(“正則表達(dá)式”,ig);其中所有都要改為!*驗證str中是否包含reg匹配的關(guān)鍵字:var boolean=reg.test(str);*強(qiáng)調(diào):完整驗證,都需要在正則表達(dá)式前加后加$*同時查詢所有關(guān)鍵字的內(nèi)容和位置while(arr=reg.exec(str
50、)!=null) arr0- ->找到的一個關(guān)鍵字 arr.index- ->當(dāng)前關(guān)鍵字的位置RegExp.$n:獲得正則表達(dá)式中第n個分組(圓括號)匹配的子字符串Math類型:封裝了所有數(shù)學(xué)計算有關(guān)的API不能new!Math.PI取整:Math.round(num)- ->四舍五入取整Math.ceil(num)- ->向上取整Math.floor(num)- ->向下取整var n=22.16Math.round(n)- ->22Math.ceil(n)- ->23Math.floor(n)- ->22Math.pow(底數(shù),冪)Math.
51、sqrt(num)/開平方根!var n=9;Mat.pow(n,3);Math.sqrt(n)/3絕對值:Math.abs(num)Math.max/min(值1,值2)取數(shù)組中的最大值:var max=Math.max.apply(Math,arr)取數(shù)組中的最小值:var min=Math.min.apply(Math,arr)找出數(shù)組中的最大值,固定用法:把max改成min找出的是最小值隨機(jī)數(shù):Math.random():0<=r<1任意min-max:Math.floor(Math.random()*(max-min+1)+min)練習(xí):隨機(jī)生成4位驗證碼完整驗證碼代碼如
52、下:var codes=;/數(shù)字:48-57for(var i=48;i<=57;codes.push(i),i+);/大寫字母:65-90for(var i=65;i<=90;codes.push(i),i+);/小寫字母:97-122for(var i=97;i<=122;codes.push(i),i+);function getCode()var arr=;for(var i=0;i<4;i+)/從0-61之間取隨機(jī)數(shù) var index=Math.floor(Math.random()*(61-0+1)+0); var char=String.fromCharCode(codesindex); arr.push(char);return arr.join("");function trim
溫馨提示
- 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負(fù)責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請與我們聯(lián)系,我們立即糾正。
- 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 服務(wù)類合同的續(xù)簽事宜
- 商品采購合同新版格式
- 空氣源熱泵安裝招標(biāo)啟事
- 股東借款合同范本英文
- 監(jiān)理合同條款范本
- 道路標(biāo)志牌批量訂購
- 檢討保證書撰寫
- 國慶節(jié)活動承包合同
- 安全供貨合作協(xié)議
- 房屋購買委托協(xié)議書
- 大學(xué)生職業(yè)生涯規(guī)劃與就業(yè)創(chuàng)業(yè)指導(dǎo)知到智慧樹章節(jié)測試課后答案2024年秋四川水利職業(yè)技術(shù)學(xué)院
- 檔案管理基本知識課件
- 高二語文上學(xué)期期末考點(diǎn)大串講(統(tǒng)編版選擇性必修上冊+中冊)專題01 信息類文本閱讀(知識清單)
- 浙江強(qiáng)基聯(lián)盟2024年12月高三聯(lián)考?xì)v史試題(含答案)
- 中建地下防水施工方案
- 2025年上半年廈門市外事翻譯護(hù)照簽證中心招考易考易錯模擬試題(共500題)試卷后附參考答案
- 名師工作室建設(shè)與管理方案
- 2024年小學(xué)體育新課標(biāo)測評考試題庫(含答案)
- 新《安全生產(chǎn)法》安全培訓(xùn)
- 2024年度技術(shù)服務(wù)合同:人工智能系統(tǒng)的定制與技術(shù)支持3篇
- 2024年(家政服務(wù)員、母嬰護(hù)理員)職業(yè)技能資格基礎(chǔ)知識考試題庫與答案
評論
0/150
提交評論