定時器this指向window javascript 的執(zhí)行過程 預(yù)解析(變量) 數(shù)據(jù)集和功能集---- 對象 對象----屬性和方法 -------------------面向?qū)ο?----------------------- 面向?qū)ο笫且环N編程思想,把我們要做的復(fù)雜事物中的 所有內(nèi)容都抽象成一些對象,通過處理這些對象的關(guān)系 完成我們要做的事情面向?qū)ο蠛锰?1.方便多人協(xié)同開發(fā) 2.便于后期代碼維護 注意:面向?qū)ο笾皇菍γ嫦蜻^程代碼的封裝, 并不能替代面向過程的開發(fā)方式面向?qū)ο笕? 封裝 繼承 多態(tài)(抽象)-------將現(xiàn)實中的事物 抽象為代碼中的屬性 和 方法 的無序集合----------------對象: 就是將現(xiàn)實事物抽象為功能代碼. 將現(xiàn)實世界的東西,用對象的語法格式來表示....---------------------------對象三種寫法---------------------- 對象字面量 方式創(chuàng)建（重點 較為常用）- 對象字面量：是封閉在花括號對 {} 中的一個對象的0個或多個 鍵:值 無序列表 - 鍵：相當于屬性名 - 值：相當于屬性值，可以是任意類型的值（數(shù)值類型、字符串類型、布爾類型，甚至 函數(shù)類型）1.對象字面量 var star = {name : '劉德華',age : 18,sex : '男',sayHi : function(){alert('大家好啊~');} };- Object() 是構(gòu)造函數(shù) 第一個字母大寫 - new Object() 是調(diào)用構(gòu)造函數(shù) 因為構(gòu)造函數(shù)需要new 來調(diào)用 同時再內(nèi)存中創(chuàng)建一個對象 - 注意里面使用的時候用點 不是 冒號 2.new Object 創(chuàng)建對象var stuObj = new Obect(); stuObj.name = 'james'; stuObj.age = 11; stuObj.sex = true; stuObj.sayHi = function(){alert('大家好啊~'); } 自定義構(gòu)造函數(shù)1. 構(gòu)造函數(shù)用于創(chuàng)建某一大類對象，首字母要大寫。2. 構(gòu)造函數(shù)要和new一起使用才有意義。function Person(name, age, sex) {this.name = name;this.age = age;this.sex = sex;this.sayHi = function() {alert('我的名字叫：' + this.name + '，年齡：' + this.age + '，性別：' + this.sex);} } var bigbai = new Person('大白', 100, '男'); var smallbai = new Person('小白', 21, '男'); console.log(bigbai.name); console.log(smallbai.name);-----------什么是對象?------------ 代碼中的對象是一些屬性和方法的無序集合 抽述現(xiàn)實世界中的一些事物，用來描述一個特定的具體的事物，是某一個具體事物的抽象-----創(chuàng)建對象------- new Object () {} 創(chuàng)建的對象 類型都是 object 無法用于具體對象類型的判斷 如何判斷對象的類型? X instanceof Y 判斷X對象是否是 被Y構(gòu)造創(chuàng)建出來-----構(gòu)造函數(shù)------ 構(gòu)造函數(shù)的作用:創(chuàng)建對象(被new構(gòu)造函數(shù)創(chuàng)建出來的對象 又被叫做 實例) 1.創(chuàng)建一個空對象 2.讓this 指向剛剛創(chuàng)建好的空對象 3.執(zhí)行構(gòu)造函數(shù)內(nèi)的代碼 (為相關(guān)的屬性和方法賦值) 4.返回創(chuàng)建好的對象 new 一個對象的過程 就是實例化一個對象 new出來的對象就是一個實例(對象)構(gòu)造函數(shù)中的this指行當前 new出來的對象(實例) constructor屬性 用來獲取創(chuàng)建當前對象的構(gòu)造函數(shù)名 可以用來判斷對象的類型-----靜態(tài)成員和實例成員------實例成員:使用實例對象(實例)來調(diào)用的屬性和方法(只能使用new創(chuàng)建出來的對象) 靜態(tài)成員:只能使用構(gòu)造函數(shù)名進行 調(diào)用和 創(chuàng)建的 屬性或者方法-----構(gòu)造函數(shù)的原型prototype屬性---------構(gòu)造函數(shù)的原型屬性 構(gòu)造函數(shù)名prototype prototype主要用來訪問 創(chuàng)建對象的構(gòu)造函數(shù)的原型對象的中成員 通過構(gòu)造函數(shù)創(chuàng)建的對象 可以訪問 構(gòu)造函數(shù)的prototype中的成員 利用構(gòu)造函數(shù)的prototype屬性可以給構(gòu)造函數(shù) 增加 屬性或者方法-------對象的原型----------------__proto__是對象的原型屬性等同于 這個對象的構(gòu)造函數(shù)的prototype原型屬性 對象可以訪問 原型屬性(指的是構(gòu)造的原型)中的任何成員對象的成員查找規(guī)則: 當我們使用對象調(diào)用 方法或者 屬性的時候, 對象會先到 創(chuàng)建它的構(gòu)造函數(shù)中去查找屬性或者方法 如果構(gòu)造函數(shù) 中不存在 則去 構(gòu)造函數(shù)的prototype中去查找 如果還沒有找到 則報錯 __proto__屬性具有兼容問題 屬于非標準屬性--------注意點-----------當我們設(shè)置 構(gòu)造函數(shù)原型對象時候 可以 直接賦值一個對象給 構(gòu)造函數(shù)的prototype屬性 注意: 1.如果我們是直接給prototype屬性賦值對象 則需要 沖新設(shè)置constructor屬性 2.如果在實例中需要使用修改以后的prototype屬性中的成員則 需要先修改 當前構(gòu)造函數(shù)的prototype屬性 再 去創(chuàng)建對象 先修改后創(chuàng)建-----------正確的寫法---------------- function Person (name, age) {this.name = namethis.age = age }Person.prototype = {constructor: Person, // => 手動將 constructor 指向正確的構(gòu)造函數(shù)type: 'human',sayHello: function () {console.log('我叫' + this.name + '，我今年' + this.age + '歲了')} }----------自調(diào)用函數(shù)------------------- 自調(diào)用函數(shù)（function（） ｛｝）（） Window.方法名 = 要被外界訪問的方法名-----------bind---------- bind可以改變函數(shù)中this指向函數(shù)其實也是一種對象 函數(shù)的bind()方法 主要用于修改 函數(shù)中this的指向,并且返回一個新的函數(shù) 不會調(diào)用函數(shù)函數(shù).bind(要指向的對象)方法中第一個參數(shù)用于設(shè)置 調(diào)用bind的函數(shù)中this的指向?qū)ο螽敽瘮?shù)調(diào)用bind方法以后---------函數(shù)的call---------- call 可以用改變this指向,,指向call 可以用來調(diào)用函數(shù) function fn(x, y) {console.log(this);console.log(x + y);}var o = {name: 'zs'};fn.call(o, 2, 3);----------自調(diào)用函數(shù)問題---------- 自調(diào)用函數(shù) 前面或者后面必須加分號 函數(shù)表達式聲明的時候也必須加分號自調(diào)用函數(shù)參數(shù)的作用(window,undefineg)自調(diào)用函數(shù)中使用 參數(shù) window去代替window對象 在代碼 壓縮時候可以進行壓縮 為我們壓縮 為我們節(jié)約代碼空間在自調(diào)用函數(shù)中使用undefined 主要是為了兼容 舊版本瀏覽器--------if中的函數(shù)不會提升---------//命名函數(shù)和函數(shù)表達式 聲明區(qū)別://1,命名函數(shù),(函數(shù)聲明)在執(zhí)行時候由于 預(yù)解析的原因 所以 書寫順序沒有要求 函數(shù)調(diào)用任何位置//2函數(shù)表達式 在調(diào)用的時候 必須遵循先聲明后使用//3.命名函數(shù) 在新版本瀏覽器 的if語句中 不會被預(yù)解析 命名函數(shù) 在舊版本的IE 的if語句 存在被預(yù)解析的問題 函數(shù)表達式 聲明 在新版本瀏覽器中都不會被預(yù)解析------------------this的指向-------------------------------------------1.在普通函數(shù)中this指向 window2.在對象的方法中this指向當前方法所屬的對象3.在構(gòu)造函數(shù)中的this指向 當前構(gòu)造函數(shù)創(chuàng)建對象4.在定時器 函數(shù)中this指向window5.在事件處理函數(shù)中this 指向 當前事件處理函數(shù)所屬對象 總結(jié):誰調(diào)用 this就指向誰-------------函數(shù)的調(diào)用形式:------------------------------------------普通函數(shù)調(diào)用 window.函數(shù)名()對象的方法調(diào)用 對象.方法名()構(gòu)造函數(shù) 調(diào)用 new 構(gòu)造函數(shù)名()事件處理函數(shù) DOM對象.事件名=function(){}定時器的函數(shù) setInterval (function(){},3000);----------------apply----------------------------------var arr = [1,2,3,4,5,6]; console.log(Math.max.apply(null.arr));//6var arr=[1,3,4,67,5];console.log.apply(console,arr);//1 3 4 67 5 apply方法 用于函數(shù)調(diào)用 并且 改變 函數(shù)中this的指向 不會調(diào)用函數(shù)第一個參數(shù):用于設(shè)置 函數(shù)中 this 要指向的對象 第二個參數(shù):要調(diào)用函數(shù)的參數(shù)組成的數(shù)組 列如:Math.max.apply(Math,[1,2,3])-----------------bind---------------------bind 方法 返回一個新的函數(shù) 并且改變this的指向,不會調(diào)用函數(shù) 1.bind方法 第一個參數(shù) 用來設(shè)置this要指向的對象 2.如果需要返回的函數(shù) 具有參數(shù) 則可以通過bind方法 第二個參數(shù)以后 進行傳遞實參-----------------call-----------------------1.call方法的第一個參數(shù) 用來設(shè)置this 要指向的對象 2.如果需要調(diào)用的函數(shù) 具有參數(shù) 則可以通過call方法 第二個參數(shù)以后 進行傳遞參數(shù) 第二個參數(shù)開始 都是函數(shù)需要的實參 可以多個參數(shù)call方法用途: 可以用來實現(xiàn) 借用構(gòu)造函數(shù)繼承屬性 call方法還可以用于 借用內(nèi)置對象的方法 列如:Array.prototype.push.call(要借用內(nèi)置對象方法的偽數(shù)組,push方法的參數(shù))------------------高階函數(shù)--------------- 1.作用參數(shù)傳遞的函數(shù) 2.作為返回值返回的函數(shù)--------函數(shù)其他成員-------------- arguments- 實參集合 - caller- 函數(shù)的調(diào)用者 - length- 形參的個數(shù) -name- 函數(shù)的名稱---------sort升序降序--------------var arr=[12,44,566,131,1327,2,133]arr.sort(function(a,b){return a-b});console.log(arr);---------閉包------------ 在兩個嵌套作用域中 <子作用域訪問父作用域中的變量> 內(nèi)層作用域訪問外層作用域的的變量 或 函數(shù)閉包的作用:可以讓我們利用函數(shù)的作用域保存一些我們需要的變量 1.可以解決定時器中無法保存變量問題 2.節(jié)約代碼量Closure 閉包閉包特點:延展函數(shù)的作用域 閉包缺點:占用內(nèi)存----------定時器--------- script標簽中的代碼被放到 執(zhí)行棧中 執(zhí)行 定時器的函數(shù)以及 事件處理函數(shù) 的代碼 會被放到 任務(wù)隊列中執(zhí)行------------函數(shù)的創(chuàng)建方式-------------------- 1.命名函數(shù) function 函數(shù)名(){} 2.函數(shù)表達式 3.自調(diào)用函數(shù) 4.以對象 new Function()命名函數(shù)和 函數(shù)表達式區(qū)別:-------if中的函數(shù)不會提升---------//命名函數(shù)和函數(shù)表達式 聲明區(qū)別://1,命名函數(shù),(函數(shù)聲明)在執(zhí)行時候由于 預(yù)解析的原因 所以 書寫順序沒有要求 函數(shù)調(diào)用任何位置//2函數(shù)表達式 在調(diào)用的時候 必須遵循先聲明后使用//3.命名函數(shù) 在新版本瀏覽器 的if語句中 不會被預(yù)解析 命名函數(shù) 在舊版本的IE 的if語句 存在被預(yù)解析的問題 函數(shù)表達式 聲明 在新版本瀏覽器中都不會被預(yù)解析 自調(diào)用函數(shù)的參數(shù)的作用（window、undefined） （function（w, undefined））(window ,undefined)自調(diào)用函數(shù)中使用 參數(shù) window 去替代 window 對象 在代碼 壓縮的時候可以進行壓縮 為我們節(jié)約 代碼空間在自調(diào)用函數(shù)中使用參數(shù) undefined 主要是為了兼容 舊版本的瀏覽器繼承：通俗含義：子承父業(yè) 通過 對父類型 抽象出一些子類型共有的 屬性 讓子類型進行繼承，提升代碼的復(fù)用javascript中實現(xiàn)繼承的方式：1. 對象與對象之間的繼承-》 對象的拷貝 存在的問題： 對象與對象之間無法實現(xiàn) 類型的繼承 2. 原型繼承 -- 通過對 構(gòu)造函數(shù)的 prototype進行 重新賦值，賦值為父類型 實現(xiàn)對父類型的繼承 存在的問題： 無法對父類型中的屬性進行重新賦值 ，一般情況使用比較少，主要用于對 對象方法的 繼承3. 借用構(gòu)造函數(shù) 通過 在子類型的構(gòu)造函數(shù)中 使用 call方法 對父類型構(gòu)造函數(shù)進行 調(diào)用 完美實現(xiàn) 子類型對 父類型所有 屬性的繼承 存在的問題： 使用借用構(gòu)造函數(shù) 無法 繼承 父類型 構(gòu)造函數(shù)原型中的 方法4.組合繼承 = 原型繼承（繼承父類型的方法） + 借用構(gòu)造函數(shù)繼承（繼承父類型的屬性）存在的問題： 通過原型繼承過來的父類型的方法 是所有 子類型都可以 進行調(diào)用的 并且 如果子類型重新對自身的 原型對象進行了修改 會影響 父類型的原型 ---------------遞歸----------------- 遞歸:函數(shù)自己調(diào)用自己的過程 缺點:不好閱讀,消耗內(nèi)存---------------------淺拷貝----------------淺拷貝:當我們對 對象進行屬性和方法拷貝的時候,淺拷貝只能復(fù)制 對象中簡單數(shù)據(jù)類型 而<復(fù)雜數(shù)據(jù)類型 的屬性 則只拷貝引用>淺拷貝不會拷貝對象屬性中的對象 而只拷貝 地址(引用)只會拷貝對象地址(不會復(fù)制新的對象) 淺拷貝-只拷貝對象的第一層屬性--------------------深拷貝-----------------------深拷貝-拷貝的是 屬性中真實的對象 而不是引用拷貝對象的時候 還要將對象中的 復(fù)雜數(shù)據(jù)類型實現(xiàn)完全拷貝------------------回調(diào)函數(shù)---------------指的是 當a函數(shù)作為b函數(shù)d參數(shù)傳遞的時候 只有當b函數(shù)執(zhí)行完成以后 才執(zhí)行a函數(shù) 此時a函數(shù)就是b函數(shù)的回調(diào)函數(shù)-------------------正則表達式--------- 什么是正則表達式? 一組用于查找 特定字符串 的規(guī)則/模式 正則表達式的作用:1.匹配 給定的字符串是否符合正則表達式的過濾邏輯2.提取 可以通過正則表達式，從字符串中獲取我們想要的特定部分3.替換 強大的字符串替換能力正則表達式特點:----------常用元字符-----------ctrl+f 查找 ctrl+r 開啟正則表達式 <.+?> 找到所有標簽\d 匹配數(shù)字\D匹配任意非數(shù)字的字符\w匹配字母或數(shù)字或下劃線\W匹配任意不是字母，數(shù)字，下劃線\s匹配任意的空白符\S 匹配任意不是空白符的字符.匹配除換行符以外的任意單個字符^表示匹配行首的文本(以誰開始)$表示匹配行尾的文本(以誰結(jié)束)限定符說明*重復(fù)零次或更多次+重復(fù)一次或更多次?重復(fù)零次或一次{n} 重復(fù)n次{n,} 重復(fù)n次或更多次{n,m} 重復(fù)n到m次驗證手機號： ^\d{11}$ 驗證郵編： ^\d{6}$驗證日期 2012-5-01 ^\d{4}-\d{1,2}-\d{1,2}$ 驗證郵箱 xxx@itcast.cn： ^\w+@\w+\.\w+$ 驗證IP地址 192.168.1.10 ^\d{1,3}\(.\d{1,3}){3}$[] 字符串用中括號括起來，表示匹配其中的任一字符，相當于或的意思[^] 匹配除中括號以內(nèi)的內(nèi)容 \ 轉(zhuǎn)義符 用來取消 特定功能符號的 正則表達式含義 | 或者，選擇兩者中的一個。注意|將左右兩邊分為兩部分，而不管左右兩邊有多長多亂 () 從兩個直接量中選擇一個，分組eg：gr(a|e)y匹配gray和grey [\u4e00-\u9fa5] 匹配漢字深度拷貝:function deepCopy(o1,o2){for(var key in o1){if(o1[key] instanceof Array){o2[key]=[];deepCopy(o1[key],o2[key]);}else if(o1[key] instanceof Object){o2[key]={};deepCopy(o1[key],o2[key]);}else{o2[key]=o1[key];}}}淺拷貝:function copy(o1,o2){for(var k in o1){o2[k]=o1[k];}}遍歷dom樹:function loadTree(parent,callback){for(var i = 0; i<parent.children.length;i++){var child=parent.children[i];if(callback){callback(child);}loadTree(child);}}var ul=document.getElementById('list');loadTree(ul,function(element){element.onclick=function(){console.log(this.innerText);}})如何使用 正則表達式對象？1. new RegExp( ‘模式（正則表達式）’, ‘i’ ) 第一個參數(shù)用于設(shè)置 模式：要匹配的規(guī)則 第二個參數(shù) 用于設(shè)置 是否 ‘i’ 忽略大小寫 ‘g’ 全局匹配2. var reg = /模式/i是否忽略大小寫正則表達式對象.test（’要匹配的字符串’） -> 匹配方法 如果 要匹配的字符串符合 正則表達式條件 則返回 true 否則 返回 falseonchange事件觸發(fā)條件： 1.文本框中的 文本內(nèi)容發(fā)生變化 2.失去焦點------------------exec提取---------------exec只返回一個匹配的結(jié)果 如果沒有匹配的結(jié)果返回null---------------match提取------------- match 也可以用于 根據(jù)正則表達式提取內(nèi)容 可以同時提取多項內(nèi)容test ----------------RegExp.$1....$9 使用RegExp.$1 …… $9 屬性 訪問 分組后的字符串不同部分的內(nèi)容--------------split--------------- trim() 方法會從一個字符串的兩端刪除空白字符。在這個上下文中的空白字符是所有的空白字符 (space, tab, no-break space 等) 以及所有行終止符字符（如 LF，CR）。 str.trim()貪婪模式 <.+> 非貪婪模式 <.+?>

?

轉(zhuǎn)載于:https://www.cnblogs.com/tuziling/p/10074312.html

總結(jié)

以上是生活随笔為你收集整理的js高级笔记的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。