基礎語法
引入方式
引入方式
內部腳本：將JS代碼定義在HTML頁面中
-
JavaScript代碼必須位于<script></script>標簽之間
-
在HTML文檔中，可以在任意地方，放置任意數量的<script>
-
一般會把腳本置于<body>元素的底部，可改善顯示速度
外部腳本：將 JS代碼定義在外部 JS文件中，然后引入到 HTML頁面中
-
外部JS文件中，只包含JS代碼，不包含<script>標簽
-
<script>標簽不能自閉合
輸出語句
輸出語句
-
使用 window.alert() 寫入警告框
-
使用 document.write() 寫入 HTML 輸出
-
使用 console.log() 寫入瀏覽器控制臺
變量聲明
變量
-
JavaScript 中用 let 關鍵字來聲明變量
-
JavaScript 中用 const 關鍵字來聲明常量
-
JavaScript 是一門弱類型語言，變量可以存放不同類型的值
-
變量名需要遵循如下規則：
-
組成字符可以是任何字母、數字、下劃線（_）或美元符號（$）
-
數字不能開頭
-
建議使用駝峰命名
-
數據類型
數據類型
JavaScript中也有數據類型的概念,主要有下面幾種
原始類型
-
string：字符串，單雙引皆可
-
number：數字（整數、小數、NaN(Not a Number)）
-
boolean：布爾。true，false
-
object：對象和null
-
undefined：當聲明的變量未初始化時，該變量的默認值是 undefined
-
使用 typeof 運算符可以獲取數據類型
運算符
運算符
== 與 ===
特殊用法
-
字符串字面值參與運算的時候會自動轉為數字(加法除外)
-
除法運算會按照人類運算執行,根java中的除法有所區別
流程控制
流程控制語句
流程控制
類型轉換
在js中,任何類型都可以轉為boolean：
-
Number：0 和 NaN為false，其他均轉true
-
String：空字符串為false，其他均為true
-
對象: Null 和 undefined為false, 其它均為true
函數和事件
函數
定義方式一：
-
介紹：函數（方法）是被設計為執行特定任務的代碼塊。
-
定義：JavaScript 函數通過 function 關鍵字進行定義，語法為：
-
注意：
-
形式參數不需要類型，因為Js是弱類型語言
-
返回值也不需要定義類型，可以在函數內部直接使用return返回即可
-
js中如果出現同名的方法，后面的會覆蓋前面的
-
調用：函數名稱(實際參數列表)
定義方式二：
-
JS中，函數調用可以傳遞任意個數的參數
事件
事件
-
事件：HTML事件是發生在HTML元素上的 “事情”。比如：
-
按鈕被點擊
-
鼠標移動到元素上
-
按下鍵盤按鍵
-
-
事件監聽：JavaScript可以在事件被偵測到時 執行代碼。
事件綁定
-
方式一：通過 HTML標簽中的事件屬性進行綁定
-
<input type="button" οnclick="on()" value="按鈕1">
<script> function on(){ alert('我被點擊了!'); } </script>
-
方式二：通過 DOM 元素屬性綁定
-
<input type="button" id="btn" value="按鈕2">
<script> document.getElementById('btn').οnclick=function(){ alert('我被點擊了!'); } </script>
對象
數組對象
數組對象
-
JavaScript 中 Array對象用于定義數組
-
定義
let 變量名 = new Array(元素列表); //方式一 let 變量名 = [ 元素列表 ]; //方式二
-
訪問
-
arr[ 索引 ] = 值;
注意事項
-
JavaScript 中的數組相當于 Java 中集合，數組的長度是可變的，而 JavaScript 是弱類型，所以可以存儲任意的類型的數據。
屬性
方法
-
箭頭函數(ES6)：是用來簡化函數定義語法的。具體形式為: (…) => { … } ， 如果需要給箭頭函數起名字： let xxx = (…) => { … }
字符串對象
字符串對象
-
String字符串對象創建方式有兩種：
let 變量名 = new String("…") ; //方式一 let 變量名 = "…" ; //方式二
屬性
方法
自定義對象
自定義對象
-
定義格式：
let 對象名 = { 屬性名1: 屬性值1, 屬性名2: 屬性值2, 屬性名3: 屬性值3, 方法名: function(參數){ 方法體 } };
-
調用格式
-
對象名.屬性名; 對象名.函數名();
JSON對象
JSON-介紹
-
概念：JavaScript Object Notation，JavaScript對象標記法。
-
JSON 是通過 JavaScript 對象標記法書寫的文本，跟js對象的主要區別就在于，JSON中的鍵必須是字符串類型
JSON-基礎語法
-
定義
let 變量名 = '{"key1": value1, "key2": value2}';
-
JSON字符串轉為JS對象
let jsObject = JSON.parse(userStr);
-
JS對象轉為JSON字符串
let jsonStr = JSON.stringify(jsObject);
BOM對象
BOM
-
概念：Browser Object Model 瀏覽器對象模型，允許JavaScript與瀏覽器對話， JavaScript 將瀏覽器的各個組成部分封裝為對象。
Window
-
介紹：瀏覽器窗口對象。
-
獲取：直接使用window，其中 window. 可以省略。
-
屬性
-
history：對 History 對象的只讀引用。請參閱 History 對象。
-
location：用于窗口或框架的 Location 對象。請參閱 Location 對象。
-
navigator：對 Navigator 對象的只讀引用。請參閱 Navigator 對象。
-
-
方法
-
alert()：顯示帶有一段消息和一個確認按鈕的警告框。
-
confirm()：顯示帶有一段消息以及確認按鈕和取消按鈕的對話框。
-
setInterval()：按照指定的周期 （以毫秒計）來調用函數或計算表達式。
-
setTimeout()：在指定的毫秒數后調用函數或計算表達式。
-
Location
-
介紹：地址欄對象。
-
獲取：使用 window.location 獲取，其中 window. 可以省略。
-
屬性： href：設置或返回完整的URL。
DOM對象
DOM
-
概念：Document Object Model ，文檔對象模型。
-
將標記語言的各個組成部分封裝為對應的對象：
-
Document：整個文檔對象
-
Element：元素對象
-
Attribute：屬性對象
-
Text：文本對象
-
Comment：注釋對象
-
-
HTML中的Element對象可以通過Document對象獲取，而Document對象是通過window對象獲取的。
-
Document對象中提供了以下獲取Element元素對象的函數：
ajax
ajax
Ajax
-
概念：Asynchronous JavaScript And XML，異步的JavaScript和XML。
-
作用：
-
數據交換：通過Ajax可以給服務器發送請求，并獲取服務器響應的數據。
-
異步交互：可以在不重新加載整個頁面的情況下，與服務器交換數據并更新部分網頁的技術，如：搜索聯想、用戶名是否可用的校驗等等。
-
同步與異步
原生Ajax
-
準備數據地址：http://yapi.smart-xwork.cn/mock/169327/emp/list
-
創建XMLHttpRequest對象：用于和服務器交換數據
-
向服務器發送請求
-
獲取服務器響應數據
axios
Axios
-
介紹：Axios 對原生的Ajax進行了封裝，簡化書寫，快速開發。
-
官網： Axios中文文檔 | Axios中文網
請求方式別名
)
異常)
