安裝 安裝visual studio codejava
安裝visual studio code插件正則表達式 |
正則表達式概述(Regular Expression)算法 專門描述字符串中字符出現規則的表達式。sql |
1.正則表達式可用於:1).驗證字符串格式編程 2).查找敏感詞json |
2.字符集簡寫:若是[]中部分備選字符連續,可用-省略中間字符數組 好比:[0123456789]可簡寫爲[0-9]promise 要匹配一位小寫字母:[a-z]瀏覽器 要匹配一位字母[A-Za-z] 匹配一位字符或者數字:[0-9A-Za-z] 要匹配一位漢字:[\u4e00-\u9fa5] |
3.預約義字符集正則表達語法爲四種經常使用的字符集定義了最簡化寫法,稱爲預約義字符集。
|
1.查找:1). 查找一個固定的關鍵詞出現的位置: var i=str.indexOf("關鍵詞"[,starti]) 在str中從starti位置開始找下一個"關鍵詞"的位置 若是省略starti,則默認從0位置開始向後找 返回: 「關鍵詞」第一字所處位置的下標 若是找不到,返回-1 問題: 只支持查找一個固定不變的關鍵詞
|
2. 用正則表達式查找一個關鍵詞的位置:var i=str.search(/正則/i); 在str中查找符合"正則"要求的敏感詞 返回值: 關鍵詞的位置 若是找不到,返回-1 問題: 正則默認區分大小的! 解決: 在第2個/後加後綴i,表示ignore,意爲:忽略大小寫 問題: 只能得到關鍵詞的位置,不能得到關鍵詞的內容 解決: match |
3. match:1). 查找一個關鍵詞的內容和位置: var arr=str.match(/正則/i); 在str中查找符合"正則"要求的敏感詞的內容和位置 返回值: 數組arr:[ "0":"關鍵詞", "index": 下標i ] 若是找不到: 返回null 問題: 只能查找第一個關鍵詞,不能查找更多關鍵詞 2). 查找全部關鍵詞的內容: var arr=str.match(/正則/ig) //g global 全局/所有 返回值: 保存多個關鍵詞內容的數組 問題: 只能找到內容,沒法得到位置 |
4. 即得到每一個關鍵詞的內容,又得到每一個關鍵詞的位置reg.exec() |
5. 替換: 將找到的關鍵詞替換爲指定的新值2種方式: 1). 簡單替換: 將全部關鍵詞替換爲統一的新值 str=str.replace(/正則/ig,"新值") 查找str中全部符合「正則」要求的關鍵詞,都替換爲統一的新值。 問題: 全部字符串API都無權修改原字符串,只能返回新字符串。 解決: 若是但願替換原字符串,就必須本身手動賦值回原變量中 衍生操做: 刪除關鍵字: 其實將關鍵詞替換爲"" 2). 高級替換: 根據每次找到的關鍵詞不一樣,動態選擇要替換的新值 str=str.replace(/正則/ig, function(kword){ 根據kword的不一樣,動態生成新值 return 新值 }) 查找str中全部符合「正則」要求的關鍵詞 每找到一個關鍵詞,就自動調用一次回調函數 每次調用回調函數時自動傳入本次找到的關鍵詞給kword 回調函數中根據每次收到kword的不一樣,動態返回新值給replace函數 replace函數自動將回調函數返回的新值,替換到字符串原關鍵詞位置。 |
6. 切割: 將一個字符串,按指定的切割符,切割成多段子字符串2種: 1). 簡單切割: 切割符是固定的 var arr=str.split("切割符") 將str按指定的"切割符",切割爲多段子字符串,保存在數組arr中 固定套路: 打散字符串爲字符數組 var chars=str.split("") 2). 複雜切割: 切割符不是固定的 var arr=str.split(/正則/i) |
三. RegExp對象: |
1.什麼是:保存一條正則表達式,並提供了用正則表達式執行驗證和查找的API 的對象 2.什麼時候使用:只要在程序中保存和使用正則表達式,都要用RegExp對象 3. 如何使用:建立: 1). 用/建立(直接量): var reg=/正則/ig 什麼時候: 若是正則表達式是固定不變的 2). 用new建立: var reg=new RegExp("正則","ig") 什麼時候: 若是正則表達式須要在運行時才動態生成時
|
4.API:1). 驗證: var bool=reg.test(str) 用正則reg,檢測str是否符合正則的格式要求 問題: 正則默認只要找到部份內容與正則匹配就返回true 解決: 必須從頭至尾完整匹配,才返回true 只要驗證,必須前加^後加$,表示從頭至尾的意思 2). 查找: 獲取每一個關鍵詞的內容和位置: var arr=reg.exec(str) 在str中查找下一個符合reg要求的關鍵詞的內容和位置 若是反覆調用reg.exec(),則自動會向後找下一個。 找不到時返回null 返回值: arr:[ "0":"關鍵詞", "index": 關鍵詞位置 ]
總結: a).驗證只能用test d).既找內容有找位置用match e).找全部關鍵詞內容和位置用exec |
1.什麼是函數 |
什麼是函數: 封裝一項任務的步驟清單代碼段的對象,再起一個名字。 爲何: 重用! 什麼時候: 只要一段代碼可能被反覆使用,都要建立函數。 |
2.如何使用 |
1).建立函數: JavaScript中建立函數的三種方式 a).使用function關鍵字聲明方式建立命名函數
b).使用直接量賦值方式建立命名函數 var 函數名=function(形參1,形參2,...){ 函數體; return 返回值; } c).使用Function構造方法建立函數 |
3.重載(overload) |
1). 什麼是: 相同函數名,不一樣形參列表的多個函數,在調用時,可自動根據傳入實參的不一樣,選擇對應的函數調用
2).爲何: 減小函數名的數量,減輕維護的負擔 3).什麼時候用: 一件事,可能根據傳入的參數不一樣,執行不一樣的操做時 4).如何: 問題: js語法默認不支持重載 由於js不容許多個同名函數同時存在 若是存在,最後一個函數會覆蓋以前全部 解決: 使用arguments對象變通實現 什麼是arguments對象: 每一個函數內自動建立的,準備接受全部傳入函數的實參的 類數組對象 自動建立: 不用本身建立,就可直接使用 接受全部實參: 類數組對象: 長的像數組的對象 vs 數組: 相同: 1. 下標 2. length 3. 遍歷 不一樣: 類型不一樣,API不通用 什麼時候: 只要不肯定未來傳入函數的參數個數時,就不定義形參列表,而是用arguments接住全部的實參值。
|
4.匿名函數: |
什麼是: 定義函數時,不寫名的函數 什麼時候: 若是一個函數只用一次,不會反覆使用,就不起函數名 爲何: 節約內存!——使用一次後,自動釋放! 如何: 2種場景: a). 回調函數: 本身定義的函數,本身不調用,而是傳給其它對象或函數,被別人調用。 arr.sort(function(a,b){return a-b}) xhr.onreadystatechange=function(){ ... } pool.query(sql,[參數],function(err,result){ ... }) b). 匿名函數自調: 定義函數後,馬上本身調用本身 爲何: 避免使用全局變量,形成全局污染 什麼時候: 全部js代碼都應該封裝在一個匿名函數自調中 如何: (function(){ ... })()//調用後,匿名函數內的局部變量都釋放了 |
5. Function做用域和做用域鏈 |
6.閉包閉包就是可以讀取其餘函數內部變量的函數。例如在javascript中,只有函數內部的子函數才能讀取局部變量,因此閉包能夠理解成「定義在一個函數內部的函數「。在本質上,閉包是將函數內部和函數外部鏈接起來的橋樑 |
四. OOP |
1.什麼是對象:程序中,描述現實中一個具體事物的程序結構 爲何: 便於維護 2.什麼是面向對象:程序中,都是先將多個事物的屬性和功能,封裝爲多個對象,再按需調用對象的成員 什麼時候: 從此,幾乎全部程序,都用面向對象方式實現的 如何使用: 封裝,繼承,多態——三大特色 3.面向對象三大特色:封裝:建立一個對象,集中保存一個具體事物的屬性和功能 爲何: 便於大量數據維護 什麼時候: 只要使用面向對象編程,都要先封裝對象,再按需使用對象的成員 如何: 3種: 1). 用{}: var obj={ 屬性名: 值, ... : ... , 方法: function(){ ... this.屬性名... }, ... : ... } 訪問對象的成員: =屬性+方法 屬性其實就是保存在對象中的變量 對象.屬性 方法其實就是保存在對象中的函數 對象.方法() this: 什麼是: 在函數調用時,自動指向 . 前的對象的關鍵詞 爲何用: 避免在對象的方法中寫死對象名,造成緊耦合。 什麼時候用: 只要對象本身的方法,想訪問本身的成員時,都要加this. 強調: 筆試時: a). this和定義在哪兒無關,只和調用時.前的對象有關 b). 全局函數調用沒有 . , this默認指window 2). 用new建立: 2步: var obj=new Object(); obj.屬性名=值; ... = ...; obj.方法名=function(){ ... this.屬性名 ...} 揭示: js中一切對象底層,都是關聯數組 *). 訪問不存在的成員,不報錯,返回undefined *). 強行給不存在的成員賦值,不報錯,而是強行賦值新成員 *). 一樣可用for in循環遍歷一個對象中的全部成員 *). 訪問下標: 2種: 1. obj["下標"] 若是屬性名須要動態得到 2. obj.下標 若是屬性名是寫死的 問題: 一次只能建立一個對象,若是反覆建立多個相同結構的對象時,代碼會很冗餘 解決: 用構造函數建立對象: 3). 用構造函數反覆建立多個相同結構的對象: 什麼是構造函數: 描述同一類型全部對象的統一結構的函數 什麼時候: 反覆建立多個相同結構的對象 如何: 定義構造函數: function 類型名(形參1,形參2,...){ this.屬性名=形參1; this. ... =形參2; this.方法名=function(){ ... this.屬性名 ...} } 反覆調用構造函數,建立多個相同類型的對象 var lilei=new 類型名(實參,...); new 4件事: *). 建立一個新的空對象: {} *). 讓新對象自動繼承構造函數的原型對象: 新對象._ _proto_ _=構造函數.prototype *). 用新對象調用構造函數: 自動將構造函數中的this->new 經過強行賦值新屬性的方式,自動添加規定的屬性到新對象中,並將參數值,保存到新對象的對應屬性中 *). 返回新對象的地址給變量 構造函數優勢: 重用結構 缺點: 沒法節約內存!
繼承: 什麼是: 父對象的成員,子對象無需重複建立就可直接使用 爲何: 重用代碼,節約內存 什麼時候: 只要在多個子對象中包含部分相同的成員時 如何: /****** 必須知道的原理 *******/ js中的繼承都是繼承原型對象(prototype) 什麼是原型對象: 集中保存全部子對象共有成員的父對象 建立原型對象: 買一贈一 每建立一個構造函數,就附贈一個空的原型對象 構造函數.prototype 什麼時候繼承: new的第2步: 讓新對象自動繼承構造函數的原型對象: 新對象._ _proto_ _=構造函數.prototype 繼承裏的自有屬性和共有屬性: 自有屬性: 保存在當前對象本地,僅歸當前對象自有的屬性 共有屬性: 保存在原型對象中,歸多個子對象共有的屬性 取值/訪問時: 對象.成員名 修改時: 修改自有屬性: 子對象.屬性=值 修改共有屬性: 原型對象.共有屬性=值 若是強行用子對象.共有屬性=值 後果: 爲子對象本身添加一個同名的自有屬性,今後子對象與父對象再無關係。——錯誤! 內置對象的原型對象: 內置對象: ES標準中規定的,瀏覽器已經實現了的,我們能夠直接使用的對象 js內置對象: 11個: String Number Boolean Array Date RegExp Math Error Function Object global 其實,每種內置對象(除Math和global外)都是一種類型: 都由兩部分組成: 1. 構造函數: 建立該類型的子對象 2. 原型對象: 保存該類型共有的函數 原型鏈: 什麼是: 多級原型對象逐級引用造成的鏈式結構 做用: *. 保存了一個對象可用的全部成員 *. 控制着成員的使用順序: 先自有,再共有 多態: 什麼是: 一個函數在不一樣狀況下表現出不一樣的狀態 2種: *. 重載: *. 重寫(override): 子對象中定義了和父對象中同名的成員 什麼時候: 只要子對象以爲父對象的成員很差用,就要定義自有的,來屏蔽父對象的。 4.自定義繼承
5.靜態靜態(static)方法: 先了解什麼是實例(instance)方法: 必須先有一個實例對象,才能調用的方法 好比: var arr=[1,2,3]; arr.sort() var str="Hello"; str.toUpperCase() 限制: 只有當前類型的子對象,才能使用的方法 什麼是靜態方法: 不須要任何實例,就可用類型名直接調用的方法(不是用具體的對象object調而是用·前的類型名) 好比: Object.setPrototypeOf() 什麼時候使用: 2種: 1. 不肯定使用該方法的對象的類型時 2. 調用函數時,暫時沒法肯定要使用該函數的對象是什麼 如何定義: 定義實例方法: 將方法添加到原型對象中 定義靜態方法: 將方法添加到構造函數對象上 構造函數.靜態方法=function(){ ... } |
五. ES5: |
1. 嚴格模式:什麼是: 比普通js運行要求更嚴格的模式 爲何: js語言自己有不少廣受詬病的缺陷 什麼時候: 從此全部js代碼都要運行在嚴格模式下 如何: 在當前做用域的頂部: "use strict";
要求: *). 禁止給未聲明的變量賦值: *). 靜默失敗升級爲錯誤: 靜默失敗: 執行不成功,也不報錯! 2). 禁用了arguments.callee arguments.callee: 在調用函數時,自動得到當前正在執行的函數自己(實際上是ES5禁用遞歸)。 什麼時候: 專門用於在遞歸算法中,代替寫死的函數名 遞歸的問題: 效率極低!是由於重複計算量太大! 解決: 幾乎全部的遞歸均可以用循環代替 3). 普通函數調用和匿名函數自調中的this再也不指向window,而是undefinde 2.保護對象:爲何: js中的對象毫無自我保護能力 什麼時候: 若是不但願別人擅自修改對象的屬性和結構時 1).如何: 保護屬性: 將全部屬性劃分爲2大類: 命名屬性: 可用 . 訪問到的屬性 又分爲2類: 數據屬性: 直接存儲屬性值的屬性 訪問器屬性: 不實際存儲屬性值,僅負責提供對另外一個數據屬性的保護。 內部屬性: 不能用 . 訪問到的屬性
數據屬性: ES5規定,每一個數據屬性,實際上是一個縮微的小對象 每一個屬性對象其實包含四個特性: { value: 實際存儲屬性值, writable: 控制是否可修改, enumerable: 控制是否可被for in遍歷,但用.依然能夠訪問 configurable: 控制是否可刪除該屬性 控制是否可修改其它兩個特性 默認: 三個開關都是true 獲取一個屬性的四大特性: var attrs=Object.getOwnPropertyDescriptor(obj,"屬性名") 得到obj對象的指定"屬性"的四大特性 打開和關閉開關: Object.defineProperty(obj,"屬性名",{ 從新定義obj的指定"屬性"的開關 開關: true/false, ... : ... }) 問題: 一次只能修改一個屬性的四大特性 解決: Object.defineProperties(obj,{ 屬性:{ 開關:true/false, ... : ... }, 屬性:{ ... ... } }) 問題: 沒法使用自定義規則保護屬性 解決: 訪問器屬性: 什麼時候: 只要使用自定義規則保護一個數據屬性時 如何: 前提: 必須先有一個隱藏的數據屬性,實際存儲屬性值 定義訪問器屬性: 使用訪問器屬性: 完善以上倆個構造函數的綜合
2).保護結構: 禁止添加/刪除對象中的屬性 3個級別: *). 防擴展: 禁止添加新屬性 Object.preventExtensions(obj) 禁止給obj對象添加任何新屬性 再試圖添加,就會出現錯誤 原理: 每一個對象中都有一個內部屬性: extensible:true preventExtensions()將對象的extensible:false *). 密封: 在兼具防擴展同時,再禁止刪除現有屬性 Object.seal(obj) 禁止向obj中添加新屬性 禁止刪除obj中現有屬性 原理: 將extensible:false 同時還將每一個屬性的configurable:false *). 凍結: 在兼具密封的基礎上,同時禁止修改全部屬性值 Object.freeze(obj) 禁止向obj中添加新屬性 禁止刪除obj中現有屬性 禁止修改任何屬性的值 原理: 自動將每一個屬性的writable改成false 通常用於凍結公共屬性 3.call/apply/bind()替換this: 1). 臨時調用一次函數,並臨時替換一次this: call: 傳入函數的每一個實參必須做爲一個單獨的參數傳入 apply: 傳入函數的每一個實參必須放在一個數組中總體傳入(apply的比call多一個功能就是打散數組,但結果和call是同樣的) 什麼時候: 若是全部實參是放在一個數組中給你的 2). 不調用函數,而是建立一個原函數的副本,副本永久綁定this和部分參數值: bind 什麼時候使用: 修改回調函數的this時只能用bind 4.數組API:1). 查找: indexOf: 同String中的indexOf 什麼時候使用: 在數組中查找一個指定元素的位置時 2). 判斷: 判斷數組中的元素是否符合要求 *). 判斷數組中的元素是否都符合要求 var bool=arr.every(function(elem, i, arr){ return 判斷結果 }) every會自動拿着回調函數在每一個元素上執行一次: 參數: elem自動獲得當前元素值 i 自動獲得當前位置 arr 自動獲得當前數組對象 返回值: 利用得到的參數,判斷當前元素是否符合要求,並返回判斷結果。 只有回調函數在每一個元素上執行都返回true時,才總體返回true。只要碰到一個false,就返回false *). 判斷數組中是否包含符合要求的元素 var bool=arr.some(function(elem, i, arr){ return 判斷條件 }) some和every不一樣的地方是隻要包含一個知足條件的整個some就返回true
3). 遍歷API: 對數組中每一個元素執行相同的操做 *). 遍歷原數組中每一個元素,執行相同的操做: arr.forEach(function(elem, i, arr){ 對原數組中的元素值,執行操做 }) *). 依次取出原數組中每一個元素,執行相同的操做後,放入新數組中返回: var newArr=arr.map(function(elem,i,arr){ return 新值 }) 4). 過濾和彙總: 過濾: 複製出數組中符合條件的元素,組成新數組返回 var subArr=arr.filter(function(elem,i,arr){ return 判斷條件 }) 彙總: 對數組中每一個元素的值進行統計,得出一個彙總的結果。 var result=arr.reduce( function(prev,elem,i,arr){ //prev: 得到截止目前的臨時彙總值 return prev+elem }, base//起始時的基數 ) |
六.ES6: |
ES6:不改變原理的基礎上,讓API變的更簡化 1. let: 代替var用於聲明變量1). var的缺點: *). 聲明提早: *). 沒有塊級做用域: 2).let的優勢: *). 阻止了聲明提早 *). 讓let所在的塊({...})也變爲一級做用域 2.參數加強:1). 默認值: ES6中能夠給形參提早設置一個默認值,調用時,若是沒有給實參,就自動啓用默認值代替。 如何: function fun(形參1, 形參2,..., 形參n=默認值){} 強調: 帶默認值的形參必須出如今參數列表的末尾 2). 剩餘參數: 代替arguments: arguments的問題: *). 不是純正的數組類型,而是類數組對象,致使數組的全部API,arguments不能使用 *). 只能接住全部參數,不能有選擇的接住部分參數 如何使用剩餘參數: function fun(形參1, 形參2,...數組名){ //數組中就接住了除形參1,形參2之外的剩餘的實參 //且"數組"是純正的數組類型,可使用全部數組家的API } *注意:...三個點是語法,做用是收集 剩餘參數的優勢: *). 是純正的數組,可以使用全部數組家API 3). 散播(spread): 代替apply,用於專門打散數組類型參數爲單個值 apply的問題: 其實apply的主要功能是替換this,順便打散數組類型參數 什麼時候: 只要單純但願打散數組類型參數爲單個值時 如何: 調用時: fun(...數組名) 先把數組打散後,再分別傳給fun 至關於: fun(數組[0],數組[1],數組[2],...) *注意:...三個點是語法,做用是打散 3. 箭頭函數: 簡寫一切匿名函數1).簡化 *). 去function變=> *). 若是隻有一個參數,可省略() *). 若是函數體只有一句話,可省略{} 若是僅有的一句話是return... ,則必須省略return 特性: 內外this通用! 若是和this無關時,或但願內外this通用時,可改箭頭函數 若是不但願內外this通用時,就不能用箭頭函數 4.解構: 提取出一個大的對象中的部分紅員,單獨使用。1). 數組解構: 下標對下標: var arr=[elem1, elem2,...]; || || var [變量1,變量2,...]=arr; 變量1=elem1 變量2=elem2 2). 對象解構: 屬性對屬性 var obj={屬性1:值1, 屬性2:值2, ... } || || var {屬性1: 變量1, 屬性2:變量2, ... }=obj 變量1=值1; 變量2=值2; 3). 參數解構: 實際上是對象解構在函數傳參時的應用 什麼時候用: 多個形參都不肯定是否有值時 如何: *). 定義函數時: 將全部形參都定義在對象結構中 function fun({ url:url, type:type, data:data, dataType:dataType }){ } 可簡寫爲: function fun({url, type, data, dataType}){ *). 調用時: 全部實參都要放在一個對象結構中總體傳入 fun({ url:"http://localhost:3000/index", type:"get", //data:, dataType:"json" }) 結果: 形參url ="http://localhost:3000/index 形參type="get" 形參data=undefined 形參dataType="json"
優勢: *). 與參數個數無關 *). 與參數順序無關
5.for of: 遍歷索引數組1). for: for(var i=0;i<arr.length;i++){ arr[i] //當前元素 } 2). forEach: arr.forEach( (elem,i,arr)=>{ elem //當前元素值 }) 不靈活: *). 不能控制順序 *). 不能控制步調 3). for of for(var elem of arr){ elem //當前元素值 } 不靈活: 只能得到元素值,不能得到元素位置 vs for in: for of: 可遍歷數字下標的索引數組或類數組對象 for in: 只能遍歷非數字下標的關聯數組或對象(for in 不建議遍歷索引數組,有風險,由於in不止遍歷下標包括非數字的下標所有遍歷,對於混搭的數組來講有風險) 6.class: 對整個面向對象的簡化:1).簡化 *). 對單個對象直接量的簡化: var obj={ 屬性1: 值1, 屬性2 : 變量, //若是屬性名恰好和變量名相同,則只寫一個 方法名:function(){//全部方法,再也不須要:function ... ... } } *). 對一種類型定義的簡化: class *). 用class{}包裹構造函數和原型對象方法 *). 將構造函數名提高爲類型名,構造函數統一改名爲constructor *). 全部原型對象方法不用再添加到Prototype中,而是直接寫在class內,與構造函數平級(不要逗號) class Plane { constructor (fname,speed,score){ this.fname=fname; this.speed=speed; this.score=score; } fly(){ ... } getScore(){ ... } } 2). 繼承: *). 讓子類型繼承父類型: class Child extends Father{ extends代替了Object.setPrototypeOf(...) *). 子類型構造函數中必須先借用父類型構造函數: class Child extends Father{ constructor(...){ super(參數,...)//借父類型的構造函數 this.xxx=xxx; } } super代替了Father.call(this,...) super中不要加this! 3).封裝 *).訪問器屬性: class 類名{ constructor(..., age){ ... ... 半隱藏的_age屬性 this.age=age; } get age(){ return this._age;} set age(value){驗證value並賦值} } *). 靜態方法: class 類名{ constructor(){ } //必須使用當前類型的子對象才能調用的方法,稱爲實例方法。 實例方法(){ ... } //不須要使用當前類型的子對象,就可用類型名直接調用的方法 static 靜態方法(){ ... } } 調用時: //靜態方法不須要提早建立任何該類型的子對象,就可用類型名直接調用 類型名.靜態方法() var obj=new 類型名() //實例方法要求必須先建立該類型的子對象,纔可用子對象調用實例方法。 obj.實例方法() 7.promise1).什麼時候:多個異步方法,要求必須順序執行時。 2).爲何:爲了解決回調地獄問題 回調地獄:由於回調函數的嵌套層級太深致使的代碼可讀性差。 形成根源:異步函數的下一項任務,只能在函數調用初期就提早傳入函數
3). 如何實現promise
須要修改的幾個地方 Object.create()什麼是: 建立一個新對象,讓新對象繼承指定的父對象 什麼時候: 在沒有構造函數的狀況下,也想建立子對象繼承父對象時 如何: var child=Object.create(father,{ 自有屬性:{ value:值, 三個開關... } }) |