一.? JavaScript 的學習

1.js的認識#腳本是逐條執行1.?使用dom獲取id為first的div（var 變量名 = document.getElementById(‘id名’); ）2.?函數：更改背景顏色function 連接 ( ) ?{ 變量名.style.backgroundColor = "red”; }3.?常規的輸出函數的交互alert("hello world”);4.?使用js添加頁面元素document.write("

”);5.?使用外部js文件 ? 便于維護和可以緩存6.?瀏覽器不支持JavaScript，或腳本被禁用了。

2.基本概念1.?語法跟c和類c語言（java）很相似CMAScript中的一切區分大小寫，比如變量名稱、函數的名稱、函數的參數的名稱等2.?標識符就是指變量、函數名、屬性的名稱、或者函數的參數等 ? ? 3.?標識符定義的規則：1.以字母、下劃線、$開頭。2. 其他后面的字符可以使用字母、數字、下劃線、其他字符（不要使用漢字），推薦使用駝峰命名法：第一個單詞首字母小寫，之后每個單詞首字母大寫 ?parentChild（標識符要見其詞，識其意4.?語句，以;結尾1. 使開發人員，放心的使用一些壓縮工具，壓縮代碼（把多余的空格、換行刪掉） 2. 增強代碼的性能，減小解析器的負擔5.?語句塊{ var b = 2;var c = 3;var d = b + c; }6.?變量的聲明var f = 5, g = 6;

基本數據類型#1.?undefined(只聲明變量，沒有賦值) ? ?2.null,空對象 ? ?3.?number ? ?4.?Boolean(true/false) ? ?5.?string ? ? ?6.?類型轉換 ?( 1. other -> Boolean ?2. string -> number ?3. parseInt(string, radix) )引用類型：object

運算符1.算術運算符+ - * / % ++ --++/--在前，先運算，再取值，++/--在后，先取值，再運算2.?賦值運算符= 、+= 、-=、*=、/=、%=c+=d ?c = c + d;3、關系運算符>、<、>=、<=、!=、==、===、!====指得是需要對比的變量轉換之后是否相同 ??===指，類型和值都相同（恒等）4、邏輯運算符&&、||、! ?!aa為false的時候，結果為true5.?三元運算符判斷條件?條件成立的取值:條件不成立的取值

加法計算器#1.取出第一個輸入框的值var firstValue = parseInt(document.getElementById('first').value);2.?獲取result輸入框var resultInput = document.getElementById('result');

if 語句1.if語句，就是根據對應的條件，選擇執行的相應邏輯（相應的代碼塊），在語句流中會跳躍的執行 ? 2.?if (判斷條件) { 條件成立需要執行的邏輯 } else { 條件成立需要執行的邏輯 }

例子 : bmi? ,計算器

二. ?循環語句

switch語句#流控制語句1、switch語句中的對比是=== ??2、小心穿透，合理的利用break，不加break默認是穿透 ??3、注意default，每個switch在最后都有一個default，默認情況下執行default ? ?4.在大多數語言中switch語句只能使用數值，但是在js中可以使用任何數據類型（字符串，對象），每一個case中值不一定是常量，也可能是變量，或者是表達式

for 語句1.?for循環，用來處理固定次數的循環 ?for循環三要素：起始條件，終止條件，變化條件 ?變化條件可以是多樣化的，如i+=5;2.?for循環三要素是可選的，省略其中的條件，會創建一個無限循環 ? ? 3.?break 和 continue ?continue;跳出當前這次循環 ? ? 4. ?for-in語句，是一種精確的迭代語句for (var propertyName in window) {console.log(propertyName);}

while語句while(表達式(終止條件)){處理的邏輯}while (num < 0 || num > 100) {num = prompt("請輸入你的成績”);}

例子 ： 猴子摘桃 ， 抓花生

三.

string字符串#1.?js中常用的轉義字符\n,\\,\',\”\表示需要對之后的字符進行轉義，如果后面的字符有轉義的話，顯示對應的效果，如果沒有，不影響后面的字符的正常輸出。1.獲取字符串的長度str.length2.字符的大小寫轉化toLowerCase()/toUpperCase() ? ?3、檢索?stringObj.indexOf(searchString: string,?position?: int)返回值如果是小于0，代表沒有找到相應的子字符串peopleId.lastIndexOf("55", 13)4、截取字符串peopleId.substring(6, 14)substr(start,length)length:要截取的字符串的長度peopleId.substr(6,8)5，遍歷for (var a = 0 in peopleId) {console.log(peopleId.substr(a,1));}

array數組#1. 數組是一組有序的集合，可以存放多種類型。取值,需要通過下標來獲取array[index] ? ? ? ?2.定義一個空數組var array2 = [ ];3.獲取數組中的長度console.log(array1.length);4.遍歷數組for (var a in array1) {console.log('第' + a + '個是' + array1[a]);}5.檢索數組中是否包含某個內容console.log(array1.indexOf("abc",5))6.往數組中追加內容group[0] = "高雅蘭”; ?group.push(["趙寧","魏坤鵬","魏清陽"]);?group.pop( );7.shift,取出數組中第一個成員，并把他從數組中刪除group.shift();unshift從數組的頭部添加成員，并且返回新數組的長度group.unshift("李璐欣","彭付龍","劉哲”)8.concat，往數組中添加新成員，并且返回一個添加后的新數組array3.concat("閆麒麟","范曉東","郭彥松",["陳運發","陳坤","馬恒飛"]);9.join,把數組中的每個成員用特殊字符連接成一個新的字符串array4.join("~”);var str1 = "閆媛媛-王俊亞-李明揚-武國慶”;? str1.split("-");10.替換數組中的成員 ? ? 11.splice(start: int, deleteCount: int, items...: any) ?start:開始索引，（內容插入的位置）deleteCount:刪除的個數 items:要插入的新成員 ? ?12.排序var array6 = ["ab","hj","ba","gd","bcd","Ab”]; array6.sort(); ? ? 13.反向 ?array6.reverse();

例子 ：校驗身份證號，注冊register

四.

多維數組數組的嵌套，用來解釋實際生活中的問題

object對象#1. 對象是一種無序的數據集合，由若干個鍵值對，大括號就是定義一個對像，如果內容包含多個屬性，需要用逗號隔開。定義對象的屬性名稱的時候需要按照之前定義操作符的規則（駝峰命名法）2.?對象引用如果不同的變量指向同一對象（指向這個對象的內存地址），那么他們都是這個對象的引用，他們指向了同一塊內存修改其中一個，另外一個也被修改 ?取消一個變量對對象的引用，不影響其他的變量?對原始類型的數據的引用，都是值拷貝3.?添加屬性obj3.age = 18;刪除屬性delete obj3["sex”];判斷某個屬性是否屬于對象console.log('sex' in obj3);遍歷對象中的屬性for (var property in student) {console.log(property);}對象嵌套 ?動態屬性bite:function () {alert(“汪汪汪“）;}

date1.獲取當前的時間var date = new Date();獲取年date.getFullYear()獲取月(0-11)date.getMonth()獲取日date.getDate()獲取星期date.getDay()時間戳（1970-now）(毫秒級)date.getTime()獲取時分秒和毫秒date.getHours() ?date.getMinutes() ?date.getSeconds()?date.getMilliseconds()2.設置datedate.setFullYear(2018);3.對比時間var interval = date2 - date;4.時間相加(轉化成毫秒，然后相加) ? ?5.獲取本地時間字符串console.log(date4.toLocaleDateString());6.獲取標準時區date4.toUTCString()7.把星期轉化成漢字var weekDay = ["星期日","星期一","星期2","星期3","星期4","星期5","星期6”]; ??console.log(weekDay[date4.getDay()]);

計時器#1.?setInterval(func,delay);每隔delay（毫秒）觸發func2.?setTimeout(func,delay)延遲delay（毫秒），觸發fund

snakes 貪吃蛇#

五.函數

函數1.文檔解析過程是從上到下，依次執行函數對于任何一種編程語言都是核心的內容，特別是對于js，js是面向函數式編程 ? ? 2.?函數: 1.可以封裝任意多條語句， 2. 可以在任何地方，任何時候調用 ??基本語法：function functionName(arg0,arg1,...argn){邏輯語句}3.?函數的調用functionName(arg0,arg1,....argn);

4. 函數都有返回值，return語句表示當前函數需要返回的內容，函數中遇到return，表示函數結束一個函數中 的返回值，有可能是多條?返回值沒有任何內容,這種情況下，函數執行后不需要有任何返回值，這種做法，想要提前停止函數而又不需要有返回值5.??由上面的知識點，我們可以得出，函數有四種"類型”的函數1、無參數無返回值，2、無參數有返回值，3、有參數無返回值，4、有參數有返回值

參數ECMAScript中的函數的參數與其他語言中的參數有所不同1. 不介意傳遞的參數的個數 ? ? ? ?2. 不在乎你傳遞參數的類型 ??即便函數不需要參數，在調用的時候，你也可以傳遞參數， ? 3. 在函數中有arguments對象，傳遞的參數都存放在arguments，并且是有序的console.log('hello ' + arguments[0] + ',' +arguments[1]);4.在js中沒有函數簽名（函數簽名就是由函數名稱、參數的個數、參數的類型以及返回值）由于js中沒有函數簽名，就沒有函數重載，后寫的doAdd1會把前面的doAdd1覆蓋?傳遞參數過多，多余部分參數忽略雖然js中函數沒有重載，但是我們彌補這一遺憾（用 if else ）注意：arguments不是數組，但是可以像數組那樣取值 ? ? 5.?arguments和形參可以一起使用console.log(arguments[0] + num2);6.?arguments中的值和對應的形參的中一致,注意不要在函數內部更改argments中的值arguments[1] = 10;

變量1.變量其實是存放數據的容器，js中的變量是弱類型以字母,下劃線,$開頭，后面可以跟字母，下劃線,$開頭,數字，其他字符，但是不能跟關鍵字重名（if break）2.js中的變量類型分類：?基本類型：Undefined,null,Number,Boolean,String引用類型：object3.動態屬性（僅限于引用類型）基本類型變量不能添加屬性4.變量的復制引用類型復制的時候，是復制的對對象的引用5.把變量當成實參傳入函數js中所有的函數的參數都是按照值傳遞的?變量如果是基本類型，那么把值傳遞到函數中?如果變量是引用類型，把對當前對象的引用傳遞到函數中

變量作用域1.?全局變量在腳本中任何位置都可以被使用，局部變量，只能在他所在的局部環境中使用。 ? ? 2.?在js中沒有塊級作用域if (true) {var a1 = 'hello world’;}相當于全局變量3.?如果在局部環境中，不使用var關鍵字，來聲明變量，那么這個變量就會自動地被添加到全局環 ? ? 4.?利用查詢標識符(變量的名稱) 尋找變量，沿著變量的作用域鏈往上去找，如果找到，那么使用這個變量，如果沒有找到，is not defined ? ? ? ? 5.?變量的聲明會上浮,上浮到當前變量所在的環境的上方 ?函數的聲明也會上浮

函數表達式1.?每個函數都是function類型的實例，與其他的引用類型一樣，函數的名稱就是對函數對象的引用 ? ? ? ?2.?函數表達式跟上面函數的聲明基本上一樣，但是，注意在表達式最后，需要加分號var sum2 = function (num1,num2) {return num1 + num2;};3. 函數的名稱和函數表達式的區別瀏覽器中的解析器在解析的過程中，先讀取函數的聲明，為了讓函數在執行之前都可用。 函數表達式，解析的時候，會先解析變量的聲明，然后執行到賦值語句的時候，才對變量進行賦值，之后才可以使用函數表達式聲明的函數

函數的嵌套#1.函數作為參數 ? ? ?2.函數作為返回值

六. 函數

函數的屬性#1.函數參數的默認值（1.?利用if語句設置num2的默認值?if (!num2) {num2 = 10;} ? ? 2.?利用三元運算符設置num2的默認值?num2 = !num2 ? 10 : num2; ? ?3.?return num1 + (num2 || 10);）2.?在函數內部有兩個比較特殊的對象，arguments和this1.arguments對象作用是存儲函數調用的時候傳遞的實參，arguments對象有一個屬性為callee,callee屬性其實就是一個指針，指向arguments對象的函數 ? ?2.?在全局執行環境中this指的是window對象,全局執行環境中的變量是window的屬性，全局函數是window對象的方法 ?函數中的this對象就是指調用函數的執行環境對象（當網頁的全局作用域中調用函數，函數中的this值的是window）3.?caller保存著調用當前函數的函數的引用，如果說在全局環境中調用函數，caller的值為null ? ? 4.?length:當前函數的時候傳遞的形參的個數

函數的方法#1.?apply(),有兩個參數，第一個參數的是當前的函數的調用者（間接決定了函數的作用域）apply()方法的第二個參數是傳遞進去的實參，可以是數組，也可以是arguments2.?call()方法，也有兩個參數第一個參數跟apply()?的第一個參數一樣，就是函數的調用者，第二個參數有點區別，是把實參一個一個的傳遞進去3.總結：apply()和call()重點不在于參數的傳遞，重點在于第一個參數，第一個參數可以更改函數運行的作用域

立即執行函數#

閉包#1. 在某個函數調用的時候，會創建一個執行環境以及它對應的作用域，然后使用arguments和自己定義的其他的命名參數（形參等）的值來初始化函數的活動對象。 ? ?2.?作用域鏈：當前執行的函數的活動對象--這個函數的外部函數的活動對象--外部函數的外部函數的活動對象--...--全局的執行環境的變量對象3.?當全局環境中的函數執行完畢之后，該函數執行環境和他的活動對象會銷毀。對于閉包有所不同。 ? ? ?4.?函數執行完畢之后，它所對應的執行環境被銷毀，但是它的活動對象沒有被銷毀，直到其閉包函數執行完畢的時候，才會銷毀閉包函數的執行環境和它對應的作用域鏈。

閉包和變量??,?閉包練習 , 數組中map的使用#

七. 創建對象

reduce#reduce():數組中的所有成員從左到右依次減少到單一值，使用一個累加器，應用到提供方法

filter#filter(）:過濾數組中的成員

對象#1.?字面量定義對象 ? ? 2.?訪問對象屬性，第一種方式 . 第二種方式 [ ]; ? ?3.對象1.對象是對單個具體實物的抽象 ??2.對象是一個容器，容器內部封裝了屬性（對象的狀態：姓名，身高，體重...）和方法（對象的行為:吃，喝，玩...） ??3.對象是一個無序的數據集合（屬性:屬性名稱）

工廠模式創建對象#對象中this是對象本身 ? ?工廠模式的弊端，不能清楚地知道對象的具體類型

構造函數#構造函數是一種專門用來創建對象的函數?1.構造函數首字母大寫，2.使用的時候，必須使用關鍵字new，new代表使用構造函數創建新實例，3.返回值是對象 ??系統原生的構造函數var student = new Object();自定義構造函數function Student1 () {

原型#1.我們創建的每個函數都有一個prototype屬性，prototype就是指向當前函數的原型對象,原型對象的作用:存儲所有這個函數的實例共享的屬性和方法 ? ? 2.?原型對象中有一個constructor屬性，指向原型的構造函數 ? ? 3.在實例上動態添加屬性，會把原型對象中的相同的屬性給屏蔽掉

八. 原型

繼承