達內web前端JS筆記_第1頁
達內web前端JS筆記_第2頁
達內web前端JS筆記_第3頁
達內web前端JS筆記_第4頁
達內web前端JS筆記_第5頁
已閱讀5頁，還剩56頁未讀， 繼續免費閱讀

下載本文檔

版權說明：本文檔由用戶提供并上傳，收益歸屬內容提供方，若內容存在侵權，請進行舉報或認領

文檔簡介

1、2015年6月份達內web前端就業班培訓JS部分前端三大基礎知識：HTML：專門編寫網頁內容CSS：專門設計網頁樣式JavaScript：專門設計網頁交互的語言（9天）=Day1JavaScript：專門設計網頁交互的語言交互：輸入數據，程序處理數據，返回結果什么是JavasCript：1. 專門設計網頁交互的語言2. 運行在javaScript解釋器中3. “解釋”執行4. 互聯網第一大語言：JSerECMAScript標準：JavaScript核心語法微軟：JscriptW3C:DOM標準：專門操作HTML元素，CSS樣式，事件的統一標準！BOM：專門操作瀏覽器窗口的工具。沒標準，由瀏覽器

2、廠商自行實現JavaScript=ECMAScript+DOM+BOMJSer最大挑戰：瀏覽器兼容性問題JavaScript典型用途：1. 客戶端數據計算2. 客戶端表單驗證3. 動畫JavaScript特點：純文本；解釋執行；弱類型；基于對象如何使用：1. 使用瀏覽器自帶的js解釋器；F12- ->控制臺光標處寫腳本代碼，回車執行。Console：指代控制臺：專門調試程序輸出結果的窗口。log：控制臺console提示的一個功能：向控制臺輸入一行日志多行：shift+enterà換行*JavaScript中區分大小寫！*字符串單雙引號都行*2.單獨安裝專門解釋器軟件：node

3、.js Chrome V8Win鍵+Ràcmdànode退出：兩次ctrl+c執行.js文件：1.先到cd到.js文件所在路徑 2.node文件名 回車3.隨網頁一同運行：瀏覽器包含兩種工具：排版引擎：專門加載HTML內容和css樣式解釋引擎：專門運行Js腳本<script>中腳本塊何時運行？隨網頁加載，解釋執行<script>中都要用js語法！Html元素的事件屬性中：什么是事件？元素可以根據鼠標或鍵盤的不同操作響應不同的交互行為<html><head><title></title></head

4、><body><script> alert("hello from script");</script> <button onclick="alert('hello from onclick')">按鈕</button></body></html><script>解釋執行，讀到才執行。先讀到先執行，后讀到后執行。<script>放置的先后順序影響程序結構。優化：放在body后；待網頁全部加載完在實現功能，用戶體驗效果更佳。一次

5、定義，處處使用；一次修改，處處生效！解決：凡是重復編寫的代碼塊，都要封裝為一個方法：方法：執行一個專門功能的一組代碼的序列。定義在<head>下的<script>中語法：function方法名()重用的代碼塊調用：方法名()à調用后立即執行。*不調用不執行*只要沒反應或效果沒有出來就是出錯！àF12調試查看錯誤原因à定位錯誤位置！<script>腳本塊中的錯誤，僅影響“當前腳本塊”中出錯位置之后的腳本執行。不影響<script>之外的其他元素加載或腳本塊執行。Function中的錯誤：只有調用方法時才觸發！頁面內部腳

6、本塊問題：僅當前頁面可用！解決：外部.js文件！什么是.js文件：專門保存js腳本源代碼的文件。源代碼都要放到js解釋器才能執行。如何使用.js文件？2 步：1.創建.js文件，編寫源代碼。2.在頁面中引入外部.js文件。ECMAScript（核心語法）*區分大小寫*字符串必須用引號（單雙都行）包裹*每條語句結尾都建議有分號*語句：讓程序可以做一件事的一行命令腳本塊：多行語句的序列程序：讓計算機模擬執行人類的想法！注釋：不會被解釋執行或顯示的代碼說明給程序員看的注釋也占網頁流量！生產環境必須去掉！提高加載速度。HTML注釋：<!->CSS注釋：/*/Js注釋：/單行注釋 /*多行注

7、釋*/*變量*什么是變量？內存中專門存儲數據的空間程序都是在內存中運行任何程序包括三個部分：IPO： input process output 即：輸入數據 處理數據 輸出數據何時使用變量？只要在程序中臨時存儲數據，都要放在變量中怎么使用變量？聲明，命名，初始化和使用聲明：在內存中開辟一個存儲空間怎么聲明？var 變量名；賦值：將等號右邊的數據，裝入等號左邊的變量中！如果未賦值：js默認賦值為undefined命名規則：見名知意 保留字/關鍵字不能當變量名保留字：js中已經占用的特殊意義的關鍵字使用：使用變量名等效于直接使用變量中存儲的數據+：拼接多段文字為一句話！常量：一旦創建，值不可改變的

8、特殊變量如何使用常量：const 常量名=常量值；前后返回值一樣，因為PI是常量，沒法改變。強調：只有等號可以向變量中存入新值。普通運算不會改變變量的值。只是使用變量的值。只要帶var就是聲明，只要聲明就會開辟內存空間呢。Js中新同名變量的空間會替換舊變量的空間。有幾個var，就會創建幾個存儲空間。數據類型：變量中存儲的數據的類型。Js是弱類型：變量本身沒有類型。只有變量中的值才有類型。一個變量，可以反復保存不同類型的數據為什么要有數據類型：現實中所有數據根據用途不同，都分為不同數據類型。原始類型：數據保存在變量本地！Number string Boolean undefined nullNu

9、mber類型：表示一切用于比較或數學計算的數字原始類型大小：Number：整數4字節，浮點數8字節String：每個字符2字節程序中數字分整數、浮點數（現實中的小數）Js中一切數字都用number保存，不分整數類型和小數類型如何定義number類型值？不帶引號的數字字面量程序中數字類型的舍入誤差：程序中不能準確表示1/10，就好像現實中不能準確表示1/3一樣！如何修正：按指定位數四舍五入：數字.toFixed（小數位數）今后計算結果小數位數超長，說明碰到舍入誤差，按位四舍五入。String類型：一串字符的序列！Unicode：對所有語言文字中的字符編號；如：張（24352）、東（19996）；

10、why：因為計算機只能處理數字，無法處理文字。計算機處理unicode，就等效于處理編號對應的文字。轉義字符：專門表示非打印字符以及特殊符號如何使用轉義字符:特殊符號 比如：n換行 t tab健如果字符串中包含于語法相沖突的特殊字符，用轉義為原文字符串變量的內容一旦創建不可改變！如果改變，只能創建新字符串，拋棄舊字符串。鄙視題（面試題）var str=”Hello”;Str=str+”world”;創建了三個字符串。Boolean類型：僅有兩個值的特殊數據類型：true，false何時使用boolcan？只要一個值只有真假兩種情況，就用boolean類型Undefined類型：表示一個變量僅聲

11、明過，但從未賦值。所有未賦值的變量，默認值都是undefined。Undefined類型的值還是undefined！Day02數據類型間的轉換：隱式類型轉換：程序自動轉換數據類型弱類型：1.變量聲明時不必限定數據類型，今后可能保存任何類型數據。 2.數據類型間可以自動類型轉換僅考慮+：只要有字符串參與，一切類型都加”變字符串 如果沒有字符串，都轉為數字計算： 其中：true>1 false>0;強制轉換：程序員通過調用專門函數手動轉換類型1 string：x.toString()>將x轉為字符串類型2 Number：Number（x）>將任意類型轉為number類型St

12、ringnumber:轉為整數：var num=parseInt（”str”）讀取字符串中的整數部分從第一個字符向后讀。如果碰到第一個數字字符，開始獲取數字，再次碰到不是數字的字符，停止讀取如果開頭碰到空格，忽略如果碰到的第一個非空格字符，不是數字，說明不能轉NaN：Not aNumber什么是NaN：不是數字（內容）的數字（類型）讀取浮點數：var num=parseFloat（“str”）讀取了浮點數部分用法和parseInt完全相同唯一差別：parseFloat認識小數點，僅認第一個Console.log（parseFloat（“22.0”）；/22；parseFloat可將小數點后占用

13、字節但無意義的部分去掉。Prompt（“提示信息”）：專門用于請求用戶輸入數據，收集數據的對話框！Var str=prompt（“提示信息”）；*凡是從頁面上獲得的數據，都是字符串！必須先來轉換再計算*數據類型轉換綜合圖：什么是運算符：程序模擬人類運算的特殊符號算數運算：任意類型數據做運算，都會被轉為數字類型，如果有參數，不能自動轉為數字，則返回NaN如果除數為0：Infinity無窮大typeof（x）：判斷任意數據的類型被除數%除數 模運算：被除數/除數，取除不盡的余數何時用：限制一個數不能超過某個最大范圍時遞增/遞減運算：+：i+ài=i+1;只要遇到對變量+1，就用i+i+單

14、獨用：+放前放后，效果一樣：i+=+i；前+，先+1，再參與表達式后+，先用舊值參與表達式，表達式之后再+1；關系運算：判斷大小！條件判斷中使用結果：成立：true，不成立：false*自帶隱式類型轉換*字符串參與關系運算：從第一個字符開始，取出每個字符PK Unicode編號”Hello” H e（101） “Hi” H i（105）“hello”<”Hi”Hello” H e “HI” H I“hello”>”HI”所有小寫字母的Unicode都大于大寫字母關系運算中：任何類型和數字比較，都轉為數字，再比較/與字符串和其他相加區別布爾類型參與關系運算，始終轉為數字比較實際中，關

15、系運算：先將參與判斷的數據，強轉為相同類型，在比較字符串比較：Undefined做比較Undefined類型，從null類型繼承來的Undefined值被自動轉換為null！Undefined=null=true=嚴格相等：不帶自動類型轉換的相等比較！要求類型和值必須都相等！才返回true。只要不確定比較的類型，又不希望自動類型轉換時，就用=； NaN做比較：NaN和任何數字做比較，永遠返回false NaN=NaN=falseisNsN(x):專門用來判斷一個數據是否是NaN 如果是NaN返回true；如果不是NaN返回false 是數字返回false；如果不是數字返回true；只要不能自動

16、轉換為數字的，都返回true只要能自動轉換為數字的，都返回false關系運算總結：1.普通數據，先轉為相同類型，再比較2.undefined，就用=3.NaN，就用isNaN（x）邏輯運算：基于多組關系運算，得出一個結論&&：而且； 所有條件為true，才返回true；只要一個為false就返回false。|：或者； 只要任意一個為true，就返回true；只有所有條件都為false時，才返回false。?。悍?；顛倒true和false；今后只要顛倒判斷結果，就用！ ！true=false ！false=true 短路邏輯：只要前一個判斷足以得出最終結論，則后續條件不執行！位移

17、：左移幾位就乘幾個2；右移幾位就除幾個2；左移n<<m=>n*(2的m次方)；右移：n>>m=>n/(2的m次方) 賦值運算：賦值運算結果就是等號右邊表達式的結果擴展的賦值表達式：對已有數據計算同時，將結果再存回變量三目運算：根據不同條件，動態返回不同結果！三目：至少需要3個表達式。語法：一個條件，二選一：條件？當條件滿足時返回的值：當條件不滿足時返回的值多個條件，多選一：條件1？條件1滿足時的值：條件2？條件2滿足時的值：條件n？條件n滿足時的值： 默認值；典型用法：注意：后一個條件中不用包含否定前一個條件的關系判斷。因為，進入后一個條件隱含的條件就是前一

18、個條件不滿足。例子：Day03函數：（方法）封裝執行一項專門任務的步驟的代碼序列何時定義方法？只要發現一段代碼重復使用，就封裝為方法。語法：聲明 Function 方法名（參數列表） 方法體：步驟清單 return 返回值；調用：方法名（參數值列表）；參數：方法內獨有的變量，接收傳入數據，在方法內處理。參數讓方法變靈活！如何聲明方法參數：不用var！參數何時被創建？只有方法被調用時才自動創建。返回值：方法執行完成后，由方法返回的一個數據定義返回值：不用再聲明變量，直接用return值！為什么定義返回值：因為調用方法的人需要明確的返回結果。返回值主要給調用者使用。return:本意退出方法！ 退

19、出同時，可返回數據！可以在任何需要的地方，調用方法執行；帶返回值的方法，使用時，等效于直接使用返回值數據例子：比較找到三個數之間的最大值作用域：一個變量的可用范圍！（很重要）全局作用域：直接聲明在全局作用域中的變量，叫全局變量今后只要希望所有作用域公用的變量都要聲明在全局作用域局部（函數）作用域：聲明在方法內部的變量或方法的參數變量都叫局部變量值傳遞：將一個變量的值賦值給另一個變量，其實將原變量中的值，復制一份給新變量。JS中一切賦值都是值傳遞！對未聲明的變量賦值：js會自動在全局創建該變量！函數作用域和變量作用域完全一樣函數作用域在調用方法時創建，方法執行完立刻銷毀！問題：方法參數：依據方法

20、內部的處理邏輯至少需要幾個數據才可正常執行。方法參數和外部定義了哪些變量沒有任何關系。方法參數作用:1.接收外部傳入數據，在方法內處理 2.規定調用方法的人必須提供哪些參數！方法返回值：根據方法調用者的需要！如果方法調用者需要明確返回一個結果，就定義返回值！否則，可以不定義返回值！有返回值的方法，可以當做一個值用！何時必須用變量接??？方法的返回值，后續程序可能反復使用！自定義函數：全局函數：ECMScript定義了標準，由各瀏覽器廠商已經實現的函數。咱們直接調用！ isNaN(x) parseInt/Float(x)encodeURI:將url中的非法字符轉為單字節符號編碼decodeURI：

21、將encodeURI轉后的字符串，轉換回原文解碼返回如下：unicode編碼:每個字符2個字節；字母單字節。utf-8編碼：字母、數字單字節 漢子3字節url規定參數值中，再次出現保留字，就是非法：保留字：/ ？ $ : encodeURIComponent:即能對多字節非法字符編碼，又能對單字節非法字符編碼今后只要使用component就夠了何時使用？將數據通過url發送時，都要先編碼再發送decondeURIComponent：對encodeURIComponent編碼的字碼。收到編碼后的字符串后，都要先解碼，再處理。返回：程序結構：3種：順序；分支；循環分支結構：程序運行過程中，可以根據

22、不同的條件執行不同的任務。分支結構：if結構 ：一件事，要么做，要么不做 ifelse結構：2件事，二選一執行else if結構：多件事，多選一執行語法：if（條件1）/滿足條件1，執行的代碼else if(條件2)/滿足條件2，執行的代碼else if（條件n）/滿足條件n，執行的代碼else/以上條件都不滿足時，默認執行的代碼如果前一個條件已經滿足，則后續else if不再執行！分支結構中的條件，可以不是邏輯表達式！*如果不是，js會自動轉換為Boolean類型：*0，null，undefined,NaN,”都轉為false；其余，都轉為true！*Day04switchcase多條分支，

23、根據條件判斷，選擇執行語法：switch（表達式）case 表達式1：/ 如果表達式的值=表達式1的值 代碼段1；Case 表達式n：代碼段n；default：/如果表達式的值和所有case都不相等， 默認代碼段；運行機制：如果找到與表達式值匹配的case，不但執行當前case下的代碼，而且之后所有代碼都被觸發！ 返回值：break:退出當前結構；返回值> 多個條件共用同一套執行邏輯時，不加break！循環結構：程序反復執行同一套代碼段。遇到結束條件，會結束執行。沒有循環結束條件，永遠循環執行死循環循環三要素：1.循環條件：循環繼續執行的條件。 一旦循環條件不滿足，循環立刻退出！ 2.循

24、環變量：用于循環條件中做判斷的變量 循環變量都會向循環退出的趨勢變化（不滿足循環條件的趨勢）循環計數器3.循環體：每次循環要做的事情while循環：當滿足條件時，就繼續循環做事語法：var 循環變量while（循環條件） 循環體；迭代變化循環變量；break：退出當前結構while中何時用break：循環條件不滿足之前，希望強行退出循環。如何使用break？可以放在任何需要退出循環的位置。隨機數：Math.random():0<=n<1任意minmax之間取隨機數公式：parseInt(Math.random()*(max-min+1)+min)例子：do-while循環：先執行一

25、次循環體，再判斷是否繼續！如果第一次循環條件不滿足，循環體至少可以執行1次！變量聲明提前：相同作用域內，var無論出現在什么位置。解析時，優先提取到js開始位置聲明！while vs do while:如果第一次條件就可能不成，也想執行一次，必須用do while如果第一次條件一定滿足，do while等效于whilefor循環：完全等效于while循環。循環變量變化規律固定，循環次數已知/固定for(聲明并初始化循環變量;循環條件；迭代循環變量;)循環體continue:跳過本輪循環，繼續執行下一輪循環Day05 數組：存儲：連續存儲多個數據的存儲空間 使用：相當于多個變量的集合why?現實

26、中數據都是批量分類管理何時使用：只要批量管理多個數據，就要用數組保存如何使用：創建，初始化，訪問數組中的數據創建：數組都是用創建出來的。var arr=;à創建了一個數組對象，數組中包含0個元素var arr=95,61,95;à創建了一個數組對象，數組中連續存儲3個元素：91,61,95兩個不限制：1.不限制元素個數！2.不限制元素數據類型*數組是引用類型的對象*原始類型：數據保存在變量本地引用類型：數據不保存變量本地！保存在“堆”中。由地址指向實際數據引用類型特點：可以保存多個數據，而且數據個數隨時可變why?原始類型中只能保存一個值，1個值無法精確描述一個東西，現實中

27、，都是用多個屬性共同描述一個東西只要是對象，一定在堆里，對象一定有地址。對象：凡是存儲在堆中的，都是對象！使用引用類型的對象：使用變量，等效于使用對象的地址 使用對象地址，等效于使用對象本身數組對象支持直接輸出數組內容其他數組創建語法：var arr=new Array(num); New:要在堆中開辟空間！ Array：ECMAScript標準中的內置類型 new Array:在堆中創建一個數組類型的存儲區域 （num）：初始創建num個元素var arr=new Array(7);undefined, undefined, undefined, undefined, undefined,

28、undefined, undefinedundefined輸出時，變為一個空字符var arr=new Array(元素1，元素2，元素3，.元素n)；null：一個變量沒有指向任何對象何時使用null：主動釋放對象！主動釋放的對象不能被找回為什么原始類型不適用null?原始類型占用的空間很小，堆中的數據是海量的，占用空間很大null vs undefined:null 專用于主動釋放對象！undefined:專用于自動初始化任何未賦值的變量垃圾回收：js引擎自動銷毀不再被引用的對象！垃圾回收程序：隨js程序運行而后臺同時運行只要對象還有變量引用，就不回收。訪問數組：數組：一組變量的集合。如何

29、獲得其中一個變量/數據：下標，數組中唯一標識一個元素的序號。從0開始。最后一個元素的下標是“元素個數-1”js內置對象不但封裝存儲，而且封裝常用APIAPI：已經實現的方法！可以直接調用！Array API：1. arr.length屬性：數組中的元素個數訪問任意數組的最后一個元素：arrarr.length-1length屬性值，隨數組長度變化而自動變化！js中數組可以根據程序的需要，自動擴容，保證程序正常執行數組擴容和縮容：都是設置length屬性的值。如果length屬性值>舊值，會擴容。；反之，縮容（截斷）被截斷的元素，不能被找到，不會被回收。只能隨數組對象一起回收。固定用法：在

30、任意數組結尾追加一個新元素：arrarr.length=新值；例子：一次輸入員工姓名直到輸入exit退出，輸出所有員工姓名：調用完函數后出棧 什么是數組遍歷：對數組中每個元素執行相同的操作for(var i=0;i<arr.length;i+) arrià當前元素返回：關聯數組：數組下標可以自定義名稱！key/value對兒何時使用關聯數組：數組元素的內容無法描述自己的意義時 使用關聯數組為每個元素起名關聯數組的.length屬性作廢了！所以用for（var key in arr）for in:專門遍歷關聯數組用的！for(var key in arr)/從第一個元素開始，將元

31、素的key賦值給臨時變量keyarrkeyà當前正在遍歷的元素的值（value）例子：返回：關聯數組直接量定義方式：“key1”:”value1”, “key2”:”value3”,還是上面的例子改下：返回：冒泡排序：數組常用方法：x.toString()方法：任何對象都有toString方法，默認用逗號（，）分隔每個元素將對象轉為字符串，一般不主動調用，js在需要時自動調用x.valueof()方法：同toString()var arr=arr.join(“分隔符”)：將數組轉為字符串?？勺远x分隔符！用法：將字符拼接為單詞或句子 固定用法：chars.join（”）;例子：返回值

32、：var newArr=arr.concat(元素值，數組，)：將參數拆散成單個元素，追加到數組中。*不會修改原數組，只能返回新數組對象*返回值：var subArr=arr.slice(start,end+1):截取數組下標從start開始到end位置的元素，生產子數組對象。*含頭不含尾*返回值：arr.splice:刪除！插入！替換！刪除數組元素：arr.splice（start，count）；替換元素：arr.splice（start，count，值1，值2，）插入元素：arr.splice（start，0，值1，值2，）à從下標為2的數組開始刪除2個元素，然后插入16,6,2

33、2三個新的 的元素，刪除兩個插入三個，比原來多了一個元素，數組自動擴容一個。arr.reverse():顛倒所有數組元素 arr.sort():默認升序排列。默認都轉為字符串排序！ Day06排序：arr.sort():默認按字符串升序排列自定義排序：2步：Step1：定義比較器函數！什么是比較器函數？定義任意兩值比較策略的方法比如：num1-num2>0 ànum1>num2 num1-num2<0 ànum1<num2function compare(a,b) return a-b;/如果返回>0數，a>b; 如果返回<0數，a

34、<b; 如果返回<0數，a<b;如果剛好=0，a=b；Steb2：將比較器函數傳遞給sort方法！如何將方法作為參數傳遞？Js中方法也是一個對象！方法名就是指向方法對象的變量名！function compare(a,b)return a-b;/可以定義在使用前后的任何位置/原因：var聲明和function聲明自動提前！相當于：var compare=new Function(“a”,”b”,return a-b);/必須定義在使用之前！原因僅聲明提前，賦值不提前。這里的Function中的F必須大寫，可能選擇題會考。arr.sort(compare);注意！將方法作為對象傳

35、遞時，僅使用方法名，后不加圓括號。返回值：降序：顛倒比較結果的正負，可以導致升序變降序升序：Function compareASC（a，b）return a-b；顛倒（*-1）：Function compareDESC（a，b）return -（a-b）；例子：棧和隊列：什么是棧？后進的先出?。↙IFO-last in fist out）棧其實就是數組，只不過用一對兒方法模擬了棧的操作！入棧：arr.push() 出棧：var last=arr.pop()只能從數組一端出棧，入棧。另一端封閉！棧和隊列：js中，其實就是數組！ 棧：只能從一端插入/彈出元素，另一端封閉。棧操作：結尾入棧出棧：入棧

36、：arr.push（值1，.） 出棧：var last=arr.pop（）；/給個變量接住出來的 開頭入棧出棧：所有元素下標隨入棧出棧操作而變化 入棧：arr.unshift（值1，） 出棧：var first=arr.shift()隊列：FIFO 先到先得 入隊列：arr.push(值1.) 出隊列：var first=arr.shift（）二維數組：數組的元素又是另一個數組對象！創建二維數組：創建普通數組，完全一樣！ 只不過將普通元素，換為一個數組對象而已比如：var arr=1,2,3; var arr2=1,2,3,4,5,6,7,8; arr23=11,12,13;如何訪問二維數組中

37、的任意元素： arr父數組中的下標子數組中的下標何時使用二維數組：數據包含明顯上下級關系內置對象：10個內置對象要記住，筆試string包裝類型：*字符串內容一旦創建，不能改變 str.length:返回str字符串中的字符個數 比如：var str=”Hello馬里奧”； str.length/8 str的length只管個數，不管字節大小寫轉換：都轉小寫：str=str.toLowerCase()都轉大寫：str=str.toUpperCase()何時使用：希望大小寫一視同仁時，就要先轉換，再處理Day7轉義字符：代替字符串中的非打印字符：n t如果字符串內容中包含和語法沖突的特殊字符，可

38、用轉為普通字符！比如：console.log（”js是互聯網”第一大語言”）;字符串內容一旦創建不可改變！如果修改。都要創建新字符串，保存新結果，替換舊字符串var str=”Hello”;str.toUpperCase();console.log(str);*規律：所有字符串API ，都需要變量接收返回值！*字符串的字符個數：str.length屬性字符串類型底層其實都是用字符數組實現的比如：stri大小寫轉換：大小寫字母一視同仁時，先轉化，再處理比如：重名驗證，重復郵箱，驗證碼獲取指定位置字符：var char=str.charAt（index）; 在index位置的char獲取指定位置字

39、符的unicode編號：var num=str.charCodeAt(index);字符串三大操作：1.查找關鍵字！2.替換關鍵字3.獲取子字符串查找關鍵字：var index=str.indexOf（”關鍵字”）；返回關鍵字所在位置！*如果沒找到，返回-1！*IndexOf：懶：只找第一個關鍵字的位置！蠢：默認只能從位置0開始！var index=str.indexOf（”關鍵字”,from）;from:開始查找的位置。從from開始向后查找從最后一個字符，向前找：只要關鍵字離結尾近，就用lastvar index=str.lastIndexOf(“關鍵字”,from);from：開始查找的

40、位置，從from開始向前查找*返回的index完全相同！因為字符在數組中的下標是固定的！所以與查找方向無關*2. 獲取子字符串：var subStr=str.slice(start,end+1)Str.substring(start,end+1)用法同slice！唯一差別：不支持負值作為參數！str.substr (start,count) count表示個數以上三個方法省略第二個參數，默認都是取到結尾！按規律分割字符串：var subs=str.split(“分隔符”，count)à中括號表示可加可不加，加count表示要切的個數鄙視題：把no zuo no die每個單詞第一個字

41、母變大寫，輸出返回：課堂練習：判斷字符的種類：unicode范圍：48-57： 0-9數字字符65-90： A-Z 大寫字母97-122: a-z 小寫字母19968-40869：漢字其他字符什么是模式匹配：可以設置查找或替換的規則！何時使用模式匹配：要查找的關鍵字可能發生有規律的變化。如何使用模式匹配：1.先定義模式：/關鍵字/模式比如：var reg=/no/i; no是要查找的關鍵字原文，不管是不是字符串，都不加”i表示忽略大小寫！String類型中，提供了專門支持模式匹配的API！按模式替換關鍵字：str=str.replace(reg,”新值”);默認replace僅替換第一個關鍵字

42、！要想全局替換，要在模式中定義“g”獲得*所有*關鍵字的*內容*：var kwords=str.match(reg);只能取得關鍵字的內容，無法確定每個關鍵字的位置！kwords.length：找到的關鍵字個數！*如果未找到，返回null！*只要有可能返回null！都要先判斷！=null，再處理！var index=str.search(reg);和indexOf完全相同！IndexOf不支持模式查找！search其實是indexOf的模式查找版*正則表達式：*重點什么是正則表達式：字符串中字符出現的規則何時使用正則表達式？驗證字符串格式，查找關鍵字，替換關鍵字比如：銀行卡查詢密碼：6位數字

43、用戶名：字母，數字，_的組合正則表達式：選擇符號:所有備選字符：必須多選一使用一個,只能代表1位字符的規則！xxxx:表示除了xxxx都行！注意必須放在中的第一個位置，否則，變為普通字符匹配。-符號：字符的范圍：備選字符連續的范圍！比如：0-9 a-z A-Z a-zA-Z/-可以局部使用漢字范圍：u4e00-u9fa5預定義字符集：使用簡化的符號，定義字符集比如：0-9- ->d a-zA-Z0-9- ->w 空字符- ->s如果規則正文中出現特殊符號，用轉為原文比如：”.” 表示一個任意字符！. 表示愿意.數量詞：規定前邊一個字符出現次數的量詞語法：min,max num

44、:固定長度 min,:至少min個，多了不行手機號：86s13578d9用戶名：w8,16Day8比如 ：驗證座機號碼：d3,4-d7,8特殊數量詞：+ * ？ 如果正文中出現+*?,都要用轉義？：可有可無用？，如果有，最多只能出現一次*：也是表示可有可無，但不限制出現次數+：至少出現一次！不限制出現次數():分組：改變模式的匹配順序比如：驗證身份證號：d15(d20-9xX)?比如：驗證手機號：(+86)?s*134578d9:整個正則表達式的開頭，表示以xxx開始$:整個正則表達式的結尾，表示以xxx結束？=:預判，前一個字符之后，必須緊跟xxx？！:預判，前一個字符之后，必須不能跟xxx

45、課堂練習：中文姓名：u4e00-u9fa52,6電子郵件：w+w+(-w+)*(.w+)+其中：w+(-w+)* - -匹配域名一個以上的字母，后可跟“-字母”，可有可無（.w+）+  “.字母”組合至少出現1次。RegExp對象：專門封裝一條正則表達式，提供使用正則表達式的常用API如何使用RegExp對象：1.創建 2.調用API如何創建正則表達式對象：var regExp=/正則表達式/ig;API:var boolcan=regExp.test(“被檢查的字符串”)如果驗證通過：返回true；否則返回false驗證要求完整匹配！查找要求部分匹配！test方法默認：只要找到就返

46、回true！如何讓test完全匹配：正則表達式前加,正則表達式后加$;查找：exec：查找關鍵字的位置，又能找到關鍵字的內容indexOf不支持正則，search支持正則，每次只能找1個match所有內容，但得不到位置！var arr=regExp.exec（”被查找的內容”）arr0:找到的關鍵字內容arr.index屬性：找到的關鍵字的位置exec方法每次也只能找一個，但是每次自動修改regExp對象的lastIndext屬性！regExp對象的lastIndex屬性：表示下次開始匹配的位置！查找：僅判斷有沒有，或者僅查找位置：indexOf 支持正則表達式：search() 僅找所有關鍵

47、字的內容：match() 既找位置，又找內容:excc()從正則表達式匹配的內容中，取一部分：RegExp.$nn:正則表達式中第n個分組，其實就是第n個圓括號強調：分組從1開始必須通過RegExp類型，直接調用$n,不能使用對象！string對象與正則表達式str.replace(/正則表達式/ig,”替換值”)str.match(/正則表達式/ig) str.search() str.split(/正則表達式/)trim功能：去除字符串開始和結尾的空格。中間空格不去掉！對輸入字符串的處理，多數要先清除開頭和結尾空格，再處理IE8不支持trim()方法！自定義一個trim方法解決IE8不支持

48、的問題：String總結：所有API都無法修改原字符串，都會返回新字符串，所有stringAPI都需要用變量保存結果！str.length字符個數str=str.toLowerCase()/toUpperCase()查找關鍵字：var index=str.indexOf(“關鍵字”,from) var arr=str.match(/正則表達式/g)獲得子字符串：var substr=str.slice(start,end+1); str.substring(start,end+1); str.substr(start,count);替換：str=str.replace(/正則表達式/g,”替換

49、值”);獲得指定位置的字符：var char=str.charAt(index) strindex字符編碼轉碼：var code=str.charCodeAt(index); var char=string.fromCharCode(code);RegExp對象總結：var reg=/正則表達式/ig；var reg=new RegExp(“正則表達式”，ig)；其中所有都要改為!*驗證str中是否包含reg匹配的關鍵字：var boolean=reg.test(str);*強調：完整驗證，都需要在正則表達式前加后加$*同時查詢所有關鍵字的內容和位置while(arr=reg.exec(str

50、)!=null) arr0- ->找到的一個關鍵字 arr.index- ->當前關鍵字的位置RegExp.$n:獲得正則表達式中第n個分組（圓括號）匹配的子字符串Math類型：封裝了所有數學計算有關的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(底數，冪)Math.

51、sqrt(num)/開平方根！var n=9;Mat.pow(n,3);Math.sqrt(n)/3絕對值：Math.abs(num)Math.max/min(值1，值2)取數組中的最大值：var max=Math.max.apply(Math,arr)取數組中的最小值：var min=Math.min.apply(Math,arr)找出數組中的最大值，固定用法：把max改成min找出的是最小值隨機數：Math.random():0<=r<1任意min-max：Math.floor(Math.random()*(max-min+1)+min)練習：隨機生成4位驗證碼完整驗證碼代碼如

52、下：var codes=;/數字：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之間取隨機數 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. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網頁內容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業或盈利用途。
  • 5. 人人文庫網僅提供信息存儲空間，僅對用戶上傳內容的表現方式做保護處理，對用戶上傳分享的文檔內容本身不做任何修改或編輯，并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容，請與我們聯系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論