學習之余回頭看了下自己之前的總結，給大家分享一下，因為之前word總結的，所以代碼段是圖片，望大家見諒，
DAY1------------------------
一、如何撰寫js
editplus常用快捷鍵：
如何撰寫js：
二、js代碼運行順序
js如何運行：
三、 js的資料型別
1、原始資料型別：
2、參考型別物件：
四、js資料轉換型別
五、 js資料型別轉換
六、 JavaScript中的運算子
1. 算數運算：
模運算的2個用途：
2. 關系運算：
關系運算的比較規則：
DAY2---------------------------------------------
一、js的邏輯運算
短路邏輯(分支結構)：
二、js的三目運算
使用實體
三、js分支結構
1. if結構：
2. if..else結構：
3. if..else if..[else]
四、js分支結構
switch case結構：
五、回圈結構
回圈三要素：
回圈分類：
DAY3------------------------------------------------------------------
一、for回圈
二、function定義
三、變數作用域
1. 全域作用域 - window
2. 區域作用域：
DAY4------------------------------------------------------------
一、函式的宣告提前與按值傳遞
二、陣列
如何創建陣列：
陣列分類：
undefined與null
null的用法有2種：
三、陣列遍歷
冒泡排序：
四、關聯陣列
DAY1------------------------
一、如何撰寫js
editplus常用快捷鍵：
1. ctrl+shift+n - 創建一個新的html檔案
2. ctrl+c
3. ctrl+v
4. ctrl+x
5. ctrl+s 保存當前檔案
6. ctrl+b 按照指定的瀏覽器打開該html檔案
前端：網頁開發（html+css+JavaScript），app開發，移動端開發，游戲開發，服務器開發，可視化資料開發等 python人工智能
JavaScript：實作網頁互動的腳本語言
互動：用戶輸入資料->程式接收并處理資料回傳處理結果
如何撰寫js：
- 通過瀏覽器視窗撰寫
- 通過html頁面中的script標簽內部進行JavaScript撰寫
- 通過通過script標簽的src屬性引入js檔案
二、js代碼運行順序
js如何運行：
瀏覽器中包含2個引擎：
1. 內容排版引擎 - 決議html和css的
2. 腳本解釋引擎 - 解釋并執行JavaScript程式腳本語言的引擎
解釋執行：默認都是自上而下逐行執行的
當頁面加載完成后，修改id為box的div的內容- XX
1. 通過Dom（檔案物件模型）的API查找到id為box的div元素物件
api: 應用程式介面
window.onload=function(){ // 當頁面加載完成后，才執行事件處理函式中的操作
var box=document.getElementById("box");
console.log(box);// null - 空
box.innerHTML="小楊"; // 通過innerHTML屬性修改元素物件的顯示內容 
三、 js的資料型別
JavaScript的資料型別：2類
1、原始資料型別：
string - 字串
number - 數字
boolean - 布爾 true false
undefined - 所有僅宣告，未賦值的變數的默認值！ - 空（修飾原始資料型別的空）
null - 空 （修飾物件的空）
*symbol
2、參考型別物件：
array（陣列） function（函式） Math Date
四、js資料轉換型別
資料型別轉換 - 隱式轉換：不需要程式員干預，js可以自動的完成型別轉換
僅討論算數計算時的隱式轉換
1. 算數計算中，一切資料都默認轉換為數字后，再做計算
boolean： true -> 1 false -> 0
null -> 0
undefined -> NaN -> not a number (不是一個數字)
一些資料不能轉換為數字的話，則會轉換為NaN
**NaN不等于，不大于，不小于任何值包括他自己
只要NaN參與的運算結果永遠是NaN
NaN雖然表示不是一個數字，但是他本身屬于number資料型別
- 在+運算中，只要碰到字串，+就不再是+法運算子號了，而變成了字串拼接符號了，導致另一個不是字串型別的資料，會變成字串型別資料
+ 做拼接作用時候 NaN也做拼接結果是拼接 不是NaN
五、 js資料型別轉換
JS強制轉換：程式員主動的呼叫專門的函式（API）執行資料轉換
何時使用：自動轉換的結果不是我們想要的結果的時候
任意-> string 2個API
x.toString() x不能是undefined或者是null
String(x) -> 相當于隱式轉換 -> 萬能轉換方式
typeof(x) -> 回傳的結果資料型別
String -》 Number：2個API
parseInt(str/num):從第一個字符開始，依次讀取每個數字，只要碰到第一個非數字字符就停止，自動跳過開頭的所有空字符（使用較多 一般數值輸入框都需要parseInt）
parseFloat(str/num):決議規則同parseInt,只不過認識第一個小數點
六、 JavaScript中的運算子
1. 算數運算：
+ - * / %(模運算) ++（遞增1） --（遞減1）
模運算 - %不取商而是取余數
比如： 3/2 = 1.5
3%2 = 1
模運算的2個用途：
1. 判斷是否能整除：比如判斷奇偶性
n%2等于0 n為偶數
不等0 n為奇數
2. 保證運算結果不能超過除數
++ 遞增1 -- 遞減1
有2種運算式：
++n
n++
這兩個運算式的共同點都是將n中的值遞增1后，再存回n中
如果上述2個運算式參與輸出了，那么是有區別的
++n 回傳運算式的新值（n遞增后的值）
n++ 回傳運算式的舊值（n遞增前的值）
2. 關系運算：
將兩個值作比較 -> true false
> < >= <= == != ===（全等比較）
關系運算的比較規則：
1. 默認將所有型別轉換為數字后，再做比較
2. 如果參與比較的兩個資料都是字串
依次取出每個字串中的字符 PK "unicode"號
3. 擴展賦值運算： += -= *= /= %=
比如：n=n+m 將n中的值遞增m后，再存回n中
n=n+m --> n+=m
n=n-m --> n-=m
注意：n=m-n 能否簡化成 n-=m? 不能！
DAY2---------------------------------------------
一、js的邏輯運算
邏輯運算：將多個關系運算綜合起來，得出一個結論（true，false）
3種： &&(且) ||（或） !（非）
&&:2個條件都必須為true，才回傳 true
||:2個條件都必須為false 才回傳 false
短路邏輯(分支結構)：
&&：如果前一個條件為false，就已經得出結論->false
||: 如果前一個條件為true， 就已經得出結論->true
引申出短路邏輯：
語法：1. 條件&&(操作)
條件滿足，執行后續操作，不滿足，則不執行
2. 值1||值2
如果值1有效，就用值1，否則，就用值2
程式中的3種結構：1. 順序結構
2. 分支結構：根據不同的條件，滿足條件就執行，不滿足就不執行
3. 回圈結構
二、js的三目運算
根據不同的條件，執行不同的操作/回傳不同的值
語法：
條件1?值1或操作1: // 滿足條件1才取值1或執行操作1
條件2?值2或操作2:
默認值或默認操作 // 上述條件都不滿足則取默認值或執行默認操作
總結：多個條件，多件事，多選一執行 如果操作陳述句比較簡單，建議使用三目運算
消費大于500打八折 與判斷平年 閏年的三目運算書寫
代碼簡單便捷
使用實體
三、js分支結構
3種：
1. if結構：
一個條件一件事，滿足就做，不滿足就不做
語法：
if(條件){
滿足條件執行的操作
}
2. if..else結構：
一個條件2件事，二選一執行（類似于三目運算）
語法：
if(條件){
滿足條件執行的操作
}else{
不滿足條件執行的操作
}
3. if..else if..[else]
結構：多個條件多件事，多選一執行（也有可能什么都不做）
語法：
if(條件1){
滿足條件1執行的操作
}else if(條件2){
滿足條件2執行的操作
}[else{
上述條件都不滿足執行的默認操作
四、js分支結構
switch case結構：
當條件都是*全等比較*的時候，才可以使用switch case結構
全等比較：不僅比較值，還比較資料型別
語法：
switch(運算式){
case 值1:
滿足值1才執行的代碼段
case 值2:
滿足值2才執行的代碼段
... .. :
.....................
default:
如果前面的值都不滿足，執行默認操作
}
問題：經過運行我們發現switch case結構如果沒有break關鍵詞，那么會根據條件進入到滿足的條件的case執行，并以此觸發后續的所有case操作執行（包括default），所以，如果想要獨立的執行分支，必須要在每個case之間添加break關鍵詞
break:"終止"當前結構執行，并跳出結構
何時可以省略break關鍵詞：如果上下兩個case執行相同操作時
五、回圈結構
回圈結構：讓程式*反復執行*同一段代碼
回圈三要素：
1. 回圈條件：讓回圈反復執行的條件
2. 回圈變數：回圈條件中用于比較的變數
回圈變數總是向著不滿足回圈條件的趨勢進行迭代的
3. 回圈體：回圈內反復執行的代碼段
回圈分類：
1. while回圈：先判斷回圈條件，再執行回圈體
一般情況下當回圈條件的變化沒有規律的時候優先使用while回圈
while(回圈條件){
回圈體;
迭代修改回圈變數;
}
2. do..while回圈：先執行回圈體，再判斷回圈條件
do{
回圈體;
迭代修改回圈變數;
}while(回圈條件)
注意：while回圈與do..while回圈基本等效，區別在于看第一個回圈條件是否滿足
如果滿足，則兩者等效，不滿足，while回圈一次都不執行，而do while回圈至少執行一次
DAY3------------------------------------------------------------------
一、for回圈
for回圈與while回圈等效
語法：
for(1.初始化回圈變數;2.回圈條件;3.迭代修改回圈變數){
4.回圈體;
}
1->2->4->3->2->4->3
while(回圈條件){
迭代修改回圈變數;
回圈體;
}
二、function定義
函式：程式中封裝一項專門任務的步驟清單代碼段
語法：
function 函式名([引數變數串列]){
任務步驟代碼段;
[return 回傳值;]
}
函式名（任務名）：指向函式定義的一個變數，保存的是*函式物件的參考*
宣告的時候：不執行，同時也不讀取內部代碼
在程式的任意位置：函式名([引數值串列]);
函式呼叫時：才開始讀取內部代碼，并執行
三、變數作用域
變數作用域：一個變數的可用范圍
2種：
1. 全域作用域 - window
全域變數 - 放在全域作用域里的變數可在程式的任意位置進行訪問并修改
2. 區域作用域：
在函式呼叫的時候才會動態創建的作用域
區域變數：2種
1. 引數變數
2. 在函式中var出來的變數
***僅在函式呼叫時，動態創建
并且使用變數的規則是：如果區域有，就不用全域的
***呼叫后，區域變數會伴隨著區域作用域一同銷毀！
DAY4------------------------------------------------------------
一、函式的宣告提前與按值傳遞
***宣告提前：正式開始執行程式之前，都會先將var宣告的變數，和function宣告的函式，提前到當前作用域的頂部，集中宣告，同時賦值留在本地
注意：函式的宣告比變數的宣告更置頂
二、陣列
陣列：一組變數的集合，連續保存多個資料的參考型別的物件
如何創建陣列：
**1. 創建空陣列 var 陣列名=[];
暫時不知道陣列內容的時候，先創建再追加
**2. 創建陣列的同時直接初始化內容
var 陣列名=[值1,值2,...];
3. 創建指定個數的陣列
var 陣列名=new Array(n);
創建一個陣列物件，同時初始化n個空元素
4. 創建同時直接初始化
var 陣列名=new Array(值1,值2,...);
注意：3,4創建陣列方式不常用，因為有分歧
var arr=new Array(7);
可以解釋為初始化了7個空元素 也可以解釋為初始化了一個陣列只放了一個元素值為7
陣列分類：
1. 索引陣列
下標從0開始每次遞增1
length - 元素個數
索引陣列的下標從0開始，每次遞增1的特性
這個下標天生就是一個回圈變數
下標遞增到<length結束 - 回圈條件
2. 關聯陣列（哈希陣列）
下標可以自定義，而且下標不可重復
length - 失效
3. 二維陣列 - 元素又指向另一個子陣列物件
下標分為行下標和列下標，都是從0開始，每次遞增1
行 - length獲得陣列中有多少個子陣列物件
列 - length獲得子陣列中的元素個數
所有的陣列都有下標！只不過每種陣列下標特點不同
都有length屬性，length屬性表示陣列的長度 - 保存了多少個元素
如何獲得某個元素值： var 變數=arr[下標]
如何獲得陣列長度： arr.length
如何獲得最后一個元素值：arr[arr.length-1]
undefined與null
1. 所有僅宣告未賦值的變數的默認值 - undefined undefined為空 - 修飾原始資料型別
2. null - 修飾物件的空
null專門表示一個變數不再指向任何物件的地址了！
null的用法有2種：
1. var 變數 = null; - 打標記
表示將來該變數即將指向一個物件，只是此時什么都沒有指向
2. var obj = 物件;
把該物件使用完畢后，就把obj主動賦值null - 》 obj=null
將來一個變數不再指向物件了，那么可以主動賦值為null
這么做得話，就表示主動的釋放記憶體，節省記憶體空間從而提高瀏覽器性能 記憶體中有個垃圾回收器，如果一個物件沒有變數指向（參考），那么就會被垃圾回收器回收，從而釋放記憶體
js中的物件：記憶體中保存一組相關資料和功能的整體 物件都是new運算子創建的
new專門在記憶體中開辟一個空間，保存資料和功能，回傳*存盤地址*
三、陣列遍歷
冒泡排序：
將陣列中的元素按照從大到小（從小到大）的順序進行排列
四、關聯陣列
關聯陣列（hash哈希陣列）- 可以自定義下標的陣列
關聯陣列的key（下標）不可重復，length屬性失效
如何遍歷hash陣列：
for(var key in obj){
console.log(obj[key])
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/384300.html
標籤：其他
上一篇：Vue 電商管理系統