JS使用
內(nèi)部引用：在 HTML 中嘿般，JavaScript 代碼必須位于 <script> 與 </script> 標簽之間魂仍。
外部引用：將.js文件通過src屬性導入
<script src="/js/myScript1.js"></script>
JS顯示
window.alert() 寫入警告框
document.write() 寫入 HTML 輸出
innerHTML 寫入 HTML 元素
console.log() 寫入瀏覽器控制臺
JS運算
取冪運算符（**）：x ** y 產(chǎn)生的結(jié)果與 Math.pow(x,y) 相同:
JS數(shù)據(jù)類型
Undefined與Null區(qū)別：Undefined 與 null 的值相等，但類型不相等：
typeof undefined // undefined
typeof null // object
null === undefined // false
null == undefined // true
typeof運算符
對簡單數(shù)據(jù)返回：
- string
- number
- boolean
- undefined
對復雜數(shù)據(jù)返回：
- function
- object
JS事件
| 事件 | 描述 |
|---|---|
| onchange | HTML 元素已被改變 |
| onclick | 用戶點擊了 HTML 元素 |
| onmouseover | 用戶把鼠標移動到 HTML 元素上 |
| onmouseout | 用戶把鼠標移開 HTML 元素 |
| onkeydown | 用戶按下鍵盤按鍵 |
| onload | 瀏覽器已經(jīng)完成頁面加載 |
JS字符串方法
indexOf()方法返回字符串中指定文本首次出現(xiàn)的索引（位置）：
lastIndexOf()方法返回指定文本在字符串中最后一次出現(xiàn)的索引：
search()方法搜索特定值的字符串磁滚，并返回匹配的位置：
區(qū)別：search() 方法無法設(shè)置第二個開始位置參數(shù)佛吓。indexOf() 方法無法設(shè)置更強大的搜索值（正則表達式）。
slice(start, end) //提取字符串
substring(start, end) //無法接受負的索引
substr(start, length) //類似于slice()
var text = "Hello".concat(" ","World!"); //concat() 連接兩個或多個字符串：
text.split(","); // 用逗號分隔,將字符串轉(zhuǎn)換為數(shù)組
JS數(shù)字
NAN：指示某個數(shù)不是合法數(shù)。
var x = 100 / "Apple"; // x 將是 NaN（Not a Number）
var x = 100 / "10"; // x 將是 10
isNaN()確定某個值是否是數(shù)：
Infinity
Infinity （或 -Infinity）是 JavaScript 在計算數(shù)時超出最大可能數(shù)范圍時返回的值维雇。
while (myNumber != Infinity) { // 執(zhí)行直到 Infinity
myNumber = myNumber * myNumber;
myNumber.toString(8); // 返回8進制的myNumber
}
var x = 2 / 0; // x 將是 Infinity
toExponential() 方法
toExponential() 返回字符串值淤刃，包含已被四舍五入并使用指數(shù)計數(shù)法的數(shù)字，參數(shù)為小數(shù)點后的字符數(shù)：
var x = 9.656;
x.toExponential(2); // 返回 9.66e+0
x.toExponential(4); // 返回 9.6560e+0
toFixed() 方法
toFixed() 返回字符串值谆沃，指定小數(shù)的位數(shù)：
x.toFixed(2); // 返回 9.66
x.toFixed(4); // 返回 9.6560
toPrecision() 方法
toPrecision() 返回字符串值钝凶，包含指定長度的數(shù)字：
x.toPrecision(4); // 返回 9.656
JavaScript 數(shù)組方法
join() 方法：將所有數(shù)組元素結(jié)合為一個字符串仪芒。
var fruits = ["Banana", "Orange","Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.join(" * "); //結(jié)果為Banana * Orange * Apple * Mango
shift() 方法：刪除數(shù)組的第一個元素（并將所有其他元素“移位”到左側(cè)）：
unshift() 方法：將新元素添加到數(shù)組的開頭唁影。
splice() 方法：用于向數(shù)組添加新項：
第一個參數(shù)（2）定義了應添加新元素的位置（拼接）。
第二個參數(shù)（0）定義應刪除多少元素掂名。
其余參數(shù)（“Lemon”据沈，“Kiwi”）定義要添加的新元素。
刪除元素：
第一個參數(shù)（0）定義新元素應該被添加（接入）的位置饺蔑。
第二個參數(shù)（1）定義應該刪除多個元素锌介。
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi"); //結(jié)果為Banana,Orange,Lemon,Kiwi,Apple,Mango
fruits.splice(2, 2, "Lemon", "Kiwi"); //結(jié)果為Banana,Orange,Apple,Mango
fruits.splice(0, 1); // 刪除 fruits 中的第一個元素
slice() 方法：用數(shù)組的某個片段切出新數(shù)組。
var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(3); //Apple,Mango
var citrus = fruits.slice(1, 3); //Orange,Lemon
數(shù)組排序
sort() 函數(shù)按照字符串順序?qū)χ颠M行排序猾警。（"Apple" 會排在 "Banana" 之前孔祸； "25" 大于 "100"）
比值函數(shù)：定義一種排序順序
比較函數(shù)應該返回一個負，零或正值发皿，這取決于參數(shù)：
function(a, b){return a-b}
當 sort() 函數(shù)比較兩個值時崔慧，會將值發(fā)送到比較函數(shù)，并根據(jù)所返回的值（負穴墅、零或正值）對這些值進行排序惶室。
points.sort(function(a, b){return a - b}); //function(40,100)，計算 40-100玄货，然后返回 -60（負值）皇钞。排序函數(shù)將把 40 排序為比 100 更低的值。
Math.max.apply([1, 2, 3]) 等于 Math.max(1, 2, 3)松捉，即查找數(shù)組中的最高值：
Math.min.apply([1, 2, 3]) 等于 Math.min(1, 2, 3)夹界，即查找數(shù)組中的最高值：
數(shù)組迭代
Array.forEach()：為每個數(shù)組元素調(diào)用一次函數(shù)（回調(diào)函數(shù)）。
Array.map()：方法通過對每個數(shù)組元素執(zhí)行函數(shù)來創(chuàng)建新數(shù)組隘世。（不會對沒有值的數(shù)組元素執(zhí)行函數(shù)掉盅；不會更改原始數(shù)組）
Array.filter()：創(chuàng)建一個包含通過測試的數(shù)組元素的新數(shù)組。
Array.every()：檢查所有數(shù)組值是否通過測試以舒。
Array.some()：檢查某些數(shù)組值是否通過了測試趾痘。（返回boolean）
Array.find()：返回通過測試函數(shù)的第一個數(shù)組元素的值。
Array.findIndex()：返回通過測試函數(shù)的第一個數(shù)組元素的索引蔓钟。
-------function myFunction(value, index, array) {}
Array.reduce()：在每個數(shù)組元素上運行函數(shù)永票，以生成（減少它）單個值。
Array.reduceRight()方法在每個數(shù)組元素上運行函數(shù)，以生成（減少它）單個值侣集。
-------function myFunction(total, value, index, array) {}
var txt = "";
var numbers = [45, 4, 9, 16, 25];
var numbers1 = numbers.forEach(myFunction);
var numbers2 = numbers.map(myFunction);
var over18 = numbers.filter(myFunction);
function myFunction(value) {
txt = txt + value + "<br>";
}
function myFunction(value, index, array) {
return value * 2; //90,8,18,32,50
}
function myFunction(value) {
return value > 18; //45,25
}
Hoisting：在頂部聲明變量键俱！
Use Strict ：嚴格模式
無法在不聲明變量的情況下使用變量；不允許使用為未來預留的關(guān)鍵詞
Let關(guān)鍵字
var x = 10;
// 此處 x 為 10
{
let x = 6;
// 此處 x 為 6
}
// 此處 x 為 10
在相同的作用域世分，或在相同的塊中编振， 不允許用let 重新聲明變量，let 變量也不允許被重新聲明：
var x = 10; // 允許
let x = 6; // 不允許
{
var x = 10; // 允許
let x = 6; // 不允許
}
Const關(guān)鍵字
沒有定義常量值臭埋。定義了對值的常量引用踪央。
因此，不能更改常量原始值瓢阴，但可以更改常量對象的屬性畅蹂。
在不同的作用域或塊中重新聲明 const 是允許的：
JS調(diào)試
console.log() 可在調(diào)試窗口中顯示 JavaScript 的值：
debugger關(guān)鍵詞會停止 JavaScript 的執(zhí)行，并調(diào)用（如果有）調(diào)試函數(shù)荣恐。與在調(diào)試器中設(shè)置斷點的功能是一樣的液斜。
Safari Develop Menu
- 點擊 Safari 菜單，偏好設(shè)置叠穆，高級
- 選中“在菜單欄中啟用開發(fā)菜單”
- 當菜單中出現(xiàn)新選項“開發(fā)”時少漆，選擇“顯示錯誤控制臺”
JS最佳實踐
請避免使用全局變量、new硼被、===示损、eval()
JS常見錯誤
測試對象是否存在：if (typeof myObj !== "undefined" && myObj !== null)
JavaScript 不會為每個代碼塊創(chuàng)建新的作用域。
for (var i = 0; i < 10; i++) {
// 代碼塊
}
return i; //10
JS性能提升
- 減少循環(huán)中的活動
- 減少 DOM 訪問
- 縮減 DOM 規(guī)模
- 避免不必要的變量
- 延遲 JavaScript 加載
